SmoothScroll für Wordpress
Seit dem neusten Update hier auf FastWP bekomme ich immer wieder E-Mails und Kommentare, in denen Besucher mich fragen, wie sich das weiche Scrollen in Wordpress umsetzten lässt. Tatsächlich gibt es dafür viele Methoden und eine hatte ich euch sogar bereits vorgestellt. Damals war meine Empfehlung WP-Nicescroll, ein aufgeblähtes jQuery Plugin, welches aus Performance-Sicht allerdings echter Alptraum war. Außerdem war das Scrollen fast schon zu weich bzw. ruckelte es auf vielen Plattformen und lief einfach schlecht. Inzwischen habe ich aber ein anderes, sehr minimales Script entdeckt, welches weiches Scrollen in Wordpress ermöglicht, ganz ohne abnorme Einbußen in der Performance. Selbiges ist auch hier auf der Website im Einsatz, läuft ohne Probleme, ohne viel Ressourcen zu verschwenden, ohne viel Aufwand. Wie das geht, möchte ich euch nun genauer erklären.
Weiches Scrollen in Wordpress (Ohne Plugin)
Um genau zu sein handelt es sich um ein Script mit dem Namen SmoothScroll.js. Das entdeckte ich eines Tages bei GitHub und baute es sofort ein. Ich war begeistert von der Performance, denn bislang kannte ich nur Lösungen die ruckelten oder unangenehme Nebenwirkungen mitbrachten. SmoothScroll dagegen ist minimalistisch, braucht nicht viel Platz, ist schnell geladen, kein großer Aufwand und damit ein echter Geheimtipp, vor allem weil das Script allgemein nicht so bekannt ist.
1. Zunächst einmal ladet euch eine Kopie von SmoothScroll.js herunter. Dafür besucht ihr einfach die Seite auf GitHub und klickt oben rechts auf “view raw”. Den Inhalt kopiert ihr nun in einen Editor und speichert das Script als SmoothScroll.js auf eurem Rechner ab.
2. Nun müsst ihr das Ganze auf euren Webspace bzw. Server hochladen. Bei Wordpress kommt das ganze direkt in den Ordner des aktuell verwendeten Themes.
3. Jetzt geht ihr in das Admin von Wordpress, klickt auf “Design -> Editor” und wählt dort die “Kopfzeile” bzw. die “Header.php” aus.
4. Fügt nun folgendes in den Head ein, um das Script aus eurem Theme-Ordner zu laden:
<script src="<?php bloginfo('template_url'); ?>/SmoothScroll.js"></script>
5. Fertig. Mehr ist nicht notwendig. Ab sofort wird eure Website weich und flüssig gescrollt. So einfach ist das und dabei ist das Script nicht einmal 15 Kilobyte groß.
Performantes Script
SmoothScroll ist für mich ein seltenes Stück Gold. Ein Diamant, den es im Internet erst einmal zu finden gilt. Ich liebe das Script, weil es weiches Scrollen ohne viel Nachteile ermöglicht. Dabei ist es genau richtig konfiguriert, sodass der Effekt weich, schnell, aber nie zu langsam, ruckelnd, oder gar störend in Erscheinung tritt. SmoothScroll ist also ein echter Mehrwert und darf, trotz eigentlicher Unnötigkeit, durchaus in Wordpress integriert werden. Ich konnte jedenfalls nicht widerstehen, denn für mich ist das Script einfach etwas ganz Besonderes. Ein sehr performantes Stück Javascript, um weiches Scrollen ganz ohne Plugin oder unnötigen Ballast zu realisieren. Ich hoffe ihr seht das ähnlich und ich konnte dem ein oder anderen helfen. Eure Meinung erwarte ich in den Kommentaren.
