There are two ways of triggering a popup by clicking a button on a website, each one is detailed below:

This option uses an embedded campaign to add a ConvertFlow button to the website.

Start by creating the popup that the button should trigger. These popups are usually in an overlay format as they will provide a better experience for the visitor. Set the popup's trigger to "Upon click only", then activate and target it to the page where the button is embedded:

Once the popup campaign is ready, create a separate embedded campaign with a single standalone button. The button can be styled to match the website's native buttons so it blends seamlessly with the rest of the site, making sure the background opacity is set to 0:

Head to this article for details on how to change a background's color, opacity, and image →

Then, use the button's action options and select "Display another campaign", then find the overlay campaign that needs to be triggered:

The button is now ready to be embedded on the site, using the full embed code so all visitors can convert with the button or area snippets to target the button to specific visitor segments.

This article will explain in more detail how to create, edit, and launch an embedded campaign →

Similarly, as with the ConvertFlow button, start by creating the popup that the button should trigger. Set the popup's trigger to "Upon click only" and copy the trigger class data from the campaign's settings:

Then activate and target the popup to the page where the button is embedded.

NOTE: We cannot provide instructions on how to add a trigger class to all non-ConvertFlow buttons because the process varies depending on the website builder and being theme used. Some will require CSS, Javascript, or some may have the field available to add classes directly.

In this example, the website is built in WordPress using the "Twenty twenty one" theme. Where the button block's advanced settings has the option to add extra CSS classes to a field: