[Support request] Site title font is not working on mobile

[BeeLady11]

Hi
I’ve added the ‘Arima Madurai’ Google font to this site (as it wasn’t on your top 200 list):

https://akpwebservices.co.uk/

It seems to work fine just about anywhere, apart from the site title on mobile (site title on other platforms seems ok)
Relevant bits in child theme’s style.css:

@import url(‘https://fonts.googleapis.com/css?family=Arima+Madurai:400,500,700’);

.main-title {
text-align: center;
font-size: 4em;
font-family: ‘Arima Madurai’, cursive;
margin-top: 30px;
}

h1, h2, h3, h4, h5, h6 {
font-family: ‘Arima Madurai’, cursive;
color: #7A027C;
}
.main-navigation .main-nav ul a {
font-family: ‘Arima Madurai’, cursive;}

– any tips on how to get the font rendering correctly on mobile would be appreciated!

Thanks
🙂

[Leo]

Hi there,

Can you try using this method to add the font?
https://docs.generatepress.com/article/customizing-the-google-font-list/#adding-your-google-font-to-the-list

Then you can use the typography add-on in the customizer options instead of CSS.

Let me know if this helps 🙂

[BeeLady11]

That did it!
Many thanks, Leo

A 🙂

[Leo]

No problem 🙂

[Author]

Posts