WordPress: interne jQuery-Version über Google CDN im Footer laden

wordpress-jquery

Wer jQuery in WordPress verwenden will, integriert das Script häufig manuell im Header oder Footer der Seite. Das Script wird dazu heruntergeladen, in den Website-Ordner kopiert und von dort aus verknüpft. Alternativ wird es über ein Content Delivery Network (CDN) von Google & Co. geladen.
WordPress verfügt jedoch auch über eine eigene Version von jQuery, die genutzt werden kann. Diese Version wird auch von Plugins verwendet. Wenn ihr jQuery also manuell hinzufügt, kann es passieren, dass jQuery mehrfach geladen wird. Das dauert länger und kann zu erheblichen Konflikten mit Plugins führen.

Web Design mit Sass

Eine Einführung in moderne Stylesheets.

In unserem Shop kaufen
ePub, Mobi + PDF

Bei Amazon kaufen
Kindle-Version

Warum sollte man Scripte über ein externes CDN laden?

jQuery (und andere Scripte) über ein CDN zu laden hat mehrere Vorteile. Zum einen wird das Script über die Highspeed-Server von Google oder Microsoft ausgeliefert; diese Systeme sind ganz einfach schneller sind als der eigene Webspace. Darüber hinaus binden sehr viele Websites ihre Scripte über Google & Co ein. Die Wahrscheinlichkeit, dass sich jQuery bereits im Cache des Seitenbesuchers befindet ist daher groß. Der Einsatz eines CDN beschleunigt also für gewöhnlich eine Website.

Problemfall WordPress

Wer WordPress benutzt muss eine Entscheidung treffen. Entweder wird die interne Version von WordPress verwendet, die über den eigenen Server ausgeliefert wird und evtl. sogar veraltet ist. Oder es wird ein CDN verwendet, was zwar schneller ist, aber auch dazu führen kann, dass jQuery doppelt geladen wird und Kompatibilitätsprobleme verursacht.
Im Idealfall greift WordPress selbst auf ein CDN zurück. Dann wird immer die schnelle Version ausgeliefert und es kann auch keine Konflikte mit verschiedenen Versionen geben.

Mit folgenden Anpassungen ersetzt ihr die in WordPress integrierte Version von jQuery durch die von Google gehostete Version. Gleichzeitig bindet WordPress das Script im Footer der Website ein. Beachtet bitte, dass dann auch Plugins, die auf die interne jQuery-Version zugreifen, die "neue" Version laden.

jQuery über Googles CDN im Footer laden - functions.php anpassen

Öffnet die functions.php und fügt folgenden Code ein. Das Beispiel verwendet das CDN von Google – es können aber auch andere Quellen verwendet werden. Achtet auch darauf die korrekte jQuery-Version zu laden.

/* jQuery von WordPress deaktivieren und über Google im Footer laden */
if( !is_admin()){
    wp_deregister_script('jquery');
    wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"), false, '1.10.2', true);
    wp_enqueue_script('jquery');
}

Das war auch schon alles. Ab sofort nutzt euer Theme die externe jQuery Version. Wenn ihr das Thema weiter beleuchten könnt, freue ich mich über einen Kommentar.

Links zum Thema