Typography

Change the fonts and styles for all typography on your site.

Overview

Having the right font on your site, in combination with a deliberate tone of voice provides added depth to your brand’s identity.

Your language and font choice helps build up an image in the customer’s mind of the way you operate as a business and go about fulfilling the needs of that customer.

A simple analogy is that your theme is your building’s architecture and your content (font, tone of voice etc.) is your choice of interior design.

In essence, your theme provides the sturdy framework and premium functionality and your site can then be dressed up even further, tailored perfectly to suit your niche market and target audience. We’ll show you how to make all adjustments to your font, in this guide.


How do I get started?

Firstly, head to:

  1. Admin
  2. Online Store > Themes
  3. Theme Settings
  4. Typography

Tip

For all fonts and styles, the best way to test these out is in the theme editor itself, allowing you to see changes live.


You will see you have the following options:

Headings

This is the text that appears at the top of most sections on your storefront.

You can choose from a selection of fonts, adjust the font size, letter spacing, heading case, style and style color. 


Body Text

This is the text that appears underneath your sections’ headings on your storefront.

Choose from a selection of fantastic fonts, by selecting “change”.
Adjust the size of this text to suit your needs:


Navigation

This is the text that appears in your site’s header, as part of your navigation menu.

Choose from a selection of fantastic fonts, by selecting “change”. Adjust the size of this text to suit your needs and choose whether you would like Normal Case, Lowercase or Uppercase to be used by selecting from the menu case dropdown:


Buttons

Decide how you would like your buttons, across your site, to appear.


Borders

Curved edges:

Rounded edges:

Square edges:

Case

Select from normal case, lowercase or uppercase.

Size

Drag the slider to choose a value between 10 and 21px:

Style

Select from bold, normal or italic font.


Product page titles

This refers to the product title itself on your product pages, as shown here:

Select size, via the slider and case via the dropdown.

Style:

Choose from light, normal or bold

Here's an example, cycling through all three options:


Logo text

Change the size of your logo text here:

Tip

Remember, you can also change the colors in the 'color' section of your ‘general settings’. See our guide here for more information:
docs.wetheme.com/flow/general-settings/colors


How do I use custom fonts on my site?

This can be done - here is a link which explains more:

help.shopify.com/themes/customization/fonts

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.