Shipping bar flashes wrong font before displaying correctly

Some shops may notice a small delay between the shipping bar loading and the chosen font displaying as expected. This is a result of the web font taking a bit longer to load than the shipping bar itself. A workaround here is to load the selected font directly in your theme.

Step 1: Find your font

  • Visit Google Fonts and use the search bar to find your chosen font. 
  • From the font page, click Select this Font.
  • In the popup that appears, copy the Standard link tag to your clipboard.

Step 2: Add the link tag to your theme

  • From your Shopify Admin, visit Online Store > Themes
  • Click the "..." button next to your theme and select Edit HTML/CSS
  • In the Layouts folder, find and open your theme.liquid file. 
  • Paste the <link> tag from your clipboard directly above the </head> tag. 
  • Save your changes.

You should be all set!

Please note, if you change your Shipping Bar font or publish a new theme in the future, you will need to revisit these instructions.

Still need help? Contact Us Contact Us