WordPress Arouse Theme – interessant nicht nur für Blogger

von

am

|

geschätzte Lesezeit:

5 Minuten

Disclaimer: Dieser Beitrag ist älter als zwei Jahre. Es könnte also sein, dass auch sein Inhalt in Teilen bereits veraltet ist.

WordPress Arouse Theme, Startseite mit Slider und Boxen

Immer auf der Suche nach Themes, die sich gut anpassen lassen, stieß ich auf das WordPress Arouse Theme. Dabei verstehe ich unter gut anpassbar nicht zwangsläufig eine Fülle von Einstellungsoptionen im Rahmen des Customizers. Auch wenn Arouse hier durchaus was zu bieten hat: Für Start- oder Blogseite wartet das Theme mit einem Beitragsslider und/oder drei hervorgehobenen Beiträgen oder Seiten auf. Außerdem lässt es die Wahl zwischen zweispaltiger Grid- oder einer Listenansicht der Beiträge. Schließlich bringt es noch zwei Widgets mit. Das wirkt alles sehr ansprechend. Noch ansprechender wirkt aber, dass das Theme sauber gecodet ist. Wer die Twenty-irgendwas Themes kennt, kommt auch mit Arouse zurecht.

Slider und Boxen der hervorgehobenen Inhalte

Arouse bietet drei zusätzliche Seitentemplates, von denen zwei den Slider und/oder drei Boxen der hervorgehobenen Beiträge/Seiten ausgeben. Dabei stellt das Slider Template den Beitragsslider und/oder die Boxen dem eigentlichen Seiteninhalt voran, während das Template Featured Front Page zusätzlich zum Slider und/oder den Boxen statt des Seiteninhaltes alle Beiträge ausgibt.

Die Einstellungen für den Slider und die hervorgehobenen Inhalte finden im Design > Customizer statt. Dort legen Sie erst einmal fest, ob Sie beide oder nur eine der beiden Komponenten nutzen wollen. So oder so greifen beide Templates auf diese grundlegende Einstellung zu.

Wenn Sie den Slider nutzen wollen, zeigt dieser alle Beiträge einer von Ihnen zu wählenden Kategorie an. Zudem verlinkt er auf diese Beiträge. Sie könnten also eine Kategorie Angebote eigens für diesen Slider erstellen. Sofern Sie für Ihre Startseite dann eines der beiden genannten Templates wählen, erscheinen somit Ihre Angebote an prominenter Stelle.

Bei den hervorgehobenen Inhalten haben Sie hingegen die Wahl, ob Sie nun bestimmte Seiten oder bestimmte Beiträge mit ihrem jeweiligen Beitragsbild ausgeben wollen. Und bei den Beiträgen können Sie zudem entscheiden, ob es Beiträge einer bestimmten Kategorie sein sollen – oder jene, die sie als sticky („oben halten“) markiert haben. Wenn Sie hier zum Beispiel Ihre Leistungen hervorheben wollen, könnten Sie hier Beiträge der Kategorie Leistungen abrufen.

Doppelte Ausgabe der Slider- oder hervorgehobenen Beiträge vermeiden

Nun kann (und wird) es Ihnen passieren, dass die Beiträge der Kategorien Angebote und Leistungen noch einmal im Rahmen der Beitragslisten erscheinen. Die Blogseite ruft alle Beiträge ab, also eben auch jene, die eigentlich nur im Slider oder als hervorgehoben erscheinen sollten. Damit das nicht passiert, hilft ein bisschen CSS: Sie blenden die Kategorie für die Blogseite und für die Beitragsliste auf der Startseite einfach aus. Die folgende Definition können Sie im Zusätzlichen CSS des Themes hinterlegen:

.home .category-angebote, .home .category-leistungen, 
.blog .category-angebote, .blog .category-leistungen  
{display:none;}

Wenn Sie für Ihre Startseite das Slider Template nutzen und hier entsprechend keine Beitragsliste ausgeben, reicht es natürlich, die doppelte Anzeige für die.blog Seite zu verhindern.

Die volle Fensterbreite nutzen

Mit 1150px ist das WordPress Arouse Theme im boxed Design relativ schmal angelegt. Das ist grundsätzlich nicht schlecht. Ich persönlich mag es aber gerne ein bisschen breiter. Und das lässt sich leicht umsetzen und braucht dann auch keine weitere Anpassung für Mobilgeräte:

@media (min-width: 1200px) {
.arouse-boxed {
width: 100%;}
}

Wenn der Slider den Auszug anzeigen soll

Wenn das Ganze nun die vollen 100 Prozent des Browserfensters nutzt, hätte der Slider nun auch wahrlich Platz, um dort neben der Kategorie und dem Beitragstitel auch den Beitragsauszug zu zeigen.

