Tydal's email popup allows you to grow your customer list by collecting email addresses when a user visits your store. You can customize just about everything on the popup and incentivize signups by adding discounts. Tydal's popup is slick, quick and easy to use and this guide will get you started with the basics!

This article will explain what every area of the app does, what it controls, and how to use it. If you're looking for even more customizing using CSS make sure to check out our Tips and Tricks as well as our Premade Themes.

Dashboard

The first thing you'll see when you log into Tydal Popups is your dashboard metric data. The metrics displayed here are:

Views
This is the total number of all views for the popup. This includes views from users who have not subscribed yet and repeat views from the same device.

Emails Captured

The total number of all emails collected through the popup. You can view the complete list on the Subscribers page.

Menu

Navigate around the app using the sidebar menu on the left side of the screen. From here you can go to the different sections of the app:

Dashboard

This is the Home page section of the app. From here you can view your dashboard metrics.

Opt-in Popup

Edit and customize your opt-in popup form here.

Subscribers

View a list of customers who have subscribed through the popup.

Settings

Resync the app to your theme from this page.

Customize your opt-in popup form here, including the texts, colors and images. You can fine-tune just about everything to tailor the opt-in popup form to be consistent with your brand style and voice. From this screen you can also add a discount to the popup and adjust the popup's display frequency.

Use the opt-in popup form to collect customer's email addresses and add them to your subscriber list in Shopify.

Widget Status & Name

You can toggle the widget on or off by clicking the green switch. When the widget is toggled ON, the popup will display on your website according to the trigger and display frequency that you've configured. We'll go through these settings below.

The name you choose for your widget will only be visible to you. Your customers will never see this name, so feel free to get creative.

The dismissible option is an "X" close button that displays in the upper right corner of the popup. Checking this box means you're allowing potential subscribers to close the popup if they don't wish to subscribe.

Under the coupon code settings you can choose between a few variations of coupons.

Selecting No Coupon means customers will only successfully subscribe to your marketing emails, without receiving a coupon. We recommend using coupons as a way to incentivize customers to return and make a purchase.

Selecting the Discount Coupon setting means you can select a Fixed Amount – for example $10 off. Or you can select a percentage off, for example 10% off. These are one-time coupons and are generated uniquely for each customer that subscribes through the popup. These automatic codes will begin with a prefix of BOOST- followed by a string of random letters and numbers. You can add an expiration to your discount codes by selecting Set expiration on discounts and entering a number of days the discount is valid for, after which it expires.

For more customization, you can add your own discount code by selecting Enter code manually. You can create a custom coupon code in your Shopify admin, under Discounts.

Sticky Coupon Bar

Once a user has successfully subscribed, you can choose to display their discount code on a sticky bar at the top of the page. Under Sticky Coupon Bar, select Show and enter in the text you would like displayed on the bar. The sticky bar will be displayed until the customer copies the code to their clipboard or dismisses it by clicking the 'X' close button.

Closed State

The closed state is the action of the popup when it's closed by an unsubscribed customer. For example, if a customer is browsing on your website, and chooses to decline the offer on the popup, this setting determines what the popup will do.

To close the popup completely select the Close Widget option. To Show a Sticky Bar/Button on your website after a potential subscriber closes the popup, choose Show Sticky Bar.

You can also customize the text, font size, offset and display position of the Sticky Bar on your store.

The Trigger determines when the popup will appear for your store's visitors. The Display Frequency is how many times the widget will show on a browser for a non-subscribed customer in a predefined period of time.

For example, let's say you had the trigger Show on a timer set at 15 seconds, and the Display frequency set at 2 times per day. This means that if a potential subscriber came to your website from the same web browser twice in one day, the popup would show 2 times for them, after 15 seconds. However the popup wouldn't show to that same potential subscriber again, if they visited your website a third time in the same 24 hours. The Limit number is distributed evenly across the timeframe chosen, e.g. if you have set the limit to 2 times per day, the second popup will display after 12 hours.

