Create Multi Step Form Landing Page on Instapage

Instapage’s new slogan is “Landing pages are the future of online marketing” and indeed they are the future. The importance of landing pages cannot be overstated these days, especially from a digital marketing point of view.The idea behind Instapage’s conception is the generation of landing pages that may be able to record “leads” (entries) if you will, so they may later be used to market in the future.

These leads are usually an entrants basic information such as contact details, email IDs etc. The information collected by the landing pages are usually stored in a Microsoft Excel sheet repository that can be manipulated at any point in time.

Now that the basics are out of the way, let’s move forward with creating your first quiz or Multi Step Landing Page on Instapage. Creating a quiz may seem complex at first but it only involves two prominent features called Multi Step and Page Redirect.

Multi Step allows you to record multiple data entered into one entry. For example, a person filling in details of a form on a page will then proceed to fill out a bunch of answers on another. The idea of multi stepping is to allow different pages to record one user’s entry and his/her unique answers. So, a quiz page having 4 questions and 4 different pages to accommodate them, would require a multi-step so as to record all data entered under a single entry.

Page redirect on the other hand is fairly simple in that in directs you from one page to the next. Using this effectively along with the Multi step process and you’ll be building complex competition pages in no time.

So let’s begin with creating your first quiz/contest page. We start by creating a basic landing page from a selection of templates that Instapage provides you with. After picking out the template you desire, you can move forward with designing its layout and overall look to suit your needs and what you aim for the first page to acquire. For this article, let’s use an example of a base landing page created specifically for this purpose.

quiz 1

As you can see, the base page created contains the basic information one would seek gain out of a generic landing page, let alone a quiz page. This is where the tricky part comes to play. Once we’ve finished creating the parameters necessary, move the cursor over the button for the form and hit edit. You will be greeted by a drop down showing you a bunch of options that looks something like this.

multi step 1

Move the cursor over to Multi Step. This will allow data to be tracked over multiple pages under a single entry. Once you hit the Multi Step option, you will be greeted with a pop-up.

multi step integration

You will be greeted with something that looks like this. All you have to do is name the current form and as a part of a Multi-Step flow.

multi step 2

Let’s go ahead and name this “Step 1” as the first step in a quiz competition under the flow of “quiz_demo1”. Keep these things in mind as they will play a role later. Once you’ve entered the necessary details, hit save and the pop-up will close. Once this is done, let’s move ahead and publish the page.

Once you hit the publish button, you will once again be greeted with another pop-up asking you how you’d wish to publish the page.

Publish page

Since, this is only a test, let’s go ahead and publish it through Instapage.

save page

You will be asked to enter a custom URL for this, so let’s go ahead and use “testquiz-step1”. Once again, remember this as it will come in handy for later as we progress.

testquiz

Upon hitting publish, you’ve pretty much created your first step in landing pages and you will be taken back to your Instapage’s home page. Now we could move forward and create a new landing page altogether but to make this process quicker, let’s go ahead and duplicate this page. Duplicating, will copy the page along with its physical properties meaning that it will also have the Multi Step flow integrated as before. This way, you wouldn’t have to worry about implementing the same process on an individual page while also maintaining consistency in terms of overall looks.

Duplicate 1

Once duplicated, select the copy of the test quiz and proceed to change the layout anyway you please. As an example, let’s use a simple change in the existing design. The next page will bear the first question which upon answering, will move over to the next.

question 1

Let’s assume that you’re already aware of how to create a form on Instapage. The following question contains a simple drop down box that allows the contestant to select the right answer pertaining to the question. Similar to the last page, move your cursor over the submit button and click edit. You will once again be greeted with a drop down menu with the options. Keep in mind that if you’ve duplicated the page, it will already bear the same properties of the last. One pat that will need changing is the form name from the Multi-Step feature.

step 2 multi

All you need to do is change the form name and keep it as a part of the same Multi-Step flow. This will allow Instapage to differentiate the two different forms but relate them as part of the same record.Once saved, hit publish and similarly to the first page, proceed to publish through instapage. Be sure to name this page differently so that you don’t get confused.

page 2

Now head back to the first page you created and move your cursor over the submit button. Hit it and select edit. This time when the drop down appears, move over to the redirect option and select it. Another pop-up will appear prompting you to select which page you’d like this button to redirect you to.

redirect

Move the cursor over the drop down option so as to choose a destination you’d like the page to redirect you to. You could even choose to have a message be delivered to the user upon clicking the submit button but we’ll leave that.

redirect2

In this case, you’d have to select for it to redirect you to another landing page on Instapage since these are only test pages and not registered by any domain. Therefore, you can choose the landing page that you’ve created. In this case, it will be the copy of the test quiz to be redirected to. Once you’re done selecting the page, move over to the publish button.

Congratulations! You have successfully created a Multi-Step and a Redirect for your competition page. Both pages will record information for you as a single entry per user. You could implement this similar process for consecutive landing pages if you wish for your competition to be longer.

If you wish to test this out, head over to the preview button net to the publish button while in edit mode. Be sure to name your pages accordingly so as to not get confused when linking them together. It may seem complex on your first go, but will come across simpler as you keep working with it.

Earlier we saw a growth hack marketing strategy by Instapage targeting Unbounce as a keyword in their SEM campaigns.