Configuring Your Settings
Smart Phone Field has a small, focused settings page. There are no complicated options — just two settings that let you tailor the phone field to your store and brand.
To access settings go to WooCommerce > Smart Phone Field > Settings in your WordPress admin dashboard.
Preferred Countries#
Preferred countries appear pinned to the top of the country dropdown, above all other countries, whenever a customer opens the field. This makes it faster for your most common customers to select their country without scrolling.
You can set up to 4 preferred countries.
How to set preferred countries
- Click inside the Preferred Countries field
- Start typing a country name
- Select it from the suggestions that appear
- Repeat for up to 3 more countries
- Click Save Settings
Tips for choosing preferred countries
Set the countries where the majority of your customers are based. If you sell primarily in the United States and Canada, pin those two. If you run a regional store, pin the countries in your region.
If you leave this field empty, the dropdown will open with all countries in alphabetical order with no countries pinned.
Changing the order
Preferred countries appear in the order you add them. The first country you add appears at the top of the list. To change the order, remove your selections and re-add them in the order you want.
Accent Color#
The accent color is applied to interactive states across the phone field so the field feels consistent with your theme and brand.
The color is used on:
- The background of the selected country row in the dropdown
- The focus border when a customer clicks into the field
- The dropdown scrollbar
How to set the accent color
- Click the color swatch next to the Accent Color field
- Use the color picker to choose your color, or type a hex code directly into the field
- Click Save Settings
- Visit your checkout page to preview the result
Tips for choosing an accent color
Use your primary brand color or the color you use for interactive elements like buttons and links on your store. Avoid very light colors as they may not provide enough contrast in the selected country row.
Saving Your Settings#
Click the Save Settings button at the bottom of the page after making any changes. Settings do not save automatically.
After saving, clear your browser cache and reload your checkout page to see the changes applied.
Resetting to Defaults#
If you want to start fresh, clear the Preferred Countries field and reset the Accent Color to your preferred default, then click Save Settings. The plugin has no one-click reset option — changes are applied as you make them.