Create a Popup on Webflow
to Maximize Conversions
Webflow is a web-based drag and drop tool for building responsive websites without any coding knowledge. In other words, it is an application that allows you accomplishment in all aspects of web development. This is why Webflow is so loved by lots of website owners!
Furthermore, Popupsmart's popup editor is easy-to-use, which means you do not need to be a designer in order to create conversion-driven popup campaigns for your e-business.
We also offer lots of advanced features, like different targeting options, for you to work with a better popup builder.
Lots of webmasters have already chosen Popupsmart to have high converting popups on their Webflow website. Guess what? They have maximized their digital conversions relatively. This could be you, too!
The following article with exhibitory images explains how to create a Webflow popup via Popupsmart or via the Webflow Panel.
How to Create a Webflow Popup with Popupsmart?
Let's have a look at how to create a smart popup in Webflow via Popupsmart's builder;
2. Log in to your Popupsmart account.
3. To create your first popup, install the embed code between the header tags of your websites. Moreover, you can easily place the embed code on your website via Google Tag Manager.
This is a one-time necessity, so you can use the same embed code for all your websites as well as all your future popup campaigns.
4. Click on "Create a New Popup" on your Popupsmart account dashboard.
5. Select a business objective for your popup campaign. Design options may differ for creating an optimized popup design according to your business objective.
6. Edit the properties of your popup design, such as form fields, font options, buttons, display effects, and display sounds via "Design Tab."
8. Through the "Display Tab", determine when you want to show popups to visitors and which audience group you'd want to show your popup campaigns to.
9. Connect your Popupsmart account with applications such as MailChimp and Zapier or with a webhook on the "Integrations Tab."
10. Observe the number of popup impressions, popup displays, actual conversions, and your campaign’s conversion rates instantly via the "Analytics" Tab. Additionally, you can easily measure the effectiveness of your popup campaign thanks to our Popup ROI Calculator.
11. After completing the editing process, go to the "Publish Tab" and turn on Status toggle. Then, through the ‘Platform’ section, choose "Any Website" and copy the provided code to your clipboard.
12. Log in to your Webflow website admin panel.
13. Click "Custom Code" on your dasboard's context menu.
14. Paste the popup code on your clipboard to the
15. Then, click on "Save Changes."
If you would like to add your popup to just one page, switch to Designer mode.
Click on "Pages" and write the name of the page that you wish to display your popup on.
Scroll down and reach the "Inside Head Tag" under the "Custom Code" addition option.
Lastly, save changes and check if the popup appears properly.
Now, it is time for you to grab a cup of coffee and enjoy maximizing your sales with Popupsmart's conversion-ready popups!
Note that to add a custom code to your website, you need to have an existent paid site plan or switch to an upgraded account plan.
How to Create a Webflow Popup with the Webflow Design Tab?
I would like you to have a look at how to create a popup in Webflow via the Design tab.
Well, it is a bit of a complicated process; therefore, the best approach is to recommend you a video so you can follow the each step carefully;
I hope this guide on how to make a popup in Webflow proves useful for you to create high converting popups and maximizing your sales!
In case you want to take a look at how to add popups using different website builders, check the articles below:
