Wenn Sie WordPress-Sites für Ihre Kunden entwerfen, ist die Benutzerfreundlichkeit ein wichtiger Faktor, den Sie berücksichtigen müssen. Einige der Techniken, die zur Verbesserung der Benutzerfreundlichkeit (User Experience, UX) auf einer Website verwendet werden, sind jedoch möglicherweise nicht die besten Methoden für eine andere Website.

Unendliches Scrollen ist eine Taktik, die Entwickler und Designer verwenden, um Website-Besucher zu beschäftigen. Während einige behaupten, dass es der Benutzerfreundlichkeit von Websites schaden kann, gibt es viele Fälle, in denen es von Vorteil sein kann.

In diesem Beitrag erklären wir, was unendliches Scrollen ist und welche Arten von Websites davon profitieren können. Dann zeigen wir Ihnen drei Methoden, mit denen Sie diese Funktion in die Websites Ihrer Kunden integrieren können. Los geht’s!

Einführung in das Infinite Scrolling

Infinite Scrolling ist eine Webdesign-Technik, bei der automatisch neue Inhalte geladen werden, wenn ein Besucher das Ende der Seite erreicht. Das Ergebnis ist eine stetige, scheinbar endlose Zufuhr von Inhalten.

Populäre Beispiele für Websites, die unendliches Scrollen verwenden, sind soziale Netzwerke wie Facebook, Twitter und Pinterest. Sie können es auch auf Blogging- und Unterhaltungs-Websites wie Mashable und Buzzfeed sehen:

Es gibt viele Vorteile, die das unendliche Scrollen auf diesen Websites mit sich bringt. Am offensichtlichsten ist, dass es Zeit spart und Ihren Nutzern mehr Inhalte bietet, ohne dass sie auf eine Schaltfläche „Weiterlesen“ oder Paginierungslinks klicken müssen.

Da es weniger Ablenkungen gibt, kann die automatische Zuführung von Inhalten auch bedeuten, dass die Nutzer länger bleiben, was zu höheren Engagement-Raten führen kann. Außerdem ist diese Funktion mobilfreundlich.

Allerdings ist nicht jede Website für das unendliche Scrollen geeignet. Wenn Sie beispielsweise eine zielgerichtete Website wie einen E-Commerce-Shop haben, kann es für die Nutzer schwierig sein, das zu finden, was sie suchen. Es kann sich auch auf die Leistung der Website auswirken, wenn sie nicht richtig optimiert ist.

Wenn Sie hingegen eine Website mit einer linearen Struktur haben, kann es sehr vorteilhaft sein. Unendliches Scrollen kann besonders nützlich sein, um Geschichten zu erzählen, sei es durch lange Blogbeiträge oder visuelle Inhalte wie Bilder.

Wie man unendliches Scrollen zu Kundenwebsites hinzufügt (3 Methoden)

Wenn Sie Kundenwebsites erstellen, die inhaltsorientiert sind, können Sie eine Funktion zum unendlichen Scrollen in Betracht ziehen. Werfen wir einen Blick auf drei Methoden, die Sie dazu verwenden können.

Verwenden Sie ein Infinite Scroll Plugin

Eine der schnellsten und einfachsten Methoden, die Sie verwenden können, um den Websites Ihrer Kunden ein unendliches Scrolling hinzuzufügen, ist die Verwendung eines Plugins. Einige, wie z. B. Jetpack, enthalten Funktionen zur Implementierung dieses Designelements.

Es gibt nicht allzu viele eigenständige Plugins für unendliches Scrollen. Ein beliebtes Plugin, das wir empfehlen, ist Ajax Load More:

Dieses Plugin ist kostenlos und einfach zu verwenden, obwohl es einige Programmierkenntnisse erfordert. Es ermöglicht das Hinzufügen von unendlichem Scrollen für lazy loading posts, Seiten und Kommentare.

Nach der Installation und Aktivierung des Plugins können Sie die relevanten WordPress-Abfrageparameter basierend auf verschiedenen Inhaltstypen konfigurieren. Auf der Seite „Einstellungen“ können Sie einstellen und anpassen, wie sich Ajax Load More auf Ihren Kunden-Websites verhält. Zum Beispiel können Sie Ihr eigenes CSS hinzufügen:

Das Plugin enthält auch einen Shortcode-Builder, mit dem Sie Seiten und Beiträge aus Ihrem Content-Editor oder Ihren Vorlagendateien schnell ändern können. Eine weitere interessante Funktion des Plugins sind die Repeater-Vorlagen:

Sie können Ihre eigene Repeater-Vorlage erstellen und anpassen, wie HTML und PHP innerhalb des Shortcodes funktionieren. Sie können auch mehrere Instanzen des Ajax Load More Plugins in einem einzigen Beitrag, einer Seite oder einer Vorlage einbinden.

