After filling up all the details and steps of your Viral Loops campaign, the last one that you are going to reach is the “Installation” step:

When reaching the “Installation” step, select the “I’ll do it myself” option:

You now have to manually install your campaign javascript snippet in your website.

Don’t feel overwhelmed, there’s nothing to worry about, it’s a simple process that we’re going to go through. 

You should continue by copying the unique snippet that we have generated for you:

The next step is to login in to your Webflow account and select the project that you are willing to install your campaign to, via your Webflow Projects Dashboard:

You should then access the desired page that you’re willing to install your Viral Loops campaign via the top-left-corner menu;

After accessing the page, you should hover your mouse on the right side of the menu that appears and select the gear icon (for the specific page), as shown below:

When selecting the gear icon, a new menu should expand and it’s now the time to paste the unique snippet that you previously copied from your Viral Loops Installation page, into the “Before </body> tag” section:

Now that your campaign's unique snippet is installed, we should move on to the next steps of our installation.

It’s now time to place your Viral Loops Form Widget that users will use in order to opt-in to your campaign.

To do that, you should navigate again to the page you’re willing to use for your campaign and select the section that you’re about to embed your Viral Loops form widget:

It’s now time to embed your unique form’s HTML code which is found under the "Form widget” section on your Viral Loops Installation page:

In order for you to be able to install your Form Widget’s HTML code, you should first make the desired section compatible with your HTML code.

To do that, you should select the “Add” (+) from the left top corner again and then select the “Embedded” option that is available;

To properly install the Embedded component, you should just drag and drop it in the section.

❗Please note that the Embedded component option, is only available for paid Webflow accounts.

After that, in order to access Webflow’s code/HTML window, you should navigate to the section you dragged & dropped the Embedded component, hover and select it’s gear icon;

You should then paste your Form’s widget code to the Code editor that pops up and after that, select “Save & Close” the option.

Your form widget is now ready, and it’s now time to install your Milestone widget.

In order to install your Milestone widget, you should follow the same process, but as it’s normal, in the embedded section, you have to place your Milestone widget’s HTML code this time.

Again, you can find this one in the “Installation” step of your Viral Loops campaign;

In addition, as you can understand, you have to hover over to the specific’s section embedded code gear icon this time and paste the HTML in the editor that will pop up;

Click Save and Close.

The example landing page that I’ve used to guide you through, is inspired by Harry’s and it looks like this:

In case you’re willing to supercharge your landing page, and for your customers to be able to see their referral count, you can replicate the above process and install your Referral Count Widget.

Just make sure that you install your Referral Count Widget’s HTML on the section you wish to show it.