Courses → How to install ConvertFlow on your website

How to install ConvertFlow on your website

Jonathan Denney

Jonathan Denney leads product at ConvertFlow. After running a conversion marketing agency, Jonathan co-founded ConvertFlow with his brother Ethan Denney to help brands build conversion funnels without code or waiting on developers. Since then, ConvertFlow's no-code funnel builder has helped launch 100k+ conversion campaigns, across brands such as Volkswagen, NectarSleep, CampingWorld and more.

Once you’ve created a CTA, hit the launch button and you’ll be given a code, that you’ll want to place between the head tags of your website.

You can also find this by clicking Settings > Install code and then copying it from the selection box.

This is the ConvertFlow tracking code. Each website dashboard you manage in ConvertFlow has it’s own unique tracking code that needs to be placed on the website.

Once it’s installed, it will automatically track your website visitor’s activity, launch your popup CTAs, and it will also identify contacts on your website to track their activity, by looking for email field submissions, whether they’re submitting ConvertFlow forms or not.

Installing the ConvertFlow code is a little bit different for each website CMS you use. In this video, I’ll cover placing ConvertFlow in the top website CMS’s. If your CMS isn’t covered, you’ll probably find similar code placement controls that you can use.

WordPress

WordPress is the most popular website CMS, so chances are you’ll be integrating ConvertFlow with WordPress.

Adding ConvertFlow to WordPress is easy.

Just head to the plugins area of your WordPress site, search for "AddFunc Head & Footer Code", install the plugin, and activate it.

Then, head to  Settings > Head & Footer Code to install your ConvertFlow site code.


With your ConvertFlow script copied, paste it in the "Head code" field. Then click "Save".

ConvertFlow will now start tracking your website visitors, and your CTAs can be displayed.

Shopify

The next most popular website CMS is Shopify, which is used by ecommerce stores.

To add ConvertFlow to Shopify, click the “Online Store” link in the admin navigation, then click “Themes”.

For your current theme, to the right, click “Actions”, “Edit Code” and then click to the theme.liquid file.

Scroll through the code and paste the ConvertFlow script before the closing head tag, which is followed by the opening body tag.

Google Tag Manager

Another commonly used tool is Google Tag Manager, which is this handy free tool you can use to consolidate all of your website’s marketing, tracking and advertising scripts into an easy to use interface made for marketing teams.

To add ConvertFlow to Google Tag Manager, click "New", name the tag "ConvertFlow", choose "Custom HTML tag", paste the script code within the HTML field and click "Save".

Make sure that your trigger options for the tag are set to "Once per page" and the script fires on all pages.

Once you’re done, make sure to click the “Publish” button so your changes take effect.

Embedding CTAs

Once you’ve got the ConvertFlow tracking code installed, the next piece of code you may end up needing to install is embed codes for your embedded CTAs.

You have 2 options for embedding CTAs:

  1. Using a direct embed code for embedded CTA
  2. Or, you can use area snippets and targeting conditions

While using the direct embed code works fine when you're adding a CTA that you want to display for every visitor seeing a specific page, it isn't a scalable workflow for displaying CTAs on a website across many pages.

Area snippets make it a breeze to display embedded CTAs at the right place and time, without having to revisit your website code, just like how you can with popups.

Area snippets can be installed in predefined parts of your website, such as your sidebar, your home page's footer, at the bottom of your blog posts, etc.

When launching an embedded CTA, you’ll have the option to target the CTA to areas, as well as add targeting conditions to control in who sees the embedded CTA and on what pages it can show on.

You can also find and manage your website's areas, by heading to Settings > Install Code and scrolling down.

Quick recap

Each website managed has a unique ConvertFlow tracking code, which needs to be placed for your popups to be able to launch, and for your visitors to be tracked.

Embedding CTAs is quick using a direct embed code. However, everyone will see CTAs embedded using a direct code.

For a better workflow and more control, you can place area snippets in predefined parts of your site, and start conditionally showing embedded CTAs to visitors based on the pages they're visiting, what contact segments they're in and more, helping you better personalize your website content for every visitor.

And that’s how to install ConvertFlow code on your website.

Next Lessons In Course