anpassen des wordpress themes ‚twenty ten‘

layout-grundlage dieses blogs ist das standard-wordpress-3.1-theme ‚twenty ten 1.2‘, das von mir angepasst wurde und wird.

man kann zwar einige dinge im dashboard einstellen [wie zum beispiel die headergrafik oder hintergrundfarben], das geht mir aber nicht weit genug.

ich werde in diesem artikel möglichst vollständig dokumentieren, was ich wie verändert habe. vielen dank an dieser stelle an yannic federer, der mir mit seinem senfpressen-artikel sehr weitergeholfen hat.

schriftgröße
die für meinen geschmack viel zu große schrift im originaltheme hat mich genervt. die wird in der style.css geändert [ zu finden in wp-content/themes/pieux [ich habe ein so genanntes child-theme erstellt und es ‚pieux‘ genannt. das original heisst natürlich /twentyten ]]. style.css mit einem editor öffnen.
im bereich /* =Global Elements ab zeile 201 wird die schriftgröße, -farbe und das -verhalten definiert. ich habe die schriftgrösse auf 10px, die zeilenhöhe auf 18px gesetzt und die farbe so gelassen:

textarea {
color: #666;
font-size: 10px;
line-height: 18px;

das gefällt mir besser.

schriftfarbe
da das so gut geklappt hat, habe ich auch gleich änderungen an der farbe der links vorgenommen. ab zeile 317:

a:link {
color: #383838;
}
a:visited {
color: #383838;
}
a:active,a:hover {
color: #9c9b9b;

die schrift erscheint dann anthrazit, bereits besuchte links werden farblich nicht verändert und beim mouseover über links wechseln diese zu grau.
dies gilt nur für die sidebar und artikel.

template ‚one column, no sidebar‘ verbreitern
genervt hatte mich bereits, und ich bin dann eher zufällig drüber gestolpert:um das template one column, no sidebar zu verbreitern [im standard ist es 640 px breit], wird ebenfalls die style.css verändert, und zwar habe ich im bereich /* =Layout ab zeile 95 die breite auf 900 px gesetzt:

.one-column #content {
margin: 0 auto;
width: 900px;

ich nutze dieses template vor allem für die foto-seiten.

kopfzeilen-bild verkleinern
der ganze headerbereich ist mir im original zu hoch. also habe ich nach einem weg gesucht, die höhe des ‚kopfzeilen-bildes‘ auf 100 px zu verringern.
das wird in der functions.php [steht im hauptpfad] ab zeile 116 erledigt:

define( ‚HEADER_IMAGE_WIDTH‘, apply_filters( ‚twentyten_header_image_width‘, 940 ) );
define( ‚HEADER_IMAGE_HEIGHT‘, apply_filters(‚twentyten_header_image_height‘, 100 ) );

Blog-Slogan verbergen
den blog-slogan an sich finde ich gut, da man ihn als blogbezeichnung nutzen kann und er automatisch in den browser-tabs angezeigt wird. aber im blog selber wollte ich ihn nicht sehen.
also habe ich den blog-titel und den slogan in der style.css ab zeile 335 einfach weiß getüncht:

#site-title a {
color: #ffffff;
font-weight: bold;
text-decoration: none;
}
#site-description {
color: #ffffff;
clear: right;
float: right;
margin: 15px 0 18px 0;
width: 100px;

‚Home‘-button umbennen
da ich meinen blog möglichst frei halten will von großen buchstaben (außer bei zitaten), hat mich der vorgegebene ‚Home‚-button von anfang an nervös gemacht.
die lösung war nicht ganz einfach zu finden, aber der freundliche herr foreverandcounting hat sie dann doch im forum verraten:
etwas versteckt im ordner wp-includes stößt man auf die post-template.php. dort ändert man einfach in zeile 887 ‚Home‚ in was man will [bei mir ’start‘]:

// Show Home in the menu
if ( ! empty($args[’show_home‘]) ) {
if ( true === $args[’show_home‘] || ‚1‘ === $args[’show_home‘] || 1 === $args[’show_home‘] ) $text = __(‚Home‚);

dies muss übrigens beim upgrade von wordpress 3.1 auf wordpress 3.1.1 wiederholt werden… und 3.1.3…

favicon integrieren
um ein favicon zu integrieren, muss in die den kopf [bei mir war’s zeile 67] der header.php der pfad zur .ico festgelegt werden:

<link rel=“shortcut icon“ href=“http://www.303entertainment.de/blog/wp-content/themes/pieux/favicon.ico“ type=“gif/favicon.ico“ />

natürlich muss dort auch eine grafik sein, die so heißt [in meinem fall ‚favicon.ico‘].

 

Dieser Beitrag wurde unter Das Blog, Design abgelegt und mit , , , verschlagwortet. Setze ein Lesezeichen auf den Permalink.

7 Antworten auf anpassen des wordpress themes ‚twenty ten‘

  1. Hallo Björn,

    danke – in Deinem Post habe ich die Lösung für so ziemlich alle meine TwentyTen-Probleme gefunden.
    7 auf einen Schlag 😉
    Ich freu mich!
    Viele Grüße

    Mel.

  2. Henri sagt:

    Hallo Björn,

    sehr gut erklärt noch mal Danke!

    Eine Frage habe dennoch: wie geht’s mit der Gestaltung des TagClouds bei Twenty Ten? wie kann ich das Aussehen der Wörter (Farbe, Größe, Bewegung(?)), etc. ) anpassen?
    Es wäre schön wenn du helfen könntest.

    Grüße
    Henri

  3. pieux sagt:

    hallo henri,
    danke für dein lob!
    mit der tagcloud habe ich mich leider noch nicht beschäftigt, sorry, da kann ich momentan nicht helfen…
    gruß,
    björn

  4. gehege sagt:

    Vielen Dank für die guten Infos. Habe aber noch eine Frage wie ich auf der Startseite „Meta“ mit „Admin“ und „Abmelden“ weg kriege. Vielen Dank!

  5. pieux sagt:

    hallo gehege,
    schön, wenn ich helfen konnte, aber ich verstehe deine frage nicht so ganz.
    ich denke aber, du findest hier hilfe!
    gruß,
    björn

Schreibe einen Kommentar

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