enqueue Google-fonts link in function.php

Door johannes davidian op 28-11-2016 11:57

1.949 views

hallo,

ik heb in mij function.php bestand deze code ingevoerd :


function auto_repair_scripts() {
      //add Google fonts Merriweather 
wp_enqueue_style( 'auto-repair-google-fonts, 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' );

maar ik krijg foutmelding.
normaal gesproken de link is :<link href="https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i" rel="stylesheet">

ik kan deze link in header.php toevoegen maar ik wil het enqueue in function.php en het moet kunnen.

een deel van mij function.php code is:


function auto_repair_stylesheets() {
    wp_register_style( 'style.css',  get_template_directory_uri() . '/style.css', array(), null, 'all' );
    wp_register_style( 'app.css',  get_template_directory_uri() . '/app.css', array(), null, 'all' );
    wp_enqueue_style( 'style.css' );
    wp_enqueue_style( 'app.css' );
  
}
add_action( 'wp_enqueue_scripts', 'auto_repair_stylesheets' );

/**
 * Enqueue scripts and styles.
 */
function auto_repair_scripts() {
      //add Google fonts Merriweather 
wp_enqueue_style( 'auto-repair-google-fonts, 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' ); 
	wp_enqueue_script( 'auto-repair-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

	wp_enqueue_script( 'auto-repair-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

hoe ik kan deze probleem oplossen?

dank u wel
Johannes

Ariën

28-11-2016 12:06

Gokje: Zet eens een ' na auto-repair-google-fonts.

johannes davidian

28-11-2016 12:18

dank U wel,
ik heb het deze code (auto-repair-google-fonts) in de voorbeeld boven function.php:


wp_enqueue_style( 'auto-repair-google-fonts, 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' );

het helpt niet auto_repair-google-fonts of auto-repair-google-fonts
johannes

Ariën

28-11-2016 12:20

Wat gebeurt er dan precies? Je hebt het over een error. Maar welke dan precies?

- SanThe -

28-11-2016 12:26

Johannes davidian op 28/11/2016 12:18:55

ik heb het deze code (auto-repair-google-fonts) in de voorbeeld boven function.php:
wp_enqueue_style( 'auto-repair-google-fonts, 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' ); 

En daar mist nog steeds de enkele quote.


wp_enqueue_style( 'auto-repair-google-fonts', 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' );

johannes davidian

28-11-2016 12:27

ik krijg deze melding:

parse error: syntax error, unexpected 'https' (T_STRING) in /mnt/web010/b0/48/56990848/htdocs/WordPress_SecureMode_01/wp-content/themes/auto-repair/functions.php on line 130

en de code in lijn 130 is :


wp_enqueue_style( 'auto_repair-google-fonts, 'http://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' );

johannes

- SanThe -

28-11-2016 12:30

Missing quote dus.
Zie boven.

johannes davidian

28-11-2016 13:27

Dank U wel ,
U heb gelijk.

maar na invoeren deze font family style (Merriweather) in CSS als volgende:



html {
	font-family:'Merriweather', serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}


body,
button,
input,
select,
textarea {
	color: #404040;
	font-family: 'Merriweather', serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.5;
}

Het letters style veranderd niet naar Merriweather style.

Mij function.php code is nu als volgende:



/**
 * Register style sheet.
 */
function auto_repair_stylesheets() {
    wp_register_style( 'style.css',  get_template_directory_uri() . '/style.css', array(), null, 'all' );
    wp_register_style( 'app.css',  get_template_directory_uri() . '/app.css', array(), null, 'all' );
    wp_enqueue_style( 'style.css' );
    wp_enqueue_style( 'app.css' );
   
}
add_action( 'wp_enqueue_scripts', 'auto_repair_stylesheets' );

/**
 * Enqueue scripts and styles.
 */
function auto_repair_scripts() {
      //add Google fonts Merriweather 
 
wp_enqueue_style( 'auto-repair-google-fonts', 'https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i' );
	wp_enqueue_script( 'auto-repair-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

	wp_enqueue_script( 'auto_repair-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
		wp_enqueue_script( 'comment-reply' );
	}
}
add_action( 'wp_enqueue_scripts', 'auto_repair_scripts' );

ik heb voor zekerheid de brouwser data gewist maar toch het probleem blijft hetzelfde de letters veranderd niet naar Merriweather!

wat kan het probleem zijn nu . is het probleem ligt in function.php code of ergens anders?

johannes

Ozzie PHP

28-11-2016 13:33

Zet helemaal bovenin je css bestand eens het volgende:


@import url("https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i");

johannes davidian

30-11-2016 11:32

Dank U wel iedereen,
ik was ziek 2 dagen daarom ik heb geen reactie gegeven.
het fout was in underscores-thema zelf ,soms doet deze Wordpress thema rare dingen,mischien wordpress zelf doet soms rare dingen.

ik heb nieuwe thema geinstalleerd en de Google-fonts link ingevoerd in header.php :


<?php
/**
 * The header for our theme.
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package Garage
 */

?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link href="https://fonts.googleapis.com/css?family=Merriweather" rel="stylesheet">
<!-- Compressed CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/foundation/6.2.4/foundation.min.css">
<?php wp_head(); ?>
</head>

het kan ook via importen in css bestand :


@import url("https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i");

en derde manier is enqueue de Google-fonts in functions.php als volgende:


 function load_fonts() {
            wp_register_style('googleFonts', 'http://fonts.googleapis.com/css?family=Rock+Salt|Neucha');
            wp_enqueue_style( 'googleFonts');
        }
    
    add_action('wp_print_styles', 'load_fonts');

de url voor hoe U kunt Google-fonts invoeren in Wordpress thema is :https://webdesignfromscratch.com/wordpress/using-google-web-fonts-with-wordpress-the-right-way/

dank u wel iedereen
Johannes

Reageren

Inloggen om te reageren