Eigenes WordPress-Theme erstellen

Das Wordpress-Theme erweitern: Die functions.php

∅ 4.8 / 32 Bewertungen

Die functions.php

Die Datei functions.php ist zuständig für die Widgets und für ausgelagerte PHP-Funktionen, mit denen man ein Theme erweitern kann. Widgets sind kleine Erweiterungen, die man komfortabel aus dem Backend verwalten kann (siehe auch: http://codex.wordpress.org/Plugins/WordPress_Widgets ). In diesem Kurs werden wir uns hauptsächlich mit der Widget-Thematik beschäftigen. Schauen wir uns eine sehr einfache functions.php an:

<?php
if ( function_exists('register_sidebar') )
 register_sidebar(array('name'=>'seitenleiste',
 'before_widget' => '<div class="widget">',
 'after_widget' => '</div>',
 'before_title' => '<h2>',
 'after_title' => '</h2>',
 ));
?>

Nachdem Sie diese Datei hochgeladen haben, haben Sie die Widget-Funktionalität des Themes ermöglicht. Sie könnten rein theoretisch aus dem Backend heraus Inhalte in z. B. der Sidebar verwalten. Es fehlt allerdings noch ein Schritt. Sie müssen die in der functions.php definierte Widget-Funktion (dynamische Sidebar) auch in einer Themes-Datei einbinden. Öffnen Sie die sidebar.php und ergänzen Sie diese:

<div id="sidebar"><?phpif ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('seitenleiste') ) :?><h2><label for="s">Suchen</label></h2><form id="searchform" method="get" action="<?php bloginfo('url'); ?>/"><div><input name="s" id="s" size="20" type="text" /><input name="submit" value="Suchen" type="submit" class="such-button" /></div></form><h2>Kategorien</h2><ul><?php wp_list_categories('orderby=name&show_count=1&title_li='); ?></ul><h2>Monatsarchiv</h2><ul><?php wp_get_archives(); ?></ul><h2>Sonstiges</h2><ul><?php wp_register(); ?><li><?php wp_loginout(); ?></li><?php wp_meta(); ?></ul><?php endif; ?></div><!-- /#sidebar -->
<!-- Ende der sidebar.php -->

Wie schon gehabt, habe ich den neu hinzugekommenen Code hervorgehoben. Was "sagt" uns dieser Code?

if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('seitenleiste') ) :

"Wenn die dynamische Sidebar nicht existiert oder nicht aktiv ist, dann…", dann wird der Rest des Codes in der Sidebar ausgegeben bzw. ausgeführt. Existiert allerdings eine dynamische Sidebar und ist diese auch aktiv, wird der Inhalt angezeigt, welchen man unter "Design" » "Widgets" bestimmt hat. Laden Sie auch die geänderte sidebar.php hoch und begeben Sie sich in den Widgets-Bereich:

abbildung-6-auswahl-der-widgets

Abbildung 6: Auswahl der Widgets

Auf der linken Seite sehen Sie die verfügbaren Widgets, welche Sie durch das Anklicken von "Hinzu" aktivieren können. Manche Widgets kann man dann auf der rechten Seite bearbeiten (z. B. die Überschrift anpassen), bei einigen geht das nicht. Ich habe mich zu Demo-Zwecken für die Auflistung der letzten Kommentare und der Blogroll entschieden.

abbildung-7-die-widgets-in-aktion

Abbildung 7: Die Widgets in Aktion

Kann ich auch mehrere dynamische Sidebars haben?

Ja! Sie können in der functions.php mehrere dynamische Sidebars definieren und diese müssen Sie – anders als der Name vermuten lässt – nicht in die Sidebar einbinden. Sie können sich eine zusätzliche dynamische Sidebar definieren:

<?php
if ( function_exists('register_sidebar') )
register_sidebar(array('name'=>'seitenleiste',
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h2>',
'after_title' => '</h2>',
));
register_sidebar(array('name'=>'footer','before_widget' => '<div class="widgets2">','after_widget' => '</div>','before_title' => '<h2>','after_title' => '</h2>',
));
?>

Und diese neue dynamische Sidebar könnten Sie dann z. B. ohne Probleme in die footer.php einbinden. So könnte beispielsweise die footer.php mit Widget-Funktion ausschauen:

<div class="clearer"><!-- hebt später die floats auf --></div>
</div><!-- /#mittelbereich -->

<div id="footer">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('footer') ) : ?><!-- Widgets inaktiv --><?php endif; ?>
<p>Copyright © Dein Name 2013 – Alle Rechte vorbehalten – Angetrieben von <a href="http://wordpress.org">WordPress</a></p>
</div><!-- /#footer -->

</div><!-- /#container -->

<?php wp_footer(); ?>
</body>

</html>