Add engaging popups to your Webflow website

Popups and banners can showcase offers, highlight important content and prompt visitors to act. Here is how to add a Pagecloud popup to your Webflow site.

Updated May 8th, 2024

Browse popup templatesJump to the steps

Why implement a popup strategy

Popups and banners can benefit your website and your business in a few clear ways.

  • Enhance engagementPopups draw attention to key messages, offers and content so visitors engage more deeply.
  • Increase conversionsWell-timed, well-designed popups can persuade visitors to buy or subscribe.
  • Collect valuable leadsAn excellent way to gather email addresses and contact details for future marketing.
  • Improve the experienceDone properly, popups provide timely, relevant information to visitors.

Getting started with your popup strategy

To implement a popup strategy on your Webflow website, follow these steps.

  • Set clear objectivesPick the goal, whether that is boosting sales, growing your email list or promoting a new product. It guides your design and placement.
  • Know your audienceUnderstand what your visitors need and offer valuable incentives such as discounts, exclusive content or helpful tips.
  • Design with careKeep popups easy to read, with a clear call to action, and make sure they complement your site without disrupting the visit.
  • Test and refineUse analytics to track performance and make data-driven improvements.

Configure Pagecloud

To show a Pagecloud popup or banner on a site hosted elsewhere, you configure it in Pagecloud first, then add its code to Webflow.

  • Configure your domain name
  • Define the pages you want the popup to display on
  • Copy the embed code to use on your site

Add your domain name

  1. Go to your Pagecloud dashboard.
  2. Select your project and click Banners and Popups in the left menu.
  3. Click Settings on your banner or popup.
  4. In Setup, make sure you’ve connected your domain name in the Where to display section.
The Banners and Popups list in the Pagecloud dashboard, with Edit design and Settings buttons.
The Where to display step in Pagecloud Setup, showing a connected domain.

Select pages

Once a domain is connected, choose the pages where the popup or embed displays: every page, or only some. We recommend Include pages, which lets you pick individual pages without making more updates to your website.

  1. Select Include pages.
  2. Click + Add pages.
  3. Add the name of your page.

You can also use wildcards in the form /mypage*, which matches /mypage, /mypage2 and so on.

The Where to display options in Pagecloud with Include pages selected and one page added.

Copy the embed code

Find your embed code in your Pagecloud dashboard, at the bottom of Setup or in the left toolbar.

Configure Webflow

You can add a Pagecloud banner or popup to every page in your Webflow site from your site settings. Then you manage the appearance and location of the banner or popup from your Pagecloud dashboard, with no future changes to your Webflow settings. In the Webflow dashboard:

  1. Go to Site settings, then Custom code.
  2. Add your Pagecloud embed code in the Head code section.
  3. Click Save changes.
The Custom code settings in Webflow with the Head code field.

Don’t have a popup yet?

It’s easy to get started. No code required, easy to set up and we’re here to help along the way.

Browse popup templates
  1. Step 1Choose a templateSave time with a popup template that fits your needs. All templates are easy to customize.
  2. Step 2Make it yoursSet up how, when and where you want your popup to display, then customize the design to fit your brand.
  3. Step 3PublishPublish your popup to your website, then watch your analytics and conversions roll in.

Frequently asked questions

How do I get started with Pagecloud Popups?
Open your Pagecloud account, choose a template and make it yours. Popups are built and managed in Pagecloud Classic.
How do I build a Pagecloud popup?
Building a popup in Pagecloud is simple. Drag and drop content, click to edit, and publish without code.
How do I publish a Pagecloud popup?
You choose where your popup displays on your website. That includes which pages and how the popup triggers.
Can I use Pagecloud Popups on an external website?
Yes, on any website. With just one line of code you can embed a Pagecloud popup on your site.
Do I have to change my Webflow settings every time I change pages?
No. With the code in your site’s Head code, you manage the popup’s appearance and pages from your Pagecloud dashboard.

Your next popup is a template away.

Pick a design, make it yours and publish it from your Pagecloud account.

Browse templatesGet started

Your choice applies to pagecloud.com. You can change it any time from Cookie settings at the bottom of every page.