WordPress-Tipp: Style deine Seitennavi mit dem WP-PageNavi Plugin

Ein sehr beliebtes WordPress-Plugins ist das WP Page-Navi Plugin. Mit Hilfe des Plugins kannst du eine kom­ple­xere Seitennavigation für deinen WordPress-Blog ein­richten. Da ich mir am Wochenende ein biss­chen Zeit genommen habe, unsere Seitennavigation zu stylen, möchte ich dir das prak­ti­sche Plugin und seine Funktionen heute kurz vor­stellen.

Seitennavi mit dem WP-PageNavi Plugin

Die neue Seitennavigation auf dem Elmastudio-Blog.

Du kannst dir das Plugin direkt bei wordpress.org oder von der Plugin-Webseite her­un­ter­laden, und wie gewohnt installieren.

Die Funktionen deiner Seitennavi einstellen

Am besten nimmst du zur Einrichtung des Plugins die sehr hilf­reiche Readme-Anleitung zur Hand.

Du musst fol­genden Codeschnipsel in deine footer.php ein­fügen (an der Stelle, an der du deine Seitennavigation ein­setzen möchtest).

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

Jetzt fin­dest du im Adminbereich deines Blogs unter »Einstellungen« die PageNavi-Optionen. Hier kannst du bestimmen, wel­cher Text in den Navi-Buttons ange­zeigt werden soll, und wie viele Seitenzahlen ange­zeigt werden.

Seitennavi mit dem WP-PageNavi Plugin

Die pagenavi-css.css stylen

Anschließend kannst du das Aussehen deiner Seitennavigation noch mit CSS stylen. Dazu soll­test du die Datei pagenavi-css.css kopieren, und mit dem glei­chen Namen in deinen eigenen Theme-Ordner abspei­chern. So ver­mei­dest du bei einem Plugin Update, das deine ange­passten Styles ver­loren gehen. Die pagenavi-css.css in deinem Theme-Ordner kannst du jetzt nach Belieben anpassen.

Ich finde das Plugin sehr viel prak­ti­scher, als das stan­dard­mäßig inte­grierte »Neuere Beiträge, Ältere Beiträge«. Wie gefällt dir das WP-PageNavi Plugin? Kennst du ähnliche Plugins zur ver­bes­serten Seitennavigation in WordPress? Schreib mir doch einen Kommentar, ich freue mich über deine Tipps!

12 Kommentare

  1. Barbara

    Hmmm, dieses Plugin sieht inter­es­sant aus. Muss ich mir gleich merken, viel­leicht kann ich es ja bei meiner neuen Website ein­setzen (für den Fall, dass ich irgend­wann wirk­lich Zeit dafür finde ;) Vielen Dank für den Tipp!

  2. Sebastian

    Habe mir das Plugin ange­schaut und ich finde es super. Nur, ich habe noch »ältere« und »neuere« Einträge zu stehen. Vielleicht kannst Du mir ja helfen.

  4. Ellen

    @Sebastian: Vielen Dank für deinen Kommentar :-) Freut mich das dir der Tipp gefällt. Hab grad auch noch mal auf deinem Blog geschaut, sieht jetzt alles super aus :-)

    Viele Grüße
    Ellen

  5. Sebastian

    mh :) ich habe es end­lich auch geschafft, die pagenavi so ein­zu­bauen, dass es in der Archivansicht auch so aus­schaut, wie auf der Startseite.

    Wünsche ein­fachmal näch­träg­lich ein gesundes neues Jahr.
    :o)

  6. ingo

    Hallo Ellen,
    leider weiß ich nicht wo ich den schnipsel ein­bauen soll?
    Du musst fol­genden Codeschnipsel in deine footer.php ein­fügen (an der Stelle, an der du deine Seitennavigation ein­setzen möch­test).
    könn­test du dies etwas genauer erklären?
    lieben gruß ingo

  7. Dominik

    Hallo Ellen

    Bin grad eben auf das Page-Navi-Plugin gestossen und habe es in mein Yoko ein­ge­baut. Der Hinweis »ältere Artikel« muss ja jetzt aber weg. Wie kriege ich das hin? Ich bin froh um einen Hinweis. Schön wäre es auch, die Abstände nach oben und gegen unten ein biss­chen ver­rin­gern zu können.
    Gruss aus der Schweiz und herz­li­chen Dank, Dominik

  9. Manuela

    Vielen Dank für die tolle Erklärung des Plugins und zum Einbau. Ich hab es auch auf Anhieb hin­ge­kriegt.
    Nur habe ich jetzt leider auch noch die alten Hinweise »ältere Beiträge« - »neuere Beiträge« stehen. Ich habe gesehen, dass das auch schon in anderen Kommentaren erwähnt wurde, nur leider steht nir­gends wie man das weg bekommt.
    Es wäre auch schön, wenn man die Pagenavi etwas mit­tiger setzen könnte.
    Leider habe ich von php keine Ahnung und bin für jede Hilfe dankbar.

    Grüße

    Manuela

    • Ellen

      Hallo Manuela,

      du müss­test in deinen Theme-Dateien (je nach Theme unter­schied­lich z.B. index.php, archive.php, category.php, page.php) nach fol­gendem Code schauen und diesen dort löschen:

      <?php twentyeleven_content_nav( 'nav-below' ); ?>

      Dies ist der Code im TwentyEleven Theme. In anderen Themes sieht der Code viel­leicht even­tuell eher so aus:

      <div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">&larr;</span> Older posts') ); ?></div>
<div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">&rarr;</span>') ); ?></div>

      Hoffe so klappt es mit dem PageNavi-Plugin.

      Viele Grüße,
      Ellen

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.

*


Top