Verwalten von Schriftarten in WordPress -Block -Themen

Website -Design hängt von Typografie ab. WordPress -Themen integrieren häufig Dienste wie Google -Schriftarten, die einfach im Customizer für klassische PHP -Themen verwaltet werden. Dies ist jedoch für Blockthemen nicht so einfach. Während die klassische Themenintegration gut dokumentiert ist, fehlt das Block-Themen-Schriftart-Management ähnliche Anleitung. Dieser Artikel befasst sich mit dieser Lücke. Blockthemen kann Google -Schriftarten verwenden, aber der Registrierungsprozess unterscheidet sich erheblich von herkömmlichen Methoden.

vorhandenes Wissen

Ressourcen für die Integration von Schriftarten in Blockthemen waren anfangs knapp. Zweiundzwanzig zweiundzwanzig, das erste Standard-Blockbasis-Thema, das mithilfe heruntergeladener Schriftdateien als Themenvermögen demonstriert wurde. Auf diese Weise wurde die Registrierung von Dateien in functions.php und das Definieren von gebündelten Schriftarten in theme.json-einem umständlichen zweistufigen Prozess definiert.

spätere Themen, wie dreiundzwanzig, vereinfacht dies durch die Definition von gebündelten Schriftarten ohne explizite Registrierung. Manuelle Schriftart -Downloads und Bündelung bleiben jedoch verbleiben, wobei die Bequemlichkeit der gehosteten Schriftarten über eine CDN serviert wird.

Neuere Entwicklungen

Das Gutenberg -Projekt, ein Plugin zum Testen der kommenden Block- und Site -Editor -Funktionen, bietet eine Lösung. Matias Benedetto, Gutenbergs Hauptarchitekt, der unter Verwendung von Google -Schriftarten (oder allen heruntergeladenen Schriftarten) in Blockthemen über das Block -Themen -Plugin hervorgehoben wird.

Lernen WordPress bietet einen Videoüberblick über dieses Plugin, das die Erstellung von Themen vereinfacht, indem WordPress UI -Steuerelemente angeboten werden. Sie können ganze Themen, untergeordnete Themen oder Stilvariationen erstellen, ohne Vorlagendateien zu codieren oder zu ändern. Wenn es vom Team von WordPress.org verfasst und gepflegt wird, ist es derzeit der beste Ansatz für die Integration von Google Font in Block -Themen. Beachten Sie jedoch, dass es in aktiver Entwicklung steht. Erwarten Sie also Änderungen.

Bevor Sie diese neue Methode untersuchen, lesen wir den traditionellen Ansatz für klassische Themen.

Die traditionelle Methode

Artikel wie die von Themeshaper (2014) und Cloudways veranschaulichen die klassische Methode. Das zwanzig siebzehn Thema veranschaulicht, dass Google -Schriftarten in functions.php:

geltend machen

function twentyseventeen_fonts_url() {
  $fonts_url = '';
  $libre_franklin = _x( 'on', 'libre_franklin font: on or off', 'twentyseventeen' );
  if ( 'off' !== $libre_franklin ) {
    $font_families = array();
    $font_families[] = 'Libre Franklin:300,300i,400,400i,600,600i,800,800i';
    $query_args = array(
      'family' => urlencode( implode( '|', $font_families ) ),
      'subset' => urlencode( 'latin,latin-ext' ),
    );
    $fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  }
  return esc_url_raw( $fonts_url );
}

Vorverbinden von Google-Schriftarten:

function twentyseventeen_resource_hints( $urls, $relation_type ) {
  if ( wp_style_is( 'twentyseventeen-fonts', 'queue' ) && 'preconnect' === $relation_type ) {
    $urls[] = array(
      'href' => 'https://fonts.gstatic.com',
      'crossorigin',
    );
  }
  return $urls;
}
add_filter( 'wp_resource_hints', 'twentyseventeen_resource_hints', 10, 2 );

Nachteile der traditionellen Methode

