45 lines
1.8 KiB
Markdown
45 lines
1.8 KiB
Markdown
# Esun Promotion Popup
|
|
|
|
Configure each Website at `Stores > Configuration > Esun > Promotion Popup`.
|
|
|
|
The selected CMS Block owns the promotion image, copy and CTA. The module owns the modal shell,
|
|
display schedule, audience, frequency, accessibility behavior and responsive styling.
|
|
|
|
## Initial CMS Block
|
|
|
|
Upload these images in the Media Gallery:
|
|
|
|
- `wysiwyg/promotion/welcome-24-desktop.jpg`
|
|
- `wysiwyg/promotion/welcome-24-mobile.jpg`
|
|
|
|
Then create an active CMS Block and add the following HTML in a Page Builder HTML Code element:
|
|
|
|
```html
|
|
<section class="promotion-popup-content promotion-popup-content--welcome"
|
|
aria-labelledby="welcome-promotion-title">
|
|
<div class="promotion-popup-content__media">
|
|
<picture>
|
|
<source media="(max-width: 767px)"
|
|
srcset="{{media url='wysiwyg/promotion/welcome-24-mobile.jpg'}}">
|
|
<img src="{{media url='wysiwyg/promotion/welcome-24-desktop.jpg'}}"
|
|
alt="eSUN new customer promotion"
|
|
loading="eager">
|
|
</picture>
|
|
</div>
|
|
<div class="promotion-popup-content__body">
|
|
<p class="promotion-popup-content__eyebrow">NEW CUSTOMER EXCLUSIVE</p>
|
|
<h2 class="promotion-popup-content__title" id="welcome-promotion-title">Get $24 Off</h2>
|
|
<p class="promotion-popup-content__condition">On Orders Over $299</p>
|
|
<p class="promotion-popup-content__description">
|
|
Create your eSUN account and subscribe to our newsletter to receive an exclusive $24 coupon.
|
|
</p>
|
|
<a class="promotion-popup-content__button" href="{{store url='customer/account/create/'}}">
|
|
Create Account
|
|
</a>
|
|
<p class="promotion-popup-content__terms">
|
|
New customers only. Coupon will be added to My Coupons after successful registration and subscription.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
```
|