Create an image-only Popup

Showcase your image design with Tydal's completely customizable Email Popup for Shopify.

Laurence Leech avatar
Written by Laurence Leech
Updated over a week ago

Have an image design ready to go, with all the info your customers need? Follow this guide to remove all the elements on the Popup to showcase your image properly.

πŸ“ Note: This kind of Popup will not collect emails or link anywhere. It is a simple "read-only" style popup. It may dismissed with the usual 'x' button as this is not removed in the code below.

  1. From the dashboard, go to Opt-in Popup > Styles.

  2. Add your background image and make sure the layout position is set to 'background'

  3. To remove all the elements of the popup, except the image itself and the 'x' close button, paste the code below into the custom CSS field.

πŸ“ Note: The in-app preview may look different to the live popup due to the size of the app preview field, click the Preview on your Store button for the most accurate view of how it looks on your store.

/* Hide the title and subtitle text */

.ba_widget_content_holder {
display: none !important;
}

/* Hide the email field */

input#ba_widget_email_input {
display: none !important;
}

/* Hide the CTA button */

button#ba_widget_cta_button {
display: none !important;
}

/* Hide the dismiss and footer text */

.ba_widget_footer{
display: none !important;
}

/* Size the Popup to fit the image */

.ba_widget_parent.background {
width: 100%;
height: 100%;
}
Did this answer your question?