In einem Projekt wo WordPress als “klassisches” CMS eingesetzt wird … also auf einer Website ohne Blog-Charakter … wurde vom Kunden gewünscht, dass man die Möglichkeit hat, bei bestimmten Unterseiten ein abweichendes Bild im Kopfbereich einzufügen.
Da bei der Installation schon einige wichtige Plugins im Einsatz sind, dachte ich mir ich setze auf eine einfache Code-Lösung und habe die abgespeckte Variante dessen genommen, die auch schon bei dem Vorgänger-Standard-Theme Twenty Ten (2010) im Einsatz ist.
Das Prinzip ist, die Artikelbilder als abweichende Grafiken im Kopfbereich zu nehmen. Zuerst aktivieren wir in der functions.php die Artikelbilder (egl. Post Thumbnails):
add_theme_support( 'post-thumbnails' );
Da aber die Maße der Kopfgrafik (960 x 108 Pixel) nicht mit den Maßen der anderen Vorschaubilder übereinstimmt, musste ich in der functions.php ein weiteres Format definieren:
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'kopfgrafik', 960, 108 );
}
Die Parameter-Angaben dürften soweit klar sein: Name des neuen Formats, die Breite und die Höhe des Bildes. Weitere Infos zu add_image_size()
findet man in der offiziellen Dokumentation.
Anschließend wurde die Template-Datei header.php angepasst:
<?php if (has_post_thumbnail()) {
the_post_thumbnail('kopfgrafik');
} else { ?>
<img src="/wp-content/uploads/2012/02/home_grafik.jpg" width="960" height="108" alt="" />
<?php } ?>
Mit diesem Code erreicht man, dass sofern ein Artikel oder Seite über ein Artikelbild verfügt, dieses auch im Kopfbereich eingefügt wird. Ist kein Artikelbild definiert, dann wird die definierte Standardgrafik eingebunden.
Man muss beim Bildupload lediglich darauf achten, dass man die Kopfgrafik bzw. das Artikelbild in voller Größe einbindet:
Wie man sieht, keine Raketenwissenschaft. Versetzt aber den Kunden dennoch in der Lage mit Bordmitteln, die Kopfgrafik bei Bedarf auf einzelnen Unterseiten auszutauschen und man spart sich ein zusätzliches Plugin.
Wir arbeiten seit 20 Jahren mit WordPress und bieten diverse Dienstleistungen rund um das System an. Kontaktiere uns für weitere Informationen oder für ein Angebot.
Falls man noch Platz für ein Plugin hat, kann ich da WP Display Header empfehlen! 😉
@Konstantin,
der Autor des Plugins hat deinen Gravatar geklaut. 😉
Da die Grafik per
the_post_thumbnail('kopfgrafik');
eingebunden wird, ist die Auswahl der richtigen Größe im Bildupload nicht notwendig, WordPress wählt die korrekte Größe bei der Einbindung durch das voreingestellte Keyword aus.
Zudem ist es nicht zwingend notwendig, eine zusätzliche Bildgröße “Kopfgrafik” zu definieren, wenn nur an dieser Stelle Artikelbilder eingesetzt werden sollen. Nach der Aktivierung der Post-Thumbnails per
add_theme_support( 'post-thumbnails' );
reicht es, die Größe für die Standard-Post-Thumbnails per
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );
zu definieren (HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT natürlich ersetzen mit der passenden Größe in Pixeln. )
Wird dies vorgenommen, reicht ein Aufruf von
the_post_thumbnail();
um das Post-Thumbnail auszugeben.
P.S.: twenty-ten enthält bereits die Aufrufe
add_theme_support( ‘post-thumbnails’ );
und
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );
Sie sind zu finden in der functions.php in der Funktion “twentyten_setup”.
Viele Grüße,
Kuchen und Kakao
@KuK,
Klar, dass geht auch. Anstatt
add_image_size( 'kopfgrafik', 960, 108 );
gibt manset_post_thumbnail_size( 960, 108, true );
ein. Ich persönlich erkenne hier keinen wirklichen Vorteil. In beiden Fällen muss man eigene functions.php anpassen. Es ging ja hier nicht um die Anpassung von 2010 sonder um ein individuelles Theme.weiß ich. 🙂 Deswegen schrieb ich ja auch:
Naja, es spart Platz auf dem Server. 1 Datei pro hochgeladenes Bild um genau zu sein. Zumindest, wenn man ein bestehendes Theme wie Twentyten, dass von sich aus post-thumbnail Unterstützung mitbringt , verwendet und für seine Zwecke anpasst. Beim Beispiel TwentyTen wird eine Größe über set_post_thumbnail_size gesetzt; wenn jetzt zusätzlich weitere Bildgrößen über add_image_size hinzugefügt werden, kann die Datenmenge je nach Menge der hochgeladenen Bilder schon deutlich variieren.
Aber zum Beitrag zurück: Zumindest sollte in deinem Beispiel die Zeile
add_image_size( 'kopfgrafik', 960, 108 );
in
add_image_size( 'kopfgrafik', 960, 108, true );
geändert werden, damit die Grafik exakt beschnitten wird. Gerade bei Kopfgrafiken ist häufig ein fester Bereich vorgesehen (in diesem Fall vermutlich 960px x 108px). Beim Aufruf ohne “true” wird das Bild nur solange verkleinert, bis beide Seiten kleiner oder gleich den angegebenen Maximalwerten sind. Das kann bei einem Seitenverhältnis von 1:1 dazu führen, dass in diesem Beispiel dein Headerbild nur 108px x 108px groß wäre…
Viele Grüße,
Kuchen und Kakao
@KuK,
bei insgesamt 5-6 individuellen Bildern im Kopfbereich zu verschmerzen. 🙂 Ich denke, die zusätzlichen 80-90 KByte lassen sich ohne Probleme unterbringen auf dem Server unterbringen.
Wenn es so viel Bilder wären, die dann auch von der Datenmenge ins Gewicht fallen, dann würde ich persönlich eh empfehlen, dass man bei so etwas auf Galerie- oder Slider-Plugins zurückgreift. Manuell per Post Thumbnails viele Dutzend oder sogar hunderte von Kopfgrafiken auszutauschen ist eine sehr undankbare Aufgabe.
Die Grafiken werden nach und nach in passender Form bzw. exakter Größe von 960×108 geliefert.