Das kostenlose Plugin bietet zahlreiche Funktionen für unendliches Scrollen, aber es gibt auch eine Premium-Version, die den Zugriff auf weitere Vorlagen ermöglicht. Um mehr zu erfahren, können Sie die Ajax Load More-Dokumentation und die Support-Seite besuchen.

Wählen Sie Themes mit integriertem Infinite Scroll

Wenn Sie Ihren Kunden-Websites kein weiteres Plugin hinzufügen möchten, ist das kein Problem. Sie können den gleichen Effekt erzielen, indem Sie ein Theme mit integriertem Infinite Scroll verwenden.

Natürlich ist dieser Weg für bestehende Websites nicht der praktischste. Die Änderung des Themas einer Website erfordert oft ein umfangreiches Rebranding. Das ist die Mühe nicht unbedingt wert, nur um Zugang zu einer Funktion für unendliches Scrollen zu erhalten – vor allem, wenn man bedenkt, dass man es auch mit anderen Methoden erreichen kann.

Es gibt eine ganze Reihe von WordPress-Themes, die diese Funktion enthalten. Sie können das WordPress-Theme-Verzeichnis durchsuchen und nach der Infinite-Scroll-Funktion suchen:

Während das Theme selbst kostenlos sein kann, sollten Sie bedenken, dass Sie möglicherweise auf die Premium-Version upgraden müssen, um Infinite Scroll zu nutzen. Es gibt jedoch auch einige, die diese Funktion kostenlos anbieten, wie z. B. Minimal Dark.

Wenn Sie ein Thema gefunden haben, das Ihnen gefällt und die Funktion enthält, laden Sie es herunter und installieren Sie es wie jedes andere Thema. Die meisten enthalten die Funktion im Theme Customizer.

Bei Minimal Dark finden Sie die Option zum unendlichen Scrollen beispielsweise unter Darstellung > Anpassen > Theme-Optionen > Paginierungsoptionen:

Wenn Sie erweiterte Funktionen wünschen, sollten Sie ein Premium-Theme in Betracht ziehen. Theme Forest bietet eine große Auswahl an Themes, die unendliches Scrollen ermöglichen.

Die Anweisungen zur Aktivierung und Verwendung der unendlichen Scroll-Funktion hängen von dem von Ihnen verwendeten Theme ab. Daher ist es am besten, die Dokumentation des Entwicklers zu Rate zu ziehen.

Manuelles Hinzufügen von Code zu Ihrer Website

Eine dritte Methode zur Implementierung des unendlichen Scrollens – und eine, die vielleicht bevorzugt wird, wenn Sie ein erfahrener Entwickler sind – ist das manuelle Hinzufügen von Code zu Ihrer Website. Diese Option gibt Ihnen mehr Kontrolle und macht die Installation eines zusätzlichen Plugins überflüssig.

Außerdem können Sie diesen Code auf Websites mit Themes verwenden, die nicht über eine integrierte Funktion für unendliches Scrollen verfügen. Der erste Schritt besteht darin, die Funktion über die Datei functions.php Ihres Themes zu aktivieren.

Fügen Sie dazu den folgenden Code in die Datei ein:

Nachdem dies erledigt ist, müssen Sie die Funktion Render Parameter einrichten. Dies ist der Teil des Codes, der sich mit dem Laden der Beiträge für das unendliche Scrollen in einer Schleife befasst.

Um dafür zu sorgen, dass die Beiträge kontinuierlich geladen werden, fügen Sie die Funktion mytheme_infite_scroll_init wie folgt in die Datei functions.php Ihres Themes ein:

function mytheme_infinite_scroll_render(){get_template_part( 'loop' );}

Nach dem Hinzufügen dieser beiden Codeschnipsel sollte alles funktionieren. Wenn es jedoch nicht funktioniert, müssen Sie möglicherweise das Thema der Website ändern. Ältere, veraltete Produkte unterstützen das unendliche Scrollen möglicherweise überhaupt nicht.

Schlussfolgerung

Unendliches Scrollen ist nicht für jeden geeignet. Es gibt jedoch einige Websites, wie z. B. Blogs und andere inhaltslastige Online-Publikationen, bei denen es für eine bessere UX sorgen und sogar das Engagement erhöhen kann.

In diesem Artikel haben wir drei Methoden besprochen, mit denen Sie Ihren Kunden-Websites unendliches Scrollen hinzufügen können:

1. Verwenden Sie ein Plugin für unendliches Scrollen.
2. Wählen Sie Themes mit integriertem unendlichen Scrollen.
3. Fügen Sie manuell Code zu Ihrer Website hinzu.