Google Font not displaying

Support
#1

Hi,

I have a class ‘script’ setup in my CSS using the Google Font ‘Great Vibes’ as follows, which works fine for me but only because I have that font loaded on my laptop.

If I go to another computer else it only displays the default cursive font since that computer doesn’t have Great Vibes installed locally.

CSS…

@import url(‘https://fonts.googleapis.com/css?family=Great+Vibes’);
.script {
font-weight: 400 !important;
font-family: ‘Great Vibes’, cursive !important;
text-transform: none;
}

Page I’m using that on is http://thesoundtemple.com.au/women-at-the-well/

many thanks

#2

Hey @jennaluck,

Your import line does not have a semicolon at the end so it does not actually work.

Try adding a semicolon.

Thanks.

#3

Thanks have now done that but still not displaying the correct font. Weirdly it works fine on my phone.

#4

Hi There,

I couldn’t find the vibes CSS class on that page.

Could you please add that class to your texts again?

Thanks.

#5

I have used the script class on that page.

@import url(‘https://fonts.googleapis.com/css?family=Great+Vibes’);
.script {
font-weight: 400 !important;
font-family: ‘Great Vibes’, cursive !important;
text-transform: none;
}

#6

Hi there,

I have just checked your site and it seems to be displaying fine the Great Vibe fonts for the text where you assigned it to.

Please try to clear your browser cache or load your site in incognito mode and see it it fixes the issue.

Hope this helps.

#7

Unfortunately that didnt make a difference. I believe it displays correctly if the font is installed on the device you are viewing it. Problem exists where that font is not installed - which would be the most common scenario for most viewers.

#8

Hi there,

Please remove this code in the custom CSS panel:

@import url('https://fonts.googleapis.com/css?family=Great+Vibes');

Then add this code in the child theme’s style.css:

/**
 * Enqueue scripts and styles.
 */

add_action( 'wp_enqueue_scripts', 'load_script' ); 
 
function load_script() {	
	wp_enqueue_style( 'google-font', 'https://fonts.googleapis.com/css?family=Great+Vibes');
}

This should load the font on your site.

Hope this helps.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.