Yoko-Theme anpassen

Das Theme wurde früher in meinem Blog verwendet.

  • Drei feste Spalten: Die mittlere Spalte wurde auf die Breite von 0 Pixeln gesetzt und die anderen beiden etwas vergrößert.
  • Großschreibung der Menüs, des Blognamens und der Widgets: An den entsprechenden Stellen im CSS wurde die Anweisung “text-transform: uppercase” auskommentiert.
  • Zeilenhöhe und Zeilenabstand in den Widgets sind zu hoch: Auch hier wurde “line-height” im CSS angepasst.
  • Im Submenü (unter dem Bild) sind die einzelnen Links sehr weit auseinander und bei vielen Kategorieren landen diese irgendwann in der zweiten Zeile: Auch hier wurde per CSS der Abstand verkleinert.
  • Normale Textfarbe ist etwas zu hell: Wurde geändert auf den Wert #151515 (wie bei heise.de). Ich erinnere mich dunkel an einen Artikel diesbezüglich und dass es angenehmer zu lesen sein soll als “richtiges” Schwarz.
  • Import der Google-Fonts deaktiviert und diese auf der eigenen Webpräsenz gehostet. Die Lizenz der Schriften ermöglicht dies.

<WRAP center round info> Habe mittlerweile ein eigenes Child-Theme in Wordpress erstellt, damit die Änderungen auch bei Aktualisierungen des Themes erhalten bleiben. </WRAP>

Aktuelle CSS-Datei mit allen Änderungen

Trotz Child-Theme von Yoko kann man die @import-Variante für CSS wohl nicht verwenden, weil die Google-Fonts auskommentiert werden müssen und selbst gehostet werden.

Hier also die komplette, geänderte Datei des Child-Themes yoko-own: wp-content/themes/yoko_own/style.css.

Webfonts auf dem eigenen Server hosten

Um die Webfonts auf dem eigenen Server zu hosten, ist es ausreichend, die *.woff-Dateien herunterzuladen, auf dem eigenen Server abzulegen und die Pfade im Bereich @font-face auf den entsprechenden Pfad umzustellen.

Im Ergebnis z. B.:

@font-face {
  font-family: 'Droid Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Droid Serif'), local('DroidSerif'), url(/lwebfonts/Droid-Serif.woff) format('woff');
}

MIME-Typ

Habe gerade erst ind er Errorconsole gesehen, dass es Fehler wegen des Dateityps gibt:

Resource interpreted as Font but transferred with MIME type application/octet-stream: "blog.tld/lwebfonts/Droid-Sans.woff". 

Dagegen hilft ein Eintrag in der .htaccess:

AddType application/x-font-woff .woff

Keine excerpts (Auszüge) für Suche und Archiv

Siehe hier.

Zuletzt geändert: 2023-01-10 20:08:32 +0100 CET: init