Diese Methode hat einen signifikanten Nachteil. In einem 2022 Deutschen Gerichtsurteil wurde die DSGVO -Verstöße aufgrund der Exposition von IP -Adressen von Besucher bei der Einführung von Google -Schriftarten hervorgehoben. Dieses Problem wird vom Plugin des Block -Themas erstellen.

Verwenden von Google -Schriftarten mit Blockthemen (moderner Weg)

Der moderne Ansatz nutzt das Plugin mit Block -Block -Themen. Richten Sie eine lokale Entwicklungsumgebung ein (z. B. mit Flywheel Local) und installieren Sie die Thementestdaten und erstellen Sie Block -Themen -Plugins.

Navigieren Sie zu Aussehen → Themen -Schriftarten . Dieser Bildschirm listet definierte Schriftarten auf und bietet Optionen an:

• Hinzufügen von Google -Schriftarten: fügt Schriftarten direkt aus der Google -Schriftarten -API hinzu.
• Fügen Sie lokale Schriftarten hinzu: fügt hochgeladene Schriftdateien hinzu.

Verwenden eines leeren Thema assets/fonts theme.json

thema anzeigen.json code

function twentyseventeen_fonts_url() {
  $fonts_url = '';
  $libre_franklin = _x( 'on', 'libre_franklin font: on or off', 'twentyseventeen' );
  if ( 'off' !== $libre_franklin ) {
    $font_families = array();
    $font_families[] = 'Libre Franklin:300,300i,400,400i,600,600i,800,800i';
    $query_args = array(
      'family' => urlencode( implode( '|', $font_families ) ),
      'subset' => urlencode( 'latin,latin-ext' ),
    );
    $fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  }
  return esc_url_raw( $fonts_url );
}

Die Schrift ist dann in den globalen Stilen des Site -Editors verfügbar.

Hinzufügen lokaler Schriftarten funktioniert ähnlich und vereinfacht den Vorgang im Vergleich zu manuellen

-Modifikationen. Die Schriftentfernung wird auch in der Schnittstelle des Plugins behandelt.

zukünftige Entwicklungen functions.php

Die Funktion "Font Manager" ist für WordPress Core geplant und bietet ähnliche Funktionen.

Schlussfolgerung

Das Plugin des Block-Themas erstellen das Schriftarten der Schriftart in WordPress-Block-Themen und bietet eine benutzerfreundliche und GDPR-konforme Lösung. Es vereinfacht das Hinzufügen, Entfernen und Verwalten von Schriftarten ohne direkte Code -Interaktion.

Weiteres Lesen

(Liste der Ressourcen bleibt gleich, neu für eine bessere Lesbarkeit neu)

WordPress -Schriftmanagement:

So fügen Sie WordPress -Block -Themen (Theme Shaper) typografische Schriftarten hinzu

• So fügen Sie Google -Schriftarten zu WordPress -Themen (Thema Shaper)
hinzu
• Wie verwendet ich Google -Schriftarten mit WordPress? (Cloudways)
• Verwalten Sie Ihre Blockthema -Schriftarten mit Blockthema (Lernen
Verwenden Sie das Blockthema erstellen (WordPress.tv)
GitHub -Probleme:

Globale Stile/Typografie: Verwalten von Schriftstellungssätzen (#45271)

font Manager (#46332)
Europäische DSGVO -Anforderungen:

Deutsches Gerichtsbetreuungsbetriebsbesitzer wegen Verstoßes gegen die DSGVO mithilfe von Google-Hosted-Schriftarten (WPTAVern)

Einhaltung der DSGVO bei der Verwendung von Google -Schriftarten (WordPress -Themen machen)
Deutsches Gerichtsverfahren Benutzer € 100 € Schadensersatz gegen den Website -Betreiber für die Verwendung von Google Fonts (Eprivacy Blog)
Bunny-Schriftarten (CSS-Tricks)

Das obige ist der detaillierte Inhalt vonVerwalten von Schriftarten in WordPress -Block -Themen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!