Für unser neuestes ElmaStudio Redesign haben wir die bei Adobe Fonts zur Verfügung stehenden Schriften Degular und Degular Display verwendet. Die Schriften ins Frontend einzubinden war auch kein Problem. Dazu musste ich lediglich den von Adobe Fonts bereitgestellten Snippet in meinen Header einfügen. Um den Fontsnippet nicht bei einem Themeupdate zu verlieren, habe ich entschieden, das WordPress-Plugin Insert Headers and Footers zu installieren. So kann ich Codesnippets in den Header oder Footer-Bereich meiner Webseite einbinden. Das Plugin war dann auch noch für den Codesnippet unseres Helpscout-Badges hilfreich. CSS Anpassung im Theme Soweit so gut die Adobe Font wird geladen und ich kann sie über eine kleine Anpassung im CSS im Frontendbereich unsere Webseite nutzen. Die genötigte eigene CSS-Anpassung hierfür lautet: :root { --global--font-primary: 'degular-display', sans-serif; --global--font-secondary: 'degular', sans-serif; } Sobald Global Styles in WordPress Standard werden (siehe WordPress 5.8 Update) wird die Integration von eigenen Schriften übrigens noch sehr viel einfacher. Adobe Font in der Editor-Ansicht Leider wird die Adobe-Schrift jetzt aber noch nicht im WordPress-Editor angezeigt. Dafür habe ich ein bisschen googeln müssen, bis ich eine improvisierte Lösung gefunden habe. Ich hoffe das sich das Verhalten noch verbessert, um meinen kleinen Hack nicht zu vergessen, wollte ich es aber doch kurz hier auf dem Blog teilen. Der benötige Code, um meine Adobe Font auch im Editor sichtbar zu machen, muss in die functions.php des Themes eingefügt werden. /** * Show Adobe font in editor */ add_action( 'enqueue_block_editor_assets', function() { wp_enqueue_style( 'adobe-fonts', 'Your Adobe Webproject URL here' ); } ); Sobald ich eine bessere Lösung finde, werde ich den Beitrag updaten. Kennst du vielleicht schon eine bessere Umsetzung? Ich freue mich auf Kommentare und Tipps. The post Adobe Fonts im WordPress Block-Editor anzeigen first appeared on ElmaStudio.
In diesem ersten Beitrag stelle ich dir das KadenceWP Theme und den WordPress Block Editor kurz vor und erkläre, warum sie eine hervorragende Wahl sowohl für WordPress-Einsteiger als auch für fortgeschrittene Benutzer sind. Der Beitrag Einführung in das K
zum Artikel gehenPlötzlich zeigt die dein WordPress statt des Gutenberg Blockeditor nur noch den Standard Editor an. Wie du das behebst und wodurch das kommt, erfährst du in diesem Beitrag. Vor kurzem ging es mir genau so. Ich wollte einen Blogbeitrag weiterschreiben und
zum Artikel gehenNicht lange nach dem Release von WordPress 6.3 gibt es bereits das erste Sicherheits- und Wartungsupdate. Mit der neuesten Aktualisierung von WordPress auf Version 6.3.1 wurden eine Reihe von bedeutenden Änderungen und Fehlerbehebungen vorgenommen, die d
zum Artikel gehenIcon Fonts setzt man wie eine Schrift im Webdesign ein. Diese Auswahl professioneller Icon Fonts sind kostenlos und auch für kommerzielle Projekte einsetzbar.
zum Artikel gehenEs ist leider schon eine Weile her, dass ich die Muße gefunden habe, mich einem neuen Blogbeitrag zu widmen. 2020 hat sich turbulenter entwickelt, als wir es uns alle noch vor ein paar Wochen hätten vorstellen können. Auch unsere Pläne haben sich kurzerha
zum Artikel gehen