Load local fonts

  • Hi, due to the European GDPR Regulation I need to stop my theme loading fonts from Google and instead load them locally. I’ve downloaded all Fonts and placed the files in a fonts Directory. I added a @fontface rule in my CSS. (Please take a look below):

    @font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100;
	font-display: swap;
	src: url('../fonts/roboto-v30-latin-100.eot');
	/* IE9 Compat Modes */
	src: local('Roboto'),
		url('../fonts/roboto-v30-latin-100.eot?#iefix') format('embedded-opentype'),
		/* IE6-IE8 */
		url('../fonts/roboto-v30-latin-100.woff2') format('woff2'),
		/* Super Modern Browsers */
		url('../fonts/roboto-v30-latin-100.woff') format('woff'),
		/* Modern Browsers */
		url('../fonts/roboto-v30-latin-100.ttf') format('truetype'),
		/* Safari, Android, iOS */
		url('../fonts/roboto-v30-latin-100.svg#Roboto') format('svg');
	/* Legacy iOS */
}

    (I repeated this with all font-sizes)

    Problem: The local fonts are not loaded. Is it because messed sth. up in the functions.php? I commented out certain parts in the functino.php. Please see below. Do I have to modify this in a certain way?

    // 25.10.22
		
		// if(!isset($site_font['url'])){
		// 	wp_enqueue_style("sth_GoogleFont","https://fonts.googleapis.com/css?family=Roboto+Condensed:400,100,200,300,500,600,700,800,900" , false, "1.0");		
		// }
		// else{
		// 	$site_font_url = preg_replace("/^http:/i", "https:",$site_font['url']);
		// 	wp_enqueue_style("sth_GoogleFont",$site_font_url , false, "1.0");
		// }

    Thank you very much,

    • This topic was modified 2 years, 4 months ago by Jan Dembowski.
Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi @presse2009

    Sorry to hear about the trouble. Could you share the site/page URL where you are trying to load the fonts?

    Hi there,

    The easiest way would be to remove the comments from your functions.php file for the conditionals you have and then refresh your site on the browser. The browser console should give you further hints on what is not loaded when attempting to find this style file from the specified location, URL or even relative path.

    As for the URL you’re using, there are core functions available to help you set the correct src for this style file like:
    – get_template_directory_uri()
    – get_stylesheet_directory()
    – get_theme_file_uri()
    so that you can skip checking the protocol and avoid the preg_replace().
    Last but not least, the third parameter can be even an empty array().

    Kind regards,
    George

    Thread Starter presse2009

    (@presse2009)

    @fozlarabbi and @gtsiokos Thanks for your time.

    I added this in my functions.php –?and if I am not tricked by some caching magic, it should work:

    ` function load_local_fonts() {
    wp_enqueue_style( ‘local-fonts’, get_stylesheet_directory_uri() . ‘./css/style.css’, array(), filemtime( dirname( FILE ) . ‘./css/style.css’ ) );
    }
    add_action( ‘wp_print_styles’, ‘load_local_fonts’ );`

    I think this is the solution @gtsiokos suggested. ( get_stylesheet_directory_uri())

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Load local fonts’ is closed to new replies.