Twenty Twelve Extensions – Titelfarbe ändern

Heute ändern wir bei Twenty Twelve Extensions die Titelfarbe. Damit werden sowohl Schriftfarbe als auch Hintergrundfarbe der Beitrags- und Seitentitel geändert. Wir nehmen die Änderung im Child-Theme vor, um vor eventuellen Theme-Änderungen sicher zu sein und kein weiteres Plugin zu benötigen.

Twenty Twelve Extensions – Titelfarbe ändern: Child-Theme

Das Child Theme haben wir bereits gestern eingeführt. Bitte lese den Beitrag: Child-Theme Twenty Twelve erstellen…
Diese Vorgehensweise der Erstellung des Child-Themes gilt auch für alle anderen Themes.

Twenty Twelve Extensions – Titelfarbe ändern

Zum Ändern der Titelfarbe (so soll es aussehen:)

Twenty Twelve Extensions Titelfarbe ändern

Twenty Twelve Extensions Titelfarbe ändern

brauchen wir nur einen kleinen Code-Fetzen am Ende unserer neuen style.css einzufügen:

1
h1.entry-title a{color:#FFFFFF;background-color:#FF8040;}

Der Code erklärt sich eigentlich wie von selbst. Die Schriftfarbe des Titels (color) wird auf weiß (#ffffff) gesetzt und die Hintergrundfarbe auf schwarz (#000000). Die auf einander abgestimmten Farben kann man sich mit Farbcode hier heraussuchen…

Twenty Twelve Extensions – Titelfarbe ändern: Neue style.css

Nun sieht der gesamte Inhalt unserer neuen style.css so aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
/*
Theme Name: My Twenty Twelve Child-Theme Extensions
Theme URI: http://www.mydomain.de/
Description: My own Twenty Twelve extensions
Author: Chris Andersen | myblogtrainer.de
Author URI: http://www.myblogtrainer.de/child-theme-twenty-twelve-erstellen/
Template: twentytwelve
Version: 0.1.0
*/
 
@import url("../twentytwelve/style.css");
 
h1.entry-title a{color:#FFFFFF;background-color:#FF8040;}

Hast Du Fragen oder Kommentare zum Thema Twenty Twelve Extensions – Titelfarbe ändern, schreibe einen Kommentar…

Ein Gedanke zu „Twenty Twelve Extensions – Titelfarbe ändern

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>