Auch das lässt sich leicht bewerkstelligen, benötigt allerdings ein Child Theme. Denn nun reicht es nicht, ein bisschen CSS zu hinterlegen. Hier braucht es in der Datei slider.php ein kleines bisschen Code, der ohne Child Theme beim nächstes Update verschwinden würde.

Die slider.php befindet sich im Unterverzeichnis /template-parts des Themes. Unterverzeichnis und Datei müssten Sie sich also mit in Ihr Child Theme Verzeichnis kopieren. Und dann in der Datei folgenden Bereich modifizieren:

<div class="arouse-slider-details">
<?php arouse_category_list(); ?>
<a href="<?php the_permalink(); ?>" rel="bookmark"><h3 class="arouse-slider-title">
<?php the_title(); ?></h3></a>
<span class="divider"></span>
</div><!-- .arouse-slider-details -->

Hier ergänzen Sie nach dem schließenden Verweis (</a>) einfach den Aufruf des WordPress Auszugs:

<?php the_excerpt(); ?>

Somit funktioniert die Ausgabe im Slider genauso wie auf den Beitragslisten. Das heißt, Sie selbst können entscheiden, ob Sie lieber den More-tag setzen oder mit der Funktion Auszug arbeiten wollen. Siehe hierzu auch: WordPress Auszug: Wie funktioniert das WordPress Excerpt?

Beitragsnavigation in same category einrichten

Wenn ich mir neue Themes anschaue, ist das Navigieren innerhalb derselben Kategorie immer ein Kriterium für mich. Schließlich möchte ich, dass die Beitragsnavigation nicht ständig zwischen den vielleicht völlig unterschiedlichen Kategorien wechselt. Ein gutes Theme bietet diese Option entweder im Customizer an – oder ist so grundlegend gecodet, dass man ohne großes Kopfzerbrechen das nötige Codefragment einfach ergänzen kann. Beim WordPress Arouse Theme gilt Letzteres.

Auch hier braucht es natürlich ein Child Theme, damit die Änderung der single.php das nächste Update übersteht.

In der single.php finden Sie vor dem Aufruf der Kommentare die Beitragsnavigation. Die lautet wie folgt:

the_post_navigation( array(
'next_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Next Article', 'arouse' ) . '</span> ' .
'<span class="post-title">%title</span>',
'prev_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Previous Article', 'arouse' ) . '</span> ' .
'<span class="post-title">%title</span>',
) );

Damit die Navigation nur innerhalb der Kategorie des jeweiligen Beitrags funktioniert, ergänzen Sie vor den beiden schließenden Klammern in der letzten Zeile einfach

'in_same_term' => 'true',

Siehe hierzu auch: Was tun, wenn die WordPress Beitragsnavigation nicht ins Konzept passt?

WordPress Arouse Theme Blogseite, mit Arouse Widgets
Das Widget zeigt nur die Beiträge der Kategorie Zoo – mit Bild, Titel und Datum

Das WordPress Arouse Theme und sein Beitrags-Widget

Sehr schön finde ich auch das mitgelieferte Widget in Sachen neueste Beiträge. Im Gegensatz zum hauseigenen Neueste Beiträge Widget liefert es neben dem Titel auch das Beitragsbild und das Veröffentlichungsdatum aus. Dabei kann man auch die Kategorie festlegen. Also wäre es möglich, untereinander erst Ihre News auszugeben und dann vielleicht doch nochmal Ihre Angebote aufzulisten.

Ein Mini-Problem habe ich bei diesem Widget ausmachen können. Die Beitragsbilder sind hier mit einer Breite von 100px und einer Höhe von 80px festgelegt. Da passen dann Bilder im 16:9 Format, wie ich sie immer benutze, nicht hinein. Also die Höhe einfach auf auto setzen, dann klappt es auch mit anderen Seitenverhältnissen:

.ar-cat-thumb {
width: 100px;
height: auto; }

Fazit

Alles im allem macht das WordPress Arouse Theme, zu dem es auch eine Bezahlvariante mit reichlich zusätzlichen Funktionen gibt, einen sehr guten Eindruck auf mich. Dabei halte ich es vor allem auch für ein gutes Einsteiger Theme, mit dem man auch ohne große Anpassungen schnell arbeiten kann. Und wer dann doch Anpassungen vornehmen möchte, lernt hier die grundlegende WordPress Logik kennen.


Beitragsbilder: Britta Kretschmer

Schreibe einen Kommentar

Die im Rahmen der Kommentare angegebenen Daten werden von mir dauerhaft gespeichert. Cookies speichere ich nicht. Für weitere Informationen siehe bitte meine Datenschutzerklärung.

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