With Reloadify's pop-up functionality, you collect e-mail addresses from website visitors who have not yet made a purchase. A common method is to offer website visitors a discount in exchange for their email address.
In this article you will read how to activate the pop-up module in Reloadify.
Connecting the pop-up module
Before you can create a pop-up, you need to enable the pop-up module. To display the pop-up on your shop, you need code on your website.
In Reloadify, go to Data sources > Import.
Behind Popup, click on the three dots and choose Show script.
A script will appear. Copy the script and paste it into your webshop's code (preferably under existing scripts). It depends on the webshop whether the code should be in the head or body.
Is your webshop running on Lightspeed? Then the script is automatically placed on your webshop. All you have to do is connect the pop-up module (step 1 + step 2).
Do you notice that your website seems slower after connecting a pop-up? In that case, you can add Async or Defer to your pop-up yourself.
Async and defer both load JavaScript asynchronously without render blocking. This ensures that the pop-up can be downloaded at the same time as the rest of the page.
Async is executed as quickly as possible. This means that as soon as the page is downloaded, the pop-up is displayed.
Defer waits for the page to be parsed. After that, the pop-up is shown.
You do this by adding “async” or “defer” to the pop-up script. For example:
<script src=“your-reloadify-script” async></script>
WooCommerce
Go to the admin panel of your WordPress site and follow these steps:
Navigate to Appearance > Theme Editor (or use a child theme).
Open the
footer.phpfile.Add the script right before the closing
</body>tag.Save the changes.
Shopware
Use a child theme of your active template.
Add the script to
footer.tplorbase.html.twig, right before</body>.Clear the cache in the Shopware admin panel after adding the script.
Magento 2
Go to the admin panel or use FTP/SSH access.
Add the script to
default_head_blocks.xmlor via a custom module/layout:Place it in:
app/design/frontend/Vendor/theme/Magento_Theme/layout/default_head_blocks.xml
Example:
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://app.reloadify.com/assets/popup.js?reloadify_account_id=YOURID" src_type="url" /> </head> </page>
Redeploy static content and clear the cache.
Lightspeed eCom (C‑Series)
Log in to your Lightspeed back office.
Go to Settings > Website Settings > Web Extras.
You have two options for adding scripts:
Custom JavaScript: added just before the closing
</body>tag.Custom Head Code: added inside the
<head>section (useful for trackers or tags).
Choose Custom JavaScript and paste the loyalty script like this:
<script src="https://app.reloadify.com/assets/popup.js?reloadify_account_id=..."></script>
Save. The script will now load on all pages, just before
</body>.
Shopify
Go to Admin → Online Store → Themes → Actions → Edit Code.
Under the Layout folder, open the
theme.liquidfile.Look for the closing
</body>tag and insert your script before it, for example:<script src="https://app.reloadify.com/assets/popup.js?reloadify_account_id=..."></script>
Save the changes.