This guide provides the step-by-step process of integrating your UpViral HTML form with a WordPress site.
Important:
We strongly advise using the HTML Form Code when using a free WordPress subscription as the Standard, Pop-up, Universal Capture code, and Pop-Over widget codes may only function properly on WordPress accounts under paid subscription plans.
What to Prepare on UpViral:
First, make sure that your campaign is completed and ready to be installed. Check out How to create a campaign? for a step-by-step process on how to create and launch an UpViral campaign that's ready for installation.
What to Prepare on WordPress:
- Opt-in Page on WordPress
- Share/Thank You Page on WordPress (if you'll be using a separate page)
Learn how to create your pages on WordPress by following this link.
In summary, to create a page, on the left-hand sidebar of WordPress, hover on the Pages option and click Add New:
If you want to use a separate Share/Thank You page, you need to create two pages and then you may name them accordingly.
Installation:
STEP 1:
On the Publish & Embed page, click on the “+ Embed Campaign” button:
STEP 2:
Select "Use opt-in form of my website" then enter your website URL.
STEP 3:
On the Opt-in widget settings, choose HTML Form to embed your campaign to your own website using your existing lead form. At the left side of the screen are set of codes the codes that you need to copy and paste into your opt-in page.
If you are not familiar with how to add codes to your webpage, you may need to seek assistance from your web host or a web developer.
STEP 4:
In the Share widget settings, you have two options. You can choose to display the share widget on the same page as your opt-in widget or redirect it to another page using a third-party tool.
If you choose to redirect the share widget to another page, you will need to enter the page URL where you want it to appear after the user has signed up. You will also be able to preview your Share widget as shown below:
STEP 5:
The Installation page will show you the codes that you need to copy and paste into your share page. If you are not familiar with how to add codes to your webpage, you may need to seek assistance from your web host or a web developer.
STEP 6:
Back to your Pages tab on WordPress, open your WordPress page editor by clicking on the three-dotted button beside the page and "Edit"
STEP 7:
This will open up the page editor where you can click on the + button on the top-left side of the page and search for "HTML"
STEP 8:
Drag the Custom HTML box onto your page. Then, paste the first and second UpViral HTML codes on the HTML box. (If you have a separate share page, paste the third code on the share page's editor instead).
STEP 9:
Click Update once done.
STEP 10:
Back at UpViral, click the "Test Embedding" button on Opt-in form settings (step 2) and installation (step 5) to review and check if the Widget has been successfully embedded or not.
If the code detection test failed, try to remove and re-install the code to your pages.When the test is successful, click the "Save" button at the bottom right side of the page.
Additionally, configure the destination of your referral traffic by specifying the URL where you want to redirect the referral links of your participants. This will determine where your participants' referral links will be redirected to when clicked.
STEP 11:
Test your campaign by accessing your own website then register for your campaign. If your name and email address is added to your campaign's lead page, you have successfully integrated your Upviral campaign into your own website.
How to get your support tickets resolved faster
Statistics have shown us that the more you tell us when you report an issue, the faster we solve that ticket. So...
1 - If you have screengrabs, please include them. A picture is worth a thousand words.
2 - If you have recorded a video showing the issue you're having, please include that as well. A video is worth a million words.
We recommend a free service called Loom for creating these videos. (this is a link to https://www.useloom.com/)
3 - To speed up ticket resolution, follow these useful tips How to Write the Perfect Support Ticket (That Gets Results Fast)