Mit zwei Änderungen im HTML kann man die Einstellmöglichkeiten für die Blog-Beschreibung erweitern und dafür sorgen, dass sie funktionieren. Im Ergebnis wird man für die Blog-Beschreibung nicht nur erfolgreich die Schriftfarbe, sondern auch die Schriftgröße und vor allem auch die Schriftart wählen können.
Das sind die Standards
 |
| Blog-Beschreibung - Einstellmöglichkeiten im Designer - Standard |
Dass es nur diese eine Eintragsmöglichkeit gibt, liegt daran, dass im HTML unter der Group "Blog Description" nur eine Variable für Farbe eingetragen ist.
 |
| Blog-Beschreibung - Group-Variable im HTML - Standard |
Damit dieses "value" aber auch tatsächlich im Blog Wirkung zeigt, braucht es noch einen passenden CSS-Eintrag, der im Style-Bereich des HTML zu finden ist. Das Dollarzeichen deutet immer darauf hin, dass ein CSS-Kommando auf eine Variable zugreift.
 |
| Blog-Beschreibung - Style-Kommandos im HTML - Standard |
Hier sieht man ein Beispiel dafür, dass Chaos bezüglich der Blog-Beschreibung in den Blogger-Vorlagen herrscht. Es wird hier auf Schriftgröße zugegriffen, die jedoch gar nicht als Variable hinterlegt ist, weshalb man sie im Designer nicht einstellen kann. In der Vorlage Reise/Travel fehlt sogar außerdem die Zeile für den Zugriff auf "color", weshalb man die Farbe im Designer zwar einstellen kann, das CSS aber auf die Einstellung nicht zugreift. Die Einstellung im Designer bleibt deshalb in dieser Vorlage ohne Effekt.
Das muss man ändern
Vorbemerkung: Bevor man unter "HTML bearbeiten" etwas ändert, sollte man vorsichtshalber immer eine aktuelle Backup-Datei der Vorlage runterladen. (Link oben rechts unter "Vorlage".)
Man braucht also noch eine weitere Variable, um die Einstellmöglichkeit für Schriftart und Schriftgröße im Designer zu haben und man benötigt das CSS-Kommando, das auf diese Variable zugreift.
Ich habe mir behelfsmäßig angesehen, was für den Blog-Titel eingetragen ist und habe die jeweiligen Einträge für "font" kopiert und den Namen der Variable darin geändert. In der Variable habe ich auch die Voreinstellung der Schriftgröße verringert. Je nach Vorlage ist eine andere Schriftart im Blog-Titel voreingestellt, deshalb trifft das folgende Beispiel nur auf die Vorlage zu, aus der ich die Variable kopiert hatte.
Um die Stelle zu finden, an der man die variable eintragen kann, muss man nach Blog Description suchen
Folgend ist die Variable, die ergänzt werden muss und die für Schriftart und Schriftgröße zuständig ist, gelb markiert. Ich habe sie oberhalb der Variable für die Farbe eingefügt.
<Group description="Blog Description" selector=".header .description">
<Variable name="description.font" description="Font" type="font"
default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
<Variable name="description.text.color" description="Description Color" type="color"
default="#777777" value="#000000"/>
</Group>
Um die Stelle zu finden, an der man das CSS eintragen kann, das auf die Variable zugreift, muss man nach .description suchen.
Im CSS habe ich den Zugriff auf das nicht vorhandene "font-size" entfernt und statt dessen den Code für den Zugriff auf das umfassendere und nun tatsächlich als Variable vorhandene "font" eingefügt. Auch das ist hier gelb markiert und ich habe es oberhalb der Zeile für den Zugriff auf die Farbe eingetragen. Ich habe den Eintrag für die Farbe orange markiert, weil Nutzer der Vorlage Reise/Travel auch diese Zeile benötigen.
.Header .description {
font: $(description.font);
color: $(description.text.color);
}
Nach den Änderungen auf "Vorlage speichern" klicken und warten bis das erledigt ist. Dann auf "Zurück" klicken.
Ergebnis der Änderung
Im Blogger-Vorlagendesigner sieht es nun für die Blog-Beschreibung wie folgt aus:
 |
| Blog-Beschreibung - Einstellmöglichkeiten - nach Änderung im HTML |
Das Bild zeigt, dass bereits Einstellungen vorgenommen wurden und man sieht, dass die Einstellungen tatsächlich Effekt zeigen.
Ute Ziemes, sg.utez.de,
danke!
AntwortenLöschenich habe eine Travel-Vorlage und bei mir haben die Tipps funktioniert. Die Änderungen klingen komplizierter, als sie sind. Du hast es perfekt beschrieben!