How to create horizontal form in instapage

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!