Different types for embedding UpViral into your website are available. This article helps with two things:

  • Choose the embed type that fits your needs
  • Find the right article for your case that shows you how to embed UpViral into your website


You can use all embed types at the same time

For one single campaign, it is possible to use different embed types on multiple websites at the same time. The websites you create in UpViral can be embedded in multiple different ways into multiple different websites. You design the pages of your campaign one time and then you can use different embeddings in multiple places for different purposes.


This means, you can send traffic to all of the following places at the same time:

  • The version of your campaign pages that are hosted by UpViral
  • The version of your campaign pages that you can embed in different ways on your own website or websites
  • Your own opt-in forms, which can be used to collect leads within your UpViral campaign by connecting them to UpViral


Step 1: UpViral opt-in form vs. your own opt-in form

You use an UpViral opt-in form or an opt-in form that is already on your own website. 


UpViral opt-in form:

If you choose to use an UpViral opt-in form, you will have to design the opt-in page and the share page within the UpViral drag & drop editor. Then you can embed these pages into your website, either in a Standard Embed, a Popup, or a Popover.


Your own opt-in form:

You can use an opt-in form of your homepage builder, a third-party opt-in form that you embedded into your website, or an opt-in form you programmed yourself. With the help of an embed code, UpViral will use these opt-in forms for the UpViral campaign. Everyone who signs up via these forms will automatically sign up to your UpViral campaign just like he would have signed up via a regular UpViral opt-in form. You can connect external opt-in forms to UpViral via the Universal Capture or via the HTML form.


Step 2: Choose your embed type

Here you find a description of all embed types for both cases: If you want to use the UpViral opt-in form or if you want to use your own opt-in form. You will find a description, a list of pros and cons, and links to articles that explain to you how to use this embed type step-by-step.


Standard Embed (UpViral opt-in form)

Here the UpViral campaign is shown in a section (an iframe) of your website. You can decide for yourself about the size and the position of that section. Either you set its height and width to absolute pixel values (e.g. 600px x 400px) or you define its height and width as a percentage relative to the <div> container you place it in.



Pros

  • Shows the UpViral opt-in or share page in a section on your website and therefore it is always visible
  • You can decide about the height, width, and positioning on your website


Cons

  • It takes up real estate on your website
  • It might influence the arrangement of content and the design of your website
  • If there are too many other things on the same website, visitors might not see the campaign or think it is an ad


What happens after the sign-up?

You can choose what happens after the lead has clicked on the submit button of your sign-up form. Either the UpViral widget refreshes and shows the share widget instead of the opt-in widget or it redirects to a different website where you can embed the share page of your campaign as a share widget - just like you embedded the opt-in page before that.


How to install the Standard Embed:


Popup (UpViral opt-in form)

Another possibility is to show your UpViral opt-in page inside a popup on your website. You can decide to either open this popup with the click on a button (button text example: "find out more" or "yes, sign me up") or just open it automatically after your website loads. You can also delay this automatic opening of the Popup.



Pros

  • The Popup does not affect the design or the arrangement of the content on your website. 
  • It doesn't take up real estate
  • If you set it to "open automatically upon page load", it will be the most prominent solution of all embeddings. In this case, the conversions are very likely to be the highest. If you open it with the click of a button, its prominence and the conversion rate depend on the placement of the button


Cons

  • If you open the Popup with the click of a button and the button is not very prominent on your website, you might have low conversion rates
  • Visitors that are not interested in the campaign might be annoyed by a popup that opens automatically and prevents them from doing what they initially intended to do
  • There is less space for your UpViral campaign pages inside the Popup


What happens after the sign-up?

You can choose what happens after the lead has clicked on the submit button of your sign-up form. One option is that the UpViral widget refreshes and shows the share widget inside the same popup instead of the opt-in widget. As a second option, you can redirect the participant to a different website where you can add the share page as a Standard Embed to this website.


How to install the Popup:


Popover (UpViral opt-in form)

