Dieser Artikel beschreibt die Anpassung des Standartthemes “Twenty Twelve”. Es wird ein sogenanntes “Child Theme” erzeugt und so angepasst, dass auf der Startseite und den Kategorieseiten nur Auszüge der Artikel angezeigt werden und nicht der komplette Artikel.
Ein WordPress Child Theme ist ein Theme, welches die Funktionalität eines anderen Themes, des sogenannten Parent Themes übernimmt und um eigene Anpassungen ergänzt. Die Verwendung eines Child Themes bietet sich an wenn man ein Theme anpassen/verändern möchte. Diese Anpassungen sollten nicht, im Standardtheme vorgenommen werden, da sie bei einem Update des Themes überschrieben werden und verloren gehen. Lagert man die Änderungen in ein Child Theme aus bleiben sie bei einem Update des Parent Themes erhalten.
Die Themes liegen im Pfad /wp-content/themes eurer WordPress Installation. In diesem Verzeichnis kann man nun ein neues Unterverzeichnis für das Child Theme anlegen. Ein Child Theme benötigt mindestens eine style.css. In der style.css des Child werden die Einstellungen des Parent Theme importiert und um die eigenen Änderungen ergänzt. Wird das Child Theme aktiviert ersetzt die style.css des Child die style.css des Parent.
Hier ist ein Beispiel für eine entsprechende style.css:
/*
Theme Name: Twentytwelve Child
Description: Child theme for the twentytwelve theme
Author: Your name here
Template: twentytwelve
*/
@import url("../twentytwelve/style.css");
Hier folgt die Erklärung was der obige Code macht:
/*öffnet den Header des Child Theme.Theme Name:definiert den Namen des Child Theme.Description:Eine Beschreibung des Themes. Diese ist optional und kann entfallen.Author:Name des Autors. Angabe ist optional und kann entfallen.Template:Definiert das Parent Theme.*/schließt den Header des Child Theme.- Die Regel
@importimportiert die Einstellungen aus der style.css des Parent Theme
Damit haben wir alles was wir für das Child Theme brauchen und können dieses im WordPress Backend unter Design -> Themes aktivieren. Noch sehen wir keine Veränderung, da wir ja bisher nur die Einstellungen des Parent Themes importiert haben. Nun passen wir das Theme weiter an.
Auf der Startseite des Blogs, den Kategorie Seiten und den Suchergebnisseiten sollen nicht die vollständigen Artikel angezeigt werden, sondern nur Auszüge.
Dazu kopieren wir die Datei content.php aus dem Parent Verzeichnis in das Child Verzeichnis. Diese öffnet man mit einem Editor und geht zur Zeile 33, welche wie folgt aussehen sollte.
<?php if ( is_search() ) : // Display Excerpts only for Search ?>
Diese Anweisung bewirkt, dass die Artikelauszüge nur auf den Suchergebnisseiten angezeigt werden. Um sie auf den Kategorieseiten und der Startseite ebenfalls anzuzeigen ändern wir die Zeile wie folgt ab.
<?php if ( is_search() || is_home() || is_category() ) : // Display Excerpts for Search, Category and Home ?>
Nachdem die Datei gespeichert wurde aktualisiert man die Browseransicht und die Artikel werden nicht mehr komplett sondern nur noch auszugsweise dargestellt. Aber wir können noch mehr tun.
Normalerweise endet ein Auszug mit […]. Wir können statt dessen jedoch auch einen Link mit
einem Benutzerdefinierten Text anzeigen lassen.
“Weiterlesen…” Link hinzufügen
Um die benötigten Änderungen vornehmen zu können erstellen wir im Verzeichnis des Child eine leere functions.php und fügen folgenden Code ein.
<?php
/**
* Twenty Twelve functions and definitions.
*
* Sets up the theme and provides some helper functions, which are used
* in the theme as custom template tags. Others are attached to action and
* filter hooks in WordPress to change core functionality.
*
* When using a child theme (see http://codex.wordpress.org/Theme_Development and
* http://codex.wordpress.org/Child_Themes), you can override certain functions
* (those wrapped in a function_exists() call) by defining them first in your child theme's
* functions.php file. The child theme's functions.php file is included before the parent
* theme's file, so the child theme functions would be used.
*
* Functions that are not pluggable (not wrapped in function_exists()) are instead attached
* to a filter or action hook.
*
* For more information on hooks, actions, and filters, see http://codex.wordpress.org/Plugin_API.
*
* @package WordPress
* @subpackage Twenty_Twelve
* @since Twenty Twelve 1.0
*/
// Remove ... from excerpt and change the text
function change_excerpt_more()
{
function new_excerpt_more($more)
{
// Use .read-more to style the link
return '<span> <a href="' . get_permalink($post->ID) . '">[Weiterlesen...]</a></span>';
}
add_filter('excerpt_more', 'new_excerpt_more');
}
add_action('after_setup_theme', 'change_excerpt_more');
Damit werden die […] hinter dem Auszug entfernt und durch unseren eigenen
Text ersetzt. Das Ergebnis kann man hier auf meinem Blog betrachten.
