In this use case, we will take you through how you can collect your visitor’s information through a form on your website and then redirect them to a landing page that contains a Nexweave personalized video, just for them!
The applications of such a use case are versatile! Some examples could be:
A webinar/event registration form that redirects the sign-ups to a video confirmation page
A newsletter signup form that redirects to a personalized page
A payment/ invoice completion that redirects the user to a personalized confirmation
And many more!
In our demonstration, we have used an example of a platform registration/ account creation form. When the visitor completes their registration, they are redirected to a confirmation landing page containing a personalized video to greet and welcome them!
In preparation for this use case, we have created the following:
1. A sample account creation form using Elementor forms on Wordpress. This requests the visitors - first name, last name, email and company website
2. A registration confirmation landing page that contains an HTML content block, also on Wordpress.
Please note: Although we have used Wordpress and elementor in this example, the same method can be used for other landing page platforms as well. You can also learn how to embed Nexweave media in different landing page platforms here.
Let’s start by embedding the Nexweave video within your landing page
Embed Video in your landing page
1. Start by identifying the video template that you want to embed in your landing page. You can learn how to create or clone templates via the linked articles.
2. Then, navigate to the campaigns section and click on create a new campaign. You can learn about the various campaign types and how to run them in the linked article.
4. Next, from the dropdown, select the video template you have chosen to embed in your landing page. Please note, only the templates from within your My Template library appear here.
5. In addition to the video template, you also can select a personalized Image template, to set as the thumbnail for the video.
6. Once your media is selected, configure the URL of the landing page. Since the aim here is to embed the Nexweave video in your website/ landing page, select the option for a custom landing page.
7. In the corresponding input box, enter the URL of the landing page/webpage where you want to embed this video.
In our demonstration, we have copied the landing page URL for the created registration confirmation page and pasted it into the Nexweave campaign.
8. Click on Save and proceed to continue.
9. Next, set the activation method from the dropdown to the URL Override method. If you’re curious, you can learn more about the different campaign activation methods here.
10. The variables used in your Nexweave template along with their fallback or default values will appear below. You can adjust these fallback values and then click on Save.
11. Finally, click on Launch Campaign. Once you launch the campaign the Get Embed Code button gets enabled. Click on it.
12. In the embed code modal, set the switch for getting Embed code with integration variables to Off. A landing page embed code is generated.
13. To embed your video in your landing page, simply copy the generated video embed code and paste it into the HTML component within your landing page builder.
14. Here’s a preview of how the landing page in our demonstration looks:
As you can see, the landing page now shows a personalized image thumbnail and a personalized video. However, these still show the fallback or default values. This is because we haven't specified any values that the variables in these templates should take.
Next, take a look at how we can use the URL for this customized landing page to override the default variable values
Personalizing the landing page video
1. Note the URL of the landing page that contains the Nexweave video. In our example, this URL is :
https://demo.nexweave.com/registration-confirmation_1/
2. Append this URL and modify it with the following syntax:
landingpageURL?type=it&VAR_VARIABLE1=value1&VAR_VARIABLE2=value2
And so on... where VARIABLE1, VARIABLE2 etc are the variables used in your video template. And value1, value2 etc are the respective values you would like the variables to take
Please note, the prefix “&VAR_” before every variable is necessary to be able to override it.
3. In our demonstration, our chosen templates contain two variables - USERNAME and DOMAIN. So if we want them to take the value:
USERNAME: Shreya
DOMAIN: apple.com
Our modified URL becomes:
4. In the same way, you can modify your landing page URL to override the variable values of the embedded personalized template.
5. Here’s a preview of how the landing page looks with the modified URL:
The personalized landing page is now complete, lets take a look at how we can connect this personalized landing page to our website form
Linking the Landing Page to Your Website Form
1. Take a closer look at the website form.
In our example, under Form settings > form fields, a closer inspection of the first name field reveals an associated field ID or shortcode - [fieldID=”firstname”]
2. When a visitor fills up this form, the information entered in each field is stored in the corresponding field ID’s. Hence we can use these field ID’s to specify the values that the variables in our video landing page show.
3. The field ID’s from our form fields of interest are:
First Name : [fieldID=”firstname”]
Website: [fieldID=”website”]
4. So our URL can be further modified to:
http://3.138.125.71/registration-confirmation_1/?type=it&VAR_USERNAME=[fieldID=”firstname”]&VAR_DOMAIN=[fieldID=”website”]
Please note: The above modification now makes our personalized video landing page dynamic and dependent on the responses from our website form. As a new first name and website are entered, the landing page URL will dynamically adjust to the new values and the video will be personalized on the fly!
5. Let’s configure the button for the URL. To do this, in our example we clicked on Actions after submit. Please do the equivalent for the landing page builder you are using at your end
6. Next, ensure that the action of Redirect is selected. This ensures that a visitor is redirected when they click on the button.
In our wordpress builder, as we add Redirect as an action, its menu appears within the settings panel on the left. Here we entered our final modified URL (from step 4 above)
Our workflow or use case is complete! Let’s take a quick look at how this would appear for your audience from their perspective!
You can also have a look at our video detailing this use case:
For more use cases please have a look at our knowledge base and join our Facebook community to share some use case ideas and suggestions!