A Popover is like a Popup, but it opens on the side of the page without putting a dark overlay on the website. The visitor can still use the website where it is not covered by the Popover. The Popover is opened by a button, which says "Unlock Rewards" for example, and hovers above the content of your website. You can either open the Popover upon page load, with a certain delay, and/or with the click on the hovering button.



Pros

  • It does not affect the design or the arrangement of the content on your website. Just drop the code and you're done
  • It doesn't take up real estate on your website 
  • It can be opened automatically after the page loads or after an arbitrary amount of seconds after the page loads. The movement of opening the Popover will capture the attention of the page visitor


Cons

  • It is less prominent than other options, so the conversion rate will be lower. The content of the website is visible and clickable while the Popover is opened. There multiple things are competing for the visitor's attention and therefore the conversion rate will be lower
  • There is less space for your UpViral campaign pages inside the Popover


What happens after the sign-up?

You can choose what happens after the lead has clicked on the submit button of your sign-up form. One option is that the UpViral widget refreshes and shows the share widget inside the Popover instead of the opt-in widget. As a second option, you can redirect the participant to a different website where you can add the share page as a Standard Embed to this website.


How to install the Popover:


Universal capture (use your opt-in form)

Just drop the code on your website and connect it to the UpViral installation section on the publish page. It will read out the data of your opt-in form. When the participant submits the form, the data the campaign participant enters into the form will be sent to UpViral AND to your website/server.


Pros

  • You don't have to design an opt-in page. You just use your own website with your own opt-in form
  • The sign-up data is sent to UpViral AND to your own website/server. You don't have to send the data from UpViral to your CMS or autoresponder after the sign-up of a lead. Upon submission, the lead data is sent to both locations immediately
  • Any embed code is able to do the job of the Universal Capture. For example, if you want to read out the opt-in form of your own website and want to add your UpViral campaign inside a popup on the same website, just embed the Popover code and it will do the job of the Universal Capture as well


Cons

  • If you want to use the power of the UpViral drag & drop editor, you can only use it for the share page in this case. The opt-in form has to be designed within your homepage builder or you code it yourself
  • Secure checkout forms, some homepage builders, or self-coded sign-up forms might not be supported by the Universal Capture


⚠️ Some forms and homepage builders are not supported ⚠️

  • Secure checkout forms cannot be connected. With their encryption, it is impossible to extract data from them
  • If you code an opt-in form yourself, please make sure it is coded according to general coding conventions to help UpViral to detect it properly
  • Some homepage builders and third-party opt-in forms are not supported. This is the case when the developers there don't adhere to universally accepted coding conventions


What happens after the sign-up?

In the case of the Universal Capture, you don't have multiple options here. After the sign-up, the participant will be redirected to a different website. On this website, you can embed the UpViral share widget as a Standard Embed.


How to install the Universal Capture:


HTML form (use your opt-in form)

If the Universal Capture does not work in your case, you can try the HTML form. It is more difficult to set up, but it works in more cases than Universal Capture. We only recommend using it, if the Universal Capture does not work


Pros

  • Works in cases where the Universal Capture does not work
  • You don't have to design an opt-in page. You just use your own website with your own opt-in form


Cons

  • You need to add the same inputs in the UpViral opt-in form as you have them inside your own opt-in form
  • You need to find the right spot in your homepage builder to drop the HTML code. On top of that, you need to put a second JavaScript code on your website
  • The HTML form "steals" the data from your opt-in form. Upon sign-up, lead data is sent to UpViral ONLY. This means, if you want to have it in your autoresponder or CRM as well, you need to connect them to UpViral in order to pass the lead data on to your autoresponder or CRM
  • If you want to use the power of the UpViral drag & drop editor, you can only use it for the share page in this case. The opt-in form has to be designed within your homepage builder or you code it yourself


What happens after the sign-up?

You can choose what happens after the lead has clicked on the submit button of your sign-up form. One option is that the participant gets redirected to the version of your share page, which is hosted by UpViral. As a second option, you can redirect the participant to a different website where you can add the share page as a Standard Embed to this website.


How to install the HTML form: