Sites

Customizing Order Form for Enhanced User Experience and Efficiency

Customizing Order Form for Enhanced User Experience and Efficiency Customizing Order Form for Enhanced User Experience and Efficiency Summary: How to Customize Your Order Form for Enhanced User Experience Adding and Cust

2 min read· 342 words· 10 images

Customizing Order Form for Enhanced User Experience and Efficiency

Summary:

How to Customize Your Order Form for Enhanced User Experience

Adding and Customizing a Section

  1. Navigate to the Funnels Tab: Open the Sites tab on the left side bar. The funnels tab will automatically be opened.  
  2. Open the Funnel Editor: Start by selecting a funnel, then "Edit Page" to access the funnel editor.

Customizing Order Form for Enhanced User Experience and Efficiency – figure 1

3. Add a New Section: To add a new section, choose "Medium" and then select "Row". Opt for a single column layout.

Customizing Order Form for Enhanced User Experience and Efficiency – figure 2Customizing Order Form for Enhanced User Experience and Efficiency – figure 3

4. Insert an Order Form Element: Scroll through the available elements and drag the "Order Form" element into your column.

Customizing Order Form for Enhanced User Experience and Efficiency – figure 4

Configuring the Order Form

  1. Access Advanced Settings: Click on the "Order Form" element, then select "Advanced Settings" from the menu.
  2. Customize Field Visibility:To hide the company name, click on "Toggle Company Name" field.
  3. To hide the company name, click on "Toggle Company Name" field.

Customizing Order Form for Enhanced User Experience and Efficiency – figure 5

  • For removing the phone number field, select "Toggle Phone".

Customizing Order Form for Enhanced User Experience and Efficiency – figure 6

  • To hide shipping details, choose "Toggle Shipping".

Customizing Order Form for Enhanced User Experience and Efficiency – figure 7

Personalizing Form Steps

  1. Modify Step Headings: Click on the headline of step one and change it to "Personal Details".

Customizing Order Form for Enhanced User Experience and Efficiency – figure 8

2. Adjust Sub-headlines: Below the headline, click on the sub-headline and update it to "Enter Your Name and Email".

Customizing Order Form for Enhanced User Experience and Efficiency – figure 9

Saving and Previewing Your Work

  1. Save Your Changes: After making the necessary adjustments, save your page.
  2. Preview the Order Form: Navigate to the "Overview" tab and select "Preview Page" to view the two-step order form live.

Customizing Order Form for Enhanced User Experience and Efficiency – figure 10

Filling Out the Form

  1. Enter Test Information: On the first step of the form, enter a test name and email, then select "Go to Step 2".
  2. Review the Product Availability: The second step will display the product or service available for purchase.

Troubleshooting and FAQs

  • What if I can't find the Order Form element? Ensure you're in the correct section of the funnel editor and have selected the option to add an element.
  • How do I revert changes? Use the undo feature within the editor or manually adjust settings back to their original state.


Tagsformordernameselectelementclickstepsectiontabfunnel