Show on a timer

This trigger sets the popup to display after a certain amount of time. **Immediately** means that as soon as your customers land on your website, the Opt-in Popup will appear. You can set the delay to 0, 3, 5, 10, 15, 30 or 60 seconds. We recommend setting the popup delay to be between 15 and 60 seconds for the best browsing experience.

Show on exiting the page

This trigger sets the popup to display when a visitor intends to navigate away from your site. Once their mouse cursor moves to the upper bounds of the browser, where they may close and change tabs, the popup will then appear. This is a great way to retain customers who may otherwise leave your store. This trigger works on desktop only and can not be used in conjunction with the timer trigger.

Display Frequency

The display frequency decides the number of times the Opt-in Popup will show for a non-subscribed customer. Here you can adjust the number of times the popup shows per minute, hour, day, week, month and year for a customer that's not subscribed.

Choose whether your popup appears on any page in your store or only on certain pages using using display rules.

Show on any page

Selecting this means that the popup will appear on any of your store's pages.

Show on specific page

By selecting this you can set certain rules that determine on which page(s) the popup will appear or not appear.

Page is equal to

Add the base path for URLs you want the popup to appear on. E.g. to show the popup on your collections pages, enter _collections_ here.

Page is not equal to

Add the base path for URLs you do not want the popup to appear on. E.g. to exclude the popup from your product pages, enter _products_ here.

Page contains

Enter a path or path segment value to show the popup on URLs that contain that value. E.g. to show only on a `/collections/blue` page enter _blue_ here.

Page not contains

Enter a path or path segment value to exclude the popup on URLs that contain that value. E.g. to exclude the popup only from your `/pages/contact` page enter _contact_ here.

Page is homepage

Use this rule if you want the popup to appear specifically on the homepage only.

Page is not homepage

Use this rule if you want the popup to appear on any page _except_ for the homepage.

Add your style and voice to the popup

Initial State

The Initial State is the first screen a non-subscribed customer will see when the popup appears for them. Here you can customize the text and copy on the widget according to the discount and offer that you'd like to promote.

Success State

The Success State is the screen a subscribed user will see after they enter their information in the popup. You can customize the Title, Body, Button text and the Action you'd like the button to do when a website subscriber clicks it.

Error Message

If a potential subscriber enters incorrect information, such as an invalid email address, this is the error message that will show.

Here's the fun part – in the Styles tab, make it yours and match your own website colors and brand style.

Display

Under Display you'll notice options to choose from a selection of Fonts. As well as Modal Size (Width) and content alignment of the popup (Left, Center, Right). Play with these to see which looks the best.

Colors

In Colors, you can customize just about every element of the Opt-in Popup. Pick a hex code or choose from predefined colors in the color picker. Simple is key! Try to match the colors that your website and brand already use to the popup.

Under colors, you can also choose the styles of the Show Sticky Bar setting mentioned above.

Logo

If you have a logo or an icon, upload it here. The uploader accepts files that are 60px by 60px.

Background image & Layout

Here you can upload an image and choose how it displays on the widget. Use your own product photography, or if you'd like something more general, take a walk over to unsplash.com and burst.shopify.com for image inspo!

Will the Opt-in Popup show on mobile devices?

Yes! You can preview what the modal looks like on mobile devices by toggling the mobile preview on the right side of the screen.

Can I open the Opt-in Popup from a link, button or page?

Not yet! But this is on our roadmap as a future feature. Create and vote on your favorite features at here.

Sometimes when a Shopify theme is changed or updated, an app's code needs to be refreshed in the new version of the theme. To ensure the app is synced to your theme, go to Settings and click Sync Store. Please allow 30 seconds for the sync to complete.

If you would like to view the popup as a first-time visitor to your store would, you can clear your browser cache and refresh the page, or view your store in a private/incognito window.