How to Add Custom Popup in Shopify?

To add a custom popup in Shopify, you can follow these steps:

1. Log in to your Shopify admin panel.
2. Go to the “Online Store” section and click on “Themes.”
3. In the “Themes” page, click on the “Actions” button and select “Edit code” from the dropdown menu.
4. In the code editor, locate the “Layout” folder and click on it to expand it.
5. Look for the “theme.liquid” file and click on it to open it.
6. Scroll down to find the `` tag and add the following code just before the closing `` tag:

“`html

“`

7. Save the changes to the “theme.liquid” file.
8. Now, go back to the “Layout” folder and click on the “theme.scss.liquid” file to open it.
9. Scroll down to the bottom of the file and add the following CSS code:

“`css
#custom-popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
padding: 20px;
z-index: 9999;
/* Add any other styling you want for your popup */
}
“`

10. Save the changes to the “theme.scss.liquid” file.
11. Now, you can customize the content of your popup by adding HTML and CSS within the `