Adaptive Images in WordPress

Adaptive Images. Die Lösung wurde von Matt Wilcox entwickelt. Sie dient dazu, die Dateigröße von Bilder auf responsive Webseiten zu verringern. Durch eine PHP- und Javascript-Lösung werden verschiedene kleiner Bildformate eines Bildes automatisch erstellt. Diese, in Dateigröße und Format reduzierten Bilder, werden dann verwendet, wenn ein Benutzer die Webseite auf seinem Smartphone oder Tablet aufruft. Die großen Bilder der „richtigen“ Homepage werden gar nicht erst geladen und belasten das Datenvolumen nicht unnötig.

Die Implementierung ist ganz einfach, wenn man diese Schritte befolgt:

    1.  Letzte Version von Adaptive Images downloaden. Diese bekommt ihr auf www.adaptive-images.com.
    2. Die Datei adaptive-images.php in euer WordPress-Rootverzeichnis kopieren. Das Verzeichnis, in dem auch die config.php liegt.
    3. Diese Zeilen in eure .htaccess einfügen. Dies dient dazu, dass  bestimmte Ordner von Adaptive Images ausgeschlossen werden. Zusätzlich wird festgelegt, welche Dateitypen betroffen sind. Die Ordner und Dateien könnt ihr natürlich beliebig euren Wünschen anpassen.
    4. Bearbeitet die $resolutions Variable in der adaptive-images.php. Hier müsst ihr genau die Bruchpunkte eintragen, an denen euer Theme im Responsive umbricht. Zum Beispiel 1280,1024,960,768,600,460,400,320.Die $cache_path variable bearbeiten. Fügt die Pfad des Ordners hinzu, wo die reduzierten Bilder gespeichert werden sollen. Zum Beispiel wp-content/uploads/adaptive/ai-cache. Natürlich muss dieser Ordner auch vorhanden sein.
    5. Nun fügt ihr diesen Javascript Befehl direkt als ersten Befehl unter

    Nun ist die Einrichtung schon fertig. Wer möchte, kann noch eine Regel zu seiner robots.txt hinzufügen, damit der Adaptive Images Ordner nicht gescannt wird.

    Disallow: /wp-content/uploads/adaptive

    Hinterlasse einen Kommentar

    *

    1 comment

    1. Pingback: Responsive Webdesign – Tipps und was es zu beachten gibt – Teil 1 › shortcodes - Das Blog für WordPress-Entwickler

    Nächster ArtikelWordpress feiert den 11. Geburtstag