# Newsletter Popup

{% embed url="https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da" %}

A subscription popup is a user-friendly feature in your theme documentation that allows visitors to subscribe to updates, news, and important information related to your theme. This non-intrusive form typically appears as a small window or overlay, enabling users to easily input their email addresses and opt-in to receive notifications. Customization options are available to match the popup's appearance to your theme's design.&#x20;

<table><thead><tr><th width="272">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td>Use "Image" to add the image to the section.</td></tr><tr><td>Image layout</td><td><p>Following is the image layout customization of the popup.</p><ul><li>Left</li><li>Right</li><li>Top</li><li>Bottom</li></ul></td></tr><tr><td>Image fit</td><td><p>The image fit customization setting is as follows:</p><ul><li>Contain</li><li>Cover</li></ul></td></tr><tr><td>Limit display</td><td>You can adjust the limit for displaying the popup using the 'Limit display' setting. You can show the popup a minimum of 0 and a maximum of 100 times.</td></tr><tr><td>Limit display сache lifetime (days)</td><td>You can specify the number of days for which the popup will be displayed. Enter the desired number of days here.</td></tr><tr><td>Position</td><td><p>To change the position of the popup, utilize the "Position" setting. Customization of the "Position" in the popup section is as follows:</p><ul><li>Top left</li><li>Top center</li><li>Top right</li><li>Middle left </li><li>Middle center</li><li>Middle right</li><li>Bottom left</li><li>Bottom center</li><li>Bottom right</li></ul></td></tr><tr><td>Desktop content position</td><td><p>To change the position of the content on the popup, utilize the "Desktop content position" setting. Customization of the "Desktop content position" in the popup section is as follows:</p><ul><li>Left</li><li>Center</li><li>Right</li></ul></td></tr><tr><td>Triggers</td><td><p><strong>Trigger open</strong></p><p>Customization of the "Trigger open" in the popup section is as follows:</p><ul><li>Time delay</li><li>Scroll position</li><li>Exit intent</li><li>Manual trigger</li></ul><p><strong>Time delay for a trigger open</strong><br>In these settings, you can define the timing for opening the popup.<br>only when you choose 'Time delay' in the 'Trigger open' settings will it function as expected.<br><br><strong>Open scroll type</strong><br>By customizing these settings, you can specify the scroll type in either pixels or percentages. Customization of the "Open scroll type" in the popup section is as follows:</p><ul><li>Px</li><li>%</li></ul><p><strong>Open scroll position</strong><br>After scrolling a certain number of pixels or a specified percentage, you can add that numerical value here to determine when the popup should open.<br><br><strong>Trigger close</strong></p><p>Customization of the "Trigger close" in the popup section is as follows:</p><ul><li>Time delay</li><li>Scroll position</li><li>None</li></ul><p><strong>Time delay for a trigger close</strong><br>In these settings, you can define the timing for closing the popup.<br>only when you choose 'Time delay' in the 'Trigger open' settings will it function as expected.<br><br><strong>Close scroll type</strong></p><p>By customizing these settings, you can specify the scroll type in either pixels or percentages. Customization of the "Close scroll type" in the popup section is as follows:</p><ul><li>Px</li><li>%</li></ul><p><strong>Close scroll position</strong><br>After scrolling a certain number of pixels or a specified percentage, you can add that numerical value here to determine when the popup should close.</p></td></tr><tr><td>Style</td><td><p><strong>Width</strong><br>Use this option to increase or decrease the popup width. You can set a minimum of “200px” and a maximum of “1920px”.<br><br><strong>Open animation</strong></p><p>Customization of the "Open animation" in the popup section is as follows:</p><ul><li>Fade</li><li>Slide</li><li>Zoom </li><li>Slide and fade</li></ul><p><strong>Close animation</strong></p><p>Customization of the "Close animation" in the popup section is as follows:</p><ul><li>Fade</li><li>Slide</li><li>Zoom </li><li>Slide and fade</li></ul><p><strong>Show overlay</strong><br>When this checkbox is enabled, the overlay will be displayed when the popup is triggered.</p></td></tr><tr><td>Advanced</td><td><strong>Mobile disable</strong><br>When 'Mobile disable' is enabled, the popup will be disable on mobile.<br><br><strong>Disable scrolling</strong><br>When 'Disable scrolling' is activated, it will disable scrolling on the body of the page.<br><br><strong>Click overlay to close</strong><br>Enabling this option will cause popup to close when user clicks on overlay.<br><br><strong>Press ESC to close</strong><br>Checking this will cause popup to close when user presses ESC key.<br><br><strong>Press F4 to close</strong><br>Enabling this option will cause popup to close when user presses F4 key.<br><br><strong>Show on homepage</strong><br>By checking this checkbox, the popup will only be displayed on the homepage.<br><br><strong>Show on product and category</strong><br>By enabling this checkbox, the popup will only be displayed on the product and category page.<br><br><strong>Show on all pages</strong><br>Enabling this checkbox will display the popup on all pages except for the customer page.</td></tr><tr><td>Color scheme</td><td><p>The newsletter popup section background color appears behind the text:</p><ul><li>Accent 1</li><li>Accent 2</li><li>Accent 3</li><li>Background 1</li><li>Background 2</li></ul></td></tr></tbody></table>

<figure><img src="https://895706505-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0PKM9UHryXjPN3UYSTy0%2Fuploads%2FKFWSMzaFzQKVYHi2Qbgz%2Foverlay-popup.png?alt=media&#x26;token=3f0d058b-8d7f-49a3-ac9a-b050b1b194cc" alt=""><figcaption></figcaption></figure>

## Add block

To add block to the Popup section, click on the 'Add block'. There are many options available , as you can see in the below points and screenshot.&#x20;

<table><thead><tr><th width="272">Block</th><th>Description</th></tr></thead><tbody><tr><td>Heading</td><td><strong>Heading</strong><br>Enter text to display as a title on the popup section.</td></tr><tr><td>Subscribe form</td><td><p>Click on the "Add block" and select the Button.</p><p></p><p><strong>Description</strong><br>Enter text to display as a description on the popup section.</p><p></p><p><strong>Placeholder input</strong><br>Enter text to display as a placeholder input on the popup section.<br><br><strong>Button label</strong><br>Use "Button label" to add a label to the Button in the section.<br></p><p><strong>Show button in full width</strong><br>Enabling this checkbox to display full width button.</p></td></tr><tr><td>Social links</td><td>Click on the "Add block" to display the social icons.</td></tr></tbody></table>

<figure><img src="https://895706505-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0PKM9UHryXjPN3UYSTy0%2Fuploads%2FWWhC55gLnw3WcnWyEdjS%2Foverlay-popup-block.png?alt=media&#x26;token=2b52decf-ca99-4ebf-9972-656477216e14" alt=""><figcaption></figcaption></figure>
