Forms are a foundational element for lead generation landing pages. How you design your forms has a huge impact on your conversion rates and dictates the information that will come your way once a lead has converted. There are several more advanced uses of forms including pre-filling form fields, UTM tracking, and multi-step forms. In this article, i will show you how to create a horizontal form in instapage.
step 1: Take form
Open your instapage template editor and take form
go to add new > Form
step 2: Copy bellow script
<script type="text/javascript"> ijQuery( document ).ready(function(){ // will match 2nd! form field ijQuery( 'form.email-form .input-holder:eq(0)' ).css({ float: 'left', width: '47%' }); // will match 3rd! form field ijQuery( 'form.email-form .input-holder:eq(1)' ).css({ float: 'right', width: '47%' }); }); </script>
step 3: Past the script
to past the script go to settings > HTML/CSS
NOTE: when you past script you must select body location
step 4: Save
now save your landing page
NOTE: In the instapage template editor you can see vertical form but when you save the template then you can see horizontal form in Live Preview
step 5: testing
you can check the horizontal form in instapage : Live Preview
Thanks for checking out our tutorial, go ahead and share your experiences with the world using the comments below!