webentwicklung-frage-antwort-db.com.de

Google Web-Schriften in die Warteschlange stellen, ohne die Symbole in der URL zu verwechseln

Einreihen in Google Web Fonts wie gewohnt, d. H. Verwenden der Funktion wp_enqueue_style wie folgt ...

function wpse_google_webfonts() {
    wp_enqueue_style( 'google-webfonts', 'http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700' );
}
add_action( 'wp_enqueue_scripts', 'wpse_google_webfonts' );

... führt zu einem link-Tag, das wie folgt in der Kopfzeile platziert wird:

<link rel='stylesheet' id='google-webfonts-css'  href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed%7COpen+Sans%3A400italic%2C700italic%2C400%2C700&#038;ver=3.5' type='text/css' media='all' />

Wie Sie sehen können, ist die resultierende URL codiert .

Ich bin mir ziemlich sicher, dass es keine Probleme aufwirft, aber um die Dinge sauber und klar zu halten, möchte ich fragen: Gibt es eine Möglichkeit, Google Web Fonts (über functions.php und nicht über ein Plug-in) so in die Warteschlange zu stellen, dass die URL Ausgabe ist nicht verschlüsselt?

Das ist so:

<link rel='stylesheet' id='google-webfonts-css'  href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700?ver=3.5' type='text/css' media='all' />

Grund für die Bounty

Die Antwort von @ webaware ist nahezu perfekt, insbesondere weil sie der Methode ähnelt, die beim Einreihen von 'Open Sans' in Google Web Font im Twenty Twelve - Thema verwendet wird.

Das einzige Problem bei der Ausgabe ist, dass es so aussieht:

<link rel='stylesheet' id='twentytwelve-fonts-css'  href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700&#038;subset=latin,latin-ext' type='text/css' media='all' />

Beachten Sie den &#038;? Es sollte & sein, andernfalls enthalten die bereitgestellten Schriftdateien nur die Glyphen latin (d. H. Der Parameter subset in der URL wird vernachlässigt, es sei denn, Sie verwenden & und NICHT dessen HTML-Entität).

Jeder, der mithelfen kann, die Antwort von @ webaware so zu ändern, dass die Ausgabe so aussieht ...

<link rel='stylesheet' id='twentytwelve-fonts-css'  href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700&subset=latin,latin-ext' type='text/css' media='all' />

... gewinnt das Kopfgeld.

7
its_me

WordPress weiß, was es hier tut. Ehrlich.

Wenn Sie ein kaufmännisches Und in HTML rendern, sollten Sie immer &amp; oder &#038; verwenden. Der Browser konvertiert es dann in &, bevor er die HTTP-Anforderung tatsächlich auslöst. Überzeugen Sie sich selbst, indem Sie die Netzwerkaufrufe in einem Web Inspector-Tool überprüfen. Sie verlieren Ihre nicht-lateinischen Untergruppen nicht wirklich.

Beachten Sie den &#038;? Es sollte & sein, andernfalls enthalten die bereitgestellten Schriftdateien nur die lateinischen Glyphen (d. H. Der Teilmengenparameter in der URL wird vernachlässigt, es sei denn, Sie verwenden & und NICHT dessen HTML-Entität).

Dies sagt mir, dass Sie die Quelle überprüft haben, um festzustellen, ob ein kaufmännisches Und vorliegt, ohne das resultierende Verhalten tatsächlich zu überprüfen. Ja, es tritt auf, wenn Sie eine URL mit einem Und-Zeichen in eine Adressleiste einfügen. Dies ist jedoch nicht der Fall, wenn Sie eine ordnungsgemäß codierte und maskierte URL in einem HTML-Attribut src oder href haben.

Sie sollten unter http://www.blooberry.com/indexdot/html/topics/urlencoding.htm nach zusätzlichen unsicheren und reservierten Zeichen suchen. Beide Gruppen sollten immer verschlüsselt sein.

22
Andrew Nacin

Versuchen Sie dies (wird auch HTTP vs HTTPS behandeln):

function wpse_google_webfonts() {
    $protocol = is_ssl() ? 'https' : 'http';
    $query_args = array(
        'family' => 'Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700',
        'subset' => 'latin,latin-ext',
    );

    wp_enqueue_style('google-webfonts',
        add_query_arg($query_args, "$protocol://fonts.googleapis.com/css" ),
        array(), null);
}

add_action( 'wp_enqueue_scripts', 'wpse_google_webfonts' );
5
webaware

Basierend auf dieser Antwort könnten Sie so etwas versuchen ungetestet Code:

add_filter( 'clean_url', 'wpse_77227_decode_googlefont_url' );

function wpse_77227_decode_googlefont_url( $url )
{
    $Host = parse_url ($url, PHP_URL_Host );

    if ( 'fonts.googleapis.com' === $Host )
        return urldecode( $url );

    return $url;
}
2
fuxia

Eigentlich ist es so einfach:

wp_enqueue_style( 'google-webfonts', 'http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700&subset=latin,latin-ext', array(), null );

Und das sollte ausgeben:

<link rel='stylesheet' id='google-webfonts-css'  href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans:400italic,700italic,400,700&#038;subset=latin,latin-ext' type='text/css' media='all' />

Das entspricht ziemlich genau dem, was ich wollte (ich bedaure nur, dass & in der Ausgabe zu &#038; wird). Aber dann wurde mir klar, dass es eigentlich egal ist, hauptsächlich dank Andrew Nacins Antwort .

Aber ich muss allen für ihre Bemühungen danken.

1
its_me