Zuletzt aktualisiert am 19. Juli 2021.
Für die verschiedensten Anwendungen von Cookiebannern über google Analytics bis hin zu Werbeanzeigen müssen Code-Snippets in den Header oder Footer einer Webseite eingefügt werden. Bei den meisten WordPress-Themes ist das kein Problem, hier kann man z.B. einfach ein Widget in den Headerbereich oder Footerbereich setzen und den Code dort einfügen.
Aber was ist, wenn das verwendete Theme, keine Widgets in diesen Bereichen unterstützt? Auch dann gibt es Lösungen.
Wieso muss man überhaupt Code-Snippets einbauen?
Viele Dienste, insbesondere von Drittanbietern, funktionieren nur über das Einbinden von Code Snippets. Weit verbreitete Vertreter sin z.B.:
- Consent Managament-Systeme (“Cookiebanner”)
- Google Analytics
- Google Adsense
- Google Tag-Manager
- Facebook-Pixel
- usw.
Achtung: Das Einbinden von Code Snippets ist ein potentielles Sicherheitsrisiko. Der eingebettete Code wird auf deiner Webseite bzw. dem Rechner deiner Besucher ausgeführt und kann eigenständig weiteren Code/Inhalt nachladen. Daher solltest du nur Code aus vertraulichen Quellen einbinden.
Ich zeige dir, wie du besonders einfach Code im Header oder Footer einbinden kannst.
Variante 1: Per Widget im Header oder Footerbereich
Wenn dein Theme Widgets im Header- bzw. Footerbereich unterstützt: Bingo!
In diesem Fall kannst du einfach ein neues Widget vom Typ “HTML-Code” erstellen und hier dein entsprechendes Snippet einfügen.
Variante 2: Per Plugin “Insert Headers and Footers”
![](https://addictedtocode.de/wp-content/uploads/sites/14/2021/07/Bildschirmfoto-2021-07-13-um-11.08.11.png)
Natürlich gibt es eine Reihe weiterer Plugins, die Code-Snippets im Header oder Footer einbinden können, hier handelt es sich aber um ein weit verbreitetes und etabliertes Plugin.
Variante 2a: Wenn kein Widget vorhanden ist und du kein Plugin installieren willst
Dann kannst du deine Snippets auch über die functions.php (Achtung, nicht bei Multisite-Umgebungen!) deines Themes einbinden.
TL;DR: Was sollte in den Footer, was in den Header?
Skript/Snippet | Empfohlene Position |
Consent-Management-Systeme | Header(!) |
Google Analytics | Header, Footer funktioniert aber auch problemlos. |
Google Adsense | Footer |
Andere Werbeskripte | Footer |
Google Tag Manager | Header |
Facebook Pixel | Footer |
Wieso empfehle ich bei vielen Pixeln/Snippets den Einbau im Footer?
Aus Geschwindigkeitsgründen. Viele der Snippets sorgen sonst für sog. “Render-Blocking-Events”. das bedeutet, die Seite wird erst dann weiter geladen und vollständig angezeigt, wenn alle Snippets vollständig geladen sind. Das sorgt für längere Ladezeiten, die Nutzer verärgern und für negativen Impact auf die eigenen Rankings sorgen können.
Schreibe eine Antwort