How to Add Custom Fields to an Infusionsoft Order Form

TUTORIAL VIDEO

How to Add a Custom Field
to Your Infusionsoft Order Form

 

How to Add a Custom Field to Your Infusionsoft Order Form

Watch the tutorial video above to learn how to add a custom field, drop down menu, and radio button to your Infusionsoft order form. These customizations to your Infusionsoft order form are a bit more technical, but we’ll make it as easy as possible for you to follow along. If you’re working with a developer, send them a link to this page and they’ll be able to fix you up in no time!

Use one or all of the snippets below to add a custom text field, a custom text area, a custom drop down list, or a custom radio button selection to your Infusionsoft order form. Remember you are going to have to edit the code in order for the custom fields to work correctly so be sure to carefully follow the instructions in the video.

Here we go…

Quick Overview

There are two parts to this code, the Initiation Code, and the Custom Field Type code.
Be sure to use both parts of the code below.

Custom Field Initiation Code

Copy and paste the code below into the Custom HTML Footer section of your Infusionsoft order form. Then, decide what kind of custom field you want on your order form and find the code below for that custom field type. Options: Text Field, Text Area, Drop Down List, or Radio Buttons. You will also copy/paste that code into your Infusionsoft order form as well.

<script>
jQuery(document).ready(function($){$('<div class="sp-custom-fields" />').prependTo('.col1');
$('.sp-custom').each(function(e){
$(this).appendTo('.sp-custom-fields');
});$('<div class="heading">ENTER YOUR HEADING HERE</div>').prependTo('.sp-custom-fields');});</script><style>
.sp-custom-fields{padding-bottom:15px; padding-top:20px;}
.sp-custom-fields .heading{text-transform: uppercase;
font-weight: 600;
letter-spacing: 1px;
font-size: 20px;
font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif !important;
padding-left: 0 !important;
padding-bottom:10px;
margin-top:-8px;
}</style>

How to Add a Custom Text Field to your Infusionsoft Order Form

Please watch the video to know how to use this code:

<!-- Text Custom Field -->
<fieldset class="sp-custom">
<input name="Contact0_YourFieldName" placeholder="Your Custom Field" type="text" style="width: 100%; margin-bottom: -1px;"/>
</fieldset>

How to Add a Custom Text Area to your Infusionsoft Order Form

Please watch the video to know how to use this code:

<!-- Text Area Custom Field -->
<fieldset class="sp-custom">
<textarea name="Contact0_YourFieldName" placeholder="Your Custom Text Area" style="width: 100%; margin-bottom: -1px;"></textarea>
</fieldset>  

How to Add a Custom Drop Down Menu to your Infusionsoft Order Form

Please watch the video to know how to use this code:

<!-- Dropdown Menu Custom Field -->
<fieldset class="sp-custom" style="width: 100%; margin-bottom: -1px;">
<select name="Contact0_YourFieldName">
<option disabled="disabled" selected>Select car type</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
</fieldset> 

How to Add a Custom Radio Buttons to your Infusionsoft Order Form

Please watch the video to know how to use this code:

<!-- Radio Button Custom Field -->
<fieldset class="sp-custom">
Choose one:<br>
<input type="radio" name="Contact0_YourFieldName" value="male"> Male<br>
<input type="radio" name="Contact0_YourFieldName" value="female"> Female<br>
<input type="radio" name="Contact0_YourFieldName" value="other"> Other
</fieldset>

This page may be a bit overwhelming but it’s a lot easier than it looks! Watch the video above for step-by-step instructions!

We do also offer custom development and order form creation services as well, so we can assist you with your custom coding or order form build out needs if this is more technical than you wish to spend your time figuring out. If you’d like further support, send us an email at support@gospiffy.com.

I hope this information has helped you, if you’d like to experience how Spiffy can help increase your revenue from sales you’re currently missing, sign up for an account today. Try it out risk-free for 30 days with our 100% money-back guarantee. Get started today!

Are you an Infusionsoft Partner? Want to earn referral commissions for talking about Spiffy? Apply to be an affiliate today!.