WordPress: Conditional Tags und Stilvorlagen

Mobile Helden
Mobile Helden - Screenshot

Wer in WordPress unterschiedliche CSS-Stilvorlagendateien zu unterschiedlichen Zeitpunkten verwenden möchte, der kann sich dabei mit Conditional Tags aushelfen, wir zeigen wie das funktioniert.

Es gibt einen Standard-Aufruf für die Stilvorlagendatei: bloginfo('stylesheet_url');. Dieser gibt an Ort und Stelle sofort den URL der CSS-Datei style.css im Template-Verzeichnis aus. Wollen wir selbst eigene Stilvorlagen in unterschiedlichen Vorlagen nutzen, helfen uns die Conditional Tags von WordPress.

Parameter für bloginfo()

Natürlich bietet bloginfo(); weitere Parameter, mit deren Hilfe auch andere Informationen ausgegeben werden können.1 Damit wir selbst noch Ergänzungen an der Ausgabe hinzufügen können, nutzen wir stattdessen get_bloginfo();.2 Die „get“-Befehle bei WordPress liefern nur einen konkreten Wert zurück, mit dem man in PHP weiterarbeiten kann. Man kann sie zudem außerhalb des WordPress-Loop verwenden.

Head erweitern

In unserem Fall wollen wir auf einzelnen Artikelseiten noch ein zusätzliches Stylesheet namens single.css laden. Wir können entweder im Head der single.php-Vorlagendatei unseren Aufruf für die CSS-Datei hinzufügen. Wenn wir aber den Kopf der Datei selbst auslagern, wie WordPress es von Haus aus über die header.php vorsieht, dann müssen wir auf die erwähnten Conditional Tags3 zurückgreifen, um zu entscheiden, ob der „Header“ gerade auf einer Einzelseite angezeigt wird.

Mit dem Ausdruck is_single(); wird beispielsweise abgefragt, ob die derzeit angezeigte Seite eine Artikelseite ist. Für die Startseite, Archivseiten und andere mehr gibt es ebenfalls solche Conditional Tags.

Beispielcode

Ein Beispiel für das skizzierte Szenario der Integration eine single.css immer dann, wenn wir auf einer Einzelseite sind, schaut wie folgt aus:

<?php if (is_single() ) { ?>
  <style type="text/css" media="screen">
    @import url( <?php echo get_bloginfo('template_directory') . '/single.css'; ?> );
  </style>
<?php } else { ?>
  <style type="text/css" media="screen">
    @import url( <?php bloginfo('stylesheet_url'); ?> );
  </style>
<?php } ?>

Dieser Code sollte sich im Kopfteil der header.php wiederfinden, zwischen <head> und </head>.

Geschrieben von:
Geschrieben am: 04.02.2009
Zuletzt aktualisiert: 29.01.2016
Zurück zu: Tipps und Tricks
Was sagst Du dazu? Kommentieren!
Färber zur GEZ: KEF als Totschlagargument!
CeBit 2009: SSD-News von Intel, Fujitsu Siemens und Verbatim

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>



Zuletzt kommentiert