Moast
Troubleshooting

Widget font doesn't match your store's font

Updated 4 days ago

If the text in your Moast widget shows in a different font than the rest of your store, your theme is most likely setting its font on each element instead of the whole site. Fix it with a small piece of custom CSS in your Shopify theme settings.

Why this happens

Moast widget text uses your store's theme font. Many themes don't set one font for the whole site. Instead, they set the font on each element, like each heading, with its own style. The Moast widget editor can't see those per-element styles, so your theme's font doesn't carry over to the widget.

Fix it with custom CSS in your theme settings

The fix goes in your Shopify theme settings, not in the Moast app. Because it lives in your theme, it works on every plan, including Free.

This snippet tells headings to use the font your theme set up for headings:

h1,h2,h3,h4,h5,h6 {
  font-family: var(--heading-font-family);
}

The variable name --heading-font-family came from one merchant's theme. Your theme may use a different name, so check which name your theme uses before you add this snippet.

  1. Open your Shopify admin and go to your theme settings.

  2. Find the custom CSS area for your theme.

  3. Paste in the CSS snippet above, using your theme's variable name.

  4. Save, then open your store and check that the widget headings now use your store's font.

If the widget editor preview shows the wrong font

The widget editor preview may not show your theme's font even when your live store will. If the preview shows a fallback font notice, the text will match your theme on the live store. Check your published store page to see the real font.

If paragraph text still doesn't match

Text set as a paragraph may not pick up the heading font from this CSS. If your widget text stays in the wrong font, try setting that text as a heading instead.

Contact support

If your widget font still doesn't match after trying these steps, contact our support team using the chat bubble in the bottom-right corner of the Moast dashboard.

Was this helpful?
Was this helpful?