Lesefortschritt:

Automatisches Lazy Loading von Bildern aktivieren

15. Januar 2025 | functions.php, Mediathek, Word­Press

Trick # 421 | Dieser Beitrag beinhaltet 293 Wörter. – Geschätzte Lesezeit: ca. 2 Minuten.

Lazy Loading ist eine Technik, bei der Bilder und andere Ressourcen nur dann geladen werden, wenn sie im sichtbaren Bereich des Users erscheinen – das verbessert die Ladezeiten. Word­Press hat das Feature seit der Version 5.5 eigentlich standardmässig eingebaut. Ab und an ist aber das Lazy Loading auch deaktiviert. Mit unserem heutigen Beitrag können Sie dann eingreifen.

Um den Code in Ihre Word­Press-Website zu integrieren, muss das Snippet in die Datei functions.php Ihres aktiven Themes. Die Datei finden Sie im Backend unter Design/Theme-Datei-Editor:

// Automatische Lazy-Loading-Bilder
function add_lazy_loading($content) {
    if (is_singular()) {
        $content = str_replace('<img ', '<img loading="lazy" ', $content);
    }
    return $content;
}
add_filter('the_content', 'add_lazy_loading');

Das Code-Snippet ergänzt die HTML-Ausgabe von Bildern in Word­Press um das entsprechende loading-Attribut. Damit wird der Browser angewiesen, die Bilder erst dann zu laden, wenn sie benötigt werden.

Werbung

Bedingte Silbentrennung in HTML – so geht’s

Jedes Sonderzeichen, jeder Umlaut kann in HTML mit der Tastatur erstellt werden - oder aber mit der entsprechenden HTML-Entity. Aus &auml; wird so ein ä, &permil; ergibt ‰ und &copy; gibt das © aus. Mein Favorit ist und bleibt aber ...

Werbung

 

Pin It on Pinterest

Share This