⚠️ Requires: – X-Cart 5.5.1 or later – Theme Tweaker add-on 5.5.1.13 or later |
Introduction
In our previous article, we showed you how to adjust colors of your store and choose a color palette that encourages customers to purchase your products. Now, let's take it a step further with fonts. We'll explore how typography influences brand perception and guide you through the process of adjusting fonts in X-Cart.
Before You Start
Why Fonts Matter?
Typography, just like color, plays a key role in how customers navigate your online store, make purchasing decisions and perceive your brand.
Site Navigation: Clear fonts make it easy for customers to read key information like product descriptions, prices, and action buttons. A clean, simple font helps customers to navigate your site quickly, especially on mobile devices.
Purchasing Decisions: Hard-to-read or inconsistent typography can drive customers away. Many unsafe websites often have mismatched or poorly chosen fonts, and people have subconsciously come to recognize this as a red flag.
Brand Perception: Fonts also set the tone for your store and signal what customers can expect. The right font speaks to your target audience and aligns with your pricing segment, acting as a gatekeeper to attract the right customers.
Let’s explore a few examples of how fonts can convey certain feel and perception:
Verdana
Great for large catalogs or mobile-first designs, this font is easy to read and perfect for off-road gear or heavy-duty parts stores. It conveys reliability and toughness.
Helvetica
This font adds a refined, professional touch to the website. Perfect for luxury or custom parts store. Very sleek and modern.
Arial
Easy to read and universally accessible, making it a solid choice for mainstream automotive parts or accessories. It gives off a straightforward feeling.
Open-Sans
Neutral and versatile, ideal for a clean, simple design. It’s a great choice if you're aiming for clarity and functionality.
As you can see, well-chosen typography can significantly influence the perception of your store and help communicate your brand’s personality.
Next, let’s overview how you can change the font of your X-Cart store.
Changing Your Store Font
To set a different font for your website:
In your X-Cart admin area, go to Design › Themes.
Click
Customize Storefront
to open the Storefront Builder.In the sidebar menu on the left, scroll down to Advanced Settings.
Enable Custom CSS toggle. Then click the pencil icon ✏️ next to it.
Click
Save changes
, if required.
On the next page, find the Font Family selector. You can select from five preset options:
Sans-Serif
Open Sans, Sans-Serif
Open Sans, Helvetica, Verdana, Sans-Serif
Helvetica, Arial, Sans-Serif
Monospace
Why Some Options Have Multiple Fonts?
Options 2–4 list multiple fonts in order of preference. If the first isn’t available on a customer’s device, the next is used automatically (e.g., Open Sans → Helvetica).
For the most consistent look across devices, we recommend Option 1 (Sans-Serif), which also serves as the default fallback for other options.
Live Preview
As you make changes, you'll see a live preview of how the font looks on your store. This allows you to adjust and refine your choices across different pages.
When you're done, click Save
in the top-right corner of the Storefront Builder page.
Can't find answers you're looking for?
Email us at support@x-cart.com. We will be happy to help!