Mittwoch, 6. August 2014

Schrift-Art der Blog-Beschreibung anpassen

In einem meiner früheren Beiträge habe ich euch bereits erklärt, wie ihr die Schriftgröße eurer Blog-Beschreibung ändern/ anpassen könnt und davor ging es darum, wie ihr eine Blog-Beschreibung erstellen/ bearbeiten könnt und wie ihr diese in eurem Blog anzeigen könnt.

Heute beschäftigen wir uns mit der Schriftart der Blog-Beschreibung.

Als erstes beschäftigen wir uns mit der Frage, warum es sinnvoll sein könnte, die Schriftart der Blog-Beschreibung anzupassen. Im Anschluss daran schauen wir uns dann genauer an, wie ihr die Schriftart eures Blog-Beschreibungstextes ändern könnt.

In einem Fall werden wir die Schriftart mit Hilfe des Blogger-Vorlagendesigners ändern und in den übrigen Fällen werden wir die Schriftart durch eine kleine Anpassung des HTML-Codes ändern.
Das Bild zeigt den Header mit Blog-Beschreibung, in der voreingestellten Schriftgröße.
Blog-Beschreibung


Übersicht:
  • 1. Warum die Schriftart der Blog-Beschreibung anpassen?
  • 2. und 3. Schriftart der Blog-Beschreibung anpassen
    • 2. Vorlage „Awesome AG”
    • 3. Übrige Vorlagen: „Einfach”, „Bildfenster”, „Wasserzeichen”, „Fantastisch” und „Reise”


1. Warum könnte es sinnvoll sein die Schrift-Art der Blog-Beschreibung anzupassen?

Aus Design-Gründen – manchmal möchte man, dass der Header (zu dem auch die Blog-Beschreibung gehört) ein echter Blickfang wird, da kann man schon mal die Schriftart ändern.
Letzten Endes sollte die Blog-Beschreibung optisch zum restlichen Header passen – eine andere Schriftart kann hier den entscheidenden Unterschied ausmachen. Du solltest aber immer auch die Lesbarkeit im Blick haben und wenn möglich eine Schriftart wählen, die man gut lesen kann.


Die Schriftart der Vorlage „Awesome AG” kannst du über den Blogger-Vorlagendesigner ändern, bei den übrigen Vorlagen musst du den HTML-Code anpassen.



2. Schrift-Art der Blog-Beschreibung ändern/anpassen – bei der Vorlage „Awesome AG”

2.1. Anleitung zur Anpassung der Schrift-Art der Blog-Beschreibung bei der Vorlage „Awesome AG”

Wenn du die Vorlage „Awesome AG” verwenst, kannst du die Schriftart deiner Blog-Beschreibung anpassen (ohne den HTML-Code ändern zu müssen) einfach über den Blogger-Vorlagendesigner; – unter „Erweitert” – „Blog-Beschreibung”.

2.2. Klickweg – Schrift-Art Blog-Beschreibung – Vorlagendesigner

  1. Blog-Verwaltung
  2. Reiter „Vorlage”
  3. „Anpassen”
  4. Im Blogger-Vorlagendesigner „Erweitert”
  5. Unterpunkt „Blog-Beschreibung”
  6. Schriftart auswählen
  7. „Auf Blog anwenden”



3. Schrift-Art der Blog-Beschreibung ändern/anpassen – bei den übrigen Vorlagen 

„Einfach” – „Bildfenster” – „Wasserzeichen” – „Fantastisch” – „Reise”

3.1. Anleitung zur Anpassung der Schrift-Art der Blog-Beschreibung bei den Vorlagen „Bildfenster” - „Wasserzeichen” - „Fantastisch” und „Reise”

Um die Schriftart bei den übrigen Vorlagen zu ändern, müssen wir bei diesen Vorlagen in den HTML-Code eingreifen und diesen anpassen.

Wichtig: bevor du Änderungen am HTML-Code vornimmst, sichere immer deine Blog-Vorlage.


3.2. HTML bearbeiten und HTML-Code-Suche öffnen

Gehe in der Blog-Verwaltung auf „Vorlage” und dort dann auf „HTML bearbeiten”.

Um die richtige HTML-Code-Suche zu öffnen klickst du mit der Maus irgendwo in den HTML-Code, anschließend drückst du auf deiner Tastatur „Strg” + „F”.
Wichtig ist, dass dein Mauszeiger im HTML-Code blinkt, ansonsten öffnet sich nicht die HTML-Code-Suche sondern nur die normale Browser-Suche und damit findest du unter Umständen nicht die richtige Stelle im HTML-Code. 


3.3. Blog-Beschreibung HTML-Code finden

Nun musst du nach dem HTML-Code der Blog-Beschreibung suchen. Dazu tippst du den folgenden Begriff in das kleine Suchfeld und drückst „Enter”:
class='description'


3.4. HTML-Code der Blog-Beschreibung anpassen

Du solltest dann die folgenden Zeilen HTML-Code sehen:
<b:includable id='description'>
  <div class='descriptionwrapper'>
    <p class='description'><span><data:description/></span></p>
  </div>
</b:includable>
Du musst nun den grün markierten Teil durch den folgenden ersetzen:
<p class='description' style='font-family: Verdana;'> 
Zum anpassen der Schriftart, änderst du nun den Gelb markierten Teil und fügst dort die Schriftart deiner Wahl ein.
Im Ergebnis sollte dein HTML-Code dann beispielsweise so aussehen:
<b:includable id='description'>
  <div class='descriptionwrapper'>
    <p class='description' style='font-family: Verdana;'><span><data:description/></span></p>
  </div>
</b:includable> 


3.5. Vorlage speichern

Mit einem Klick auf „Vorlage speichern” werden deine Änderungen gespeichert und gleichzeitig angewendet – damit ist die neue Schriftart in deiner Blog-Beschreibung sichtbar.


3.6. Einschränkungen bei der Wahl der Schrift-Art

Bei meinen Tests habe ich bemerkt, dass ich nicht jede beliebige Schrift-Art für die Blog-Beschreibung verwenden konnte. Vor Allem hatte ich Probleme bei der Verwendung von Web-Zeichensätzen.

Daher solltest du ausprobieren, welche Schriftarten bei dir funktionieren und welche Schriftart dir am besten für deine Bog-Beschreibung gefällt.



Fragen, Wünsche, Anregungen

Ich hoffe meine kleine Anleitung hat dir weitergeholfen, falls es nicht funktionieren sollte, du Fragen, Wünsche oder Anregungen hast, darfst du mir gerne einen Kommentar hinterlassen oder mir eine Nachricht über mein Kontaktformular schicken.

Kommentare:

Vorbeigenäht hat gesagt…

Vielen Dank für die Anleitung! Hat alles auf Anhieb funktioniert :D

Liebe Grüße Nadine

Das Landmädchen hat gesagt…

Brauche schnelle Hilfe!
Trotzdem das ich meine calligrafitty Schriftart gespeichert habe, zeigt es mir auf einmal Comic sans an. Egal was ich tue, es lässt sich nix ändern. Weißt du wieso? Ist schon mehrere Tage so.