Skip to content
Fluid Checkout
  • Demo
  • Features
  • Add-ons
    • Complete Bundle Save 42%
    • Fluid Checkout PRO
    • Google Address Autocomplete
    • Address Book
    • EU-VAT Assistant
  • Pricing PRO
  • Docs
  • Support
  • My account
0,00 € 0 items
Home / Docs / Move the “Phone” field to the contact step

How can we help?

Getting started

  • Do I need to uninstall the free version when upgrading to PRO, or is Fluid Checkout Lite required?
  • Getting Started with Fluid Checkout
  • Translate Fluid Checkout plugins into your language

Features

  • WooCommerce edit cart on checkout — change quantity or remove items from the cart directly at the checkout page
  • Trust symbols — add security badges, trust seals and other trust symbols to strategic places on the checkout, cart and order received pages
  • Order pay – optimized and intuitive design for your WooCommerce Order Pay page
  • Local Pickup — WooCommerce Local Pickup hide shipping address when local pickup is selected
  • International phone numbers — WooCommerce checkout phone number validation and formatting based on country rules
  • Express checkout — quick payment buttons for Google Pay, Apple Pay and other payment methods
  • Design templates — match your brand styles on the WooCommerce Checkout template
  • Billing address positions — choose to display billing address before shipping, inside the shipping step or force shipping and billing address to a single section
  • Account matching / user matching — associate purchases with and existing customer account without logging in

Customizations

  • Change the icon or icon color for the cart button on mobile
  • Move the “Phone” field to the contact step
  • Configure cart quantity fields for decimal quantities
  • Change fields copied from shipping address to billing address
  • Move first and last name fields to the contact step
  • Customize Local Pickup location address and use multiple pickup locations
  • Customize button colors and other button styles
  • Customize colors of elements on Fluid Checkout
  • Customize template files for WooCommerce and Fluid Checkout
  • Customize checkout steps
  • Add custom house number field and make it required
  • Customize checkout fields and adding custom checkout fields
  • Safely add code snippets to your WooCommerce website

Compatibility

  • Compatibility with plugin YITH WooCommerce Cart Messages Premium
  • Compatibility with plugin WooCommerce Delivery Slots by Iconic
  • Compatibility with plugin Mailchimp for WooCommerce
  • Compatibility with plugin WooCommerce Checkout Manager By QuadLayers
  • Compatibility with plugin Breakdance
  • Compatibility with theme Pressmart
  • Compatibility with theme Divi and the Divi Builder
  • Compatibility with WooCommerce Block-based checkout and cart forms
  • Compatibility with theme Botiga
  • Compatibility with theme Atomion
  • Compatibility with theme OceanWP
  • Compatibility with plugin Digits
  • Compatibility with plugin Storefront Powerpack
  • Troubleshooting – jQuery events or vanilla JavaScript events not working
  • Compatibility with theme ZK Nito
  • Compatibility with theme Woodmart
  • Compatibility with plugin “Plugin Organizer”

Troubleshooting

  • Troubleshooting – jQuery events or vanilla JavaScript events not working
  • Troubleshooting – Local pickup prevents customer from proving a shipping address, blocking other shipping methods
  • Troubleshooting – Trust symbols widgets randomly moving to other areas when switching themes

Account & Purchases

  • Can I get a refund for my purchase?
  • Finding my invoice, adding billing details and VAT number
  • New versions updates are not appearing on my website

Development

  • Troubleshooting – jQuery events or vanilla JavaScript events not working
  • Changelog format and semantic version numbers
  • Changelog – Fluid Checkout PRO & Lite
View Categories

Move the “Phone” field to the contact step

In this article, you are going to learn how to move the “Phone” field to the first step of the checkout process, the “Contact” step.

When moving those phone fields to the contact step, they will appear right after the email field and it can be set as optional or required. You can move the “Shipping phone” field, “Billing phone” field, or both.

Enable phone fields and move them to the “contact” step #

  1. Go to the plugin settings at WP Admin > WooCommerce > Settings > Fluid Checkout.
  2. Locate the settings for “Billing phone” and “Shipping phone”.
  3. Set the desired phone field (billing or shipping) to be added to the checkout as either “Optional” or “Required”. You can also choose to remove the field by setting it as “Hidden”.
  4. Set the position of the desired phone field (billing or shipping) to “Contact step”.
  5. Click on “Save changes” at the bottom of the page.

Still stuck? How can we help?

How can we help?

Updated on August 8, 2023
Change the icon or icon color for the cart button on mobile
Table of Contents
  • Enable phone fields and move them to the "contact" step
Fluid Checkout

Frictionless Multi-step Checkout for WooCommerce

© 2021-2025 Fluid Checkout OÜ

Terms | Refunds | Privacy Policy | Cookies

Products
  • All products
  • Fluid Checkout PRO
  • Fluid Checkout Lite
  • Google Address Autocomplete add-on
  • Address Book add-on
  • EU-VAT Assistant add-on
Company
  • Support
  • My account
  • Careers Hiring
  • About
  • Affiliates program
  • Homepage
  • Homepage
  • Features
  • Pricing PRO
  • Demo
  • Docs
  • Support
  • My account