Die Optimale Bildgröße dank wp_get_attachment_image

Dank der Funktion wp_get_attachment_image ist es nun möglich ohne viel Aufwand die perfekte Bildgröße im Template zu hinterlegen. Lädt man ein Bild mittels der WordPress-Mediathek im WP-Admin hoch und bindet es im Beitrag über den Editor ein, so wird automatisch das Bild mit den unterschiedlich angelegten Bildgrößen in den Beitrag geschrieben. 

Schaut man sich den Quelltext an, dann könnte das ungefähr so aussehen:

bildname

WordPress Image Sourceset mit PHP auslesen

Nun wollte ich an einer bestimmten Stelle im Template die Grafiken mit den unterschiedlichen srcset ausgeben lassen, sodass sich der Browser, je nach Größe des Bildschirms, die optimale Auflösung selbst sucht. Ich hätte mir natürlich mittels des var_dumps die einzelnen sizes mühsam raussuchen und die obere Zeile selbst zusammen bauen können, aber darauf hatte ich keine Lust. Dank der bereits von WordPress zur Verfügten Funktion wp_get_attachment_image(); geht es natürlich einfacher und vor allem schneller.

Nutze die Funktion wp_get_attachment_image();

wp_get_attachment_image();

Eigentlich braucht man nur die ID der Grafik aus der Mediathek. Aber man kann auch noch ein paar Anpassungen machen. Ein komplette Anleitung aller Parameter findest Du im WordPress Codex.

wp_get_attachment_image( $bild['id'], 'medium', '', array( "class" => "aligncenter",  "alt" => $bild['title'] ) )

In meinem Fall wollte ich das Bild in Medium ausgeben lassen. Der Rest sollte eigentlich selbsterklärend sein.

  • $bild[‚id‘] = ID des Bildes aus der Mediathek
  • medium = Größe des Bildes
  • class = Klassenname
  • alt = Alt Attribute

revilodesign oli

2 Kommentare

Schreibe ein Kommentar zu Die Optimale Bildgröße dank wp_get_attachment_image

  1. avatar samSam sagt:

    Hey Oli, netter Beitrag! Klappt die function auch für responsive? Also verschiedene Größen für verschiedene Devices?

    • avatar adminadmin sagt:

      Hey Sam,

      ja, da sich der Browser das Bild mit der optimalsten Bildgröße für die aktuelle Browserauflösung heraussucht. Daher ist dieses Funktion gerade für responsive gut geeignet und minimiert so unnötige Ladekapazitäten.

      Lg Oli

Schreibe einen Kommentar zu Sam Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Follow Me

doch mal auf Instagram