wordpresspagination

Pagination in WordPress erstellen und einbinden

Irgendwann sind zu viele Artikel auf einer Seite und eine Navigation muss her. Wie man eine sogenannte Pagination, also eine Seitennavigation, ins eigene WordPress Theme einbindet, lernst Du hier.

Video

Anzahl der Artikel pro Seite

Zunächst muss unter Einstellungen – Lesen – Blogseiten zeigen maximal eingestellt werden, wie viele Posts pro Seite ausgegeben werden sollen. Zum Ausprobieren kann man ruhig die Einstellung 1 wählen, um zu schauen, ob alles auch mit mehreren Artikeln funktioniert.

functions.php

Es gibt bereits unzählige Webseiten, die den Code für die functions.php anbieten, sodass es unwirtschaftlich wäre eine eigene Version zu entwicklen. Trotzdem wollte ich die Serie vollständig halten, und verweise deswegen auf eine externe Seite. Die beste Version, die ich finden konnte ist unter folgender Adresse zu erreichen: http://blog.kulturbanause.de/2012/10/pagination-in-wordpress (01.08.2014 – 17:29 Uhr)

Pagination ins Theme einbinden

Mit folgendem Code, der auch unter der obigen Adressen gefunden werden kann, lässt sich nun die Seitennavigation in die jeweiligen Templates einbinden. Jedes Template, dass Artikel zur Übersicht aufzeigt sollte eine Pagination eingebunden haben (bspw. index.php, category.php, tag.php, serach.php etc.)

<?php if (function_exists("pagination")) {pagination($additional_loop->max_num_pages); } ?>

CSS für Pagination

Da der momentan ausgegebene Code eine unformatierte HTML Liste ist, die noch recht entfernt von einer benutzerfreundlichen Seitennavigation bzw. Pagination ist, fügen wir ein wenig CSS hinzu, damit das ganze ordentlich ausgegeben wird.

.pagination {
	margin: 0 0 20px 0;
	text-align: right;
}

.pagination li {
	list-style-type: none;
	display: inline;
}

.pagination li a, .pagination .current {
	padding: 5px 10px;
	margin: 0 2px;
	background: #f5f5f5;
	color: #000;
	border: 1px solid #ccc;
}

.pagination .current,
.pagination li a:hover {
	background: #000;
	border: 1px solid #000;
	color: #fff;
	-webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: linear;
	-moz-transition-duration: 0.2s;
    -moz-transition-timing-function: linear;
	-o-transition-duration: 0.2s;
    -o-transition-timing-function: linear;
	transition-duration: 0.2s;
    timing-function: linear;
}

Wer sich näher für das Theme Pagination interessiert, kann ja mal beim WordPress Codex vorbei schauen.

Über den Autor:

Mein Name ist Fabian Geier, Gründer von SourceBlogging, Läufer und WordPress-Enthusiast. Du findest mich vor allen Dingen auf meiner Webseite.