Ein Bild, das dein Kunde ersetzen kann
fld-image="Feldname" Ein Bildfeld im Adminbereich: Dein Kunde wählt ein Bild aus der Mediathek, und es erscheint anstelle des Bildes aus dem Design.
Wo es hingehört
Direkt an das <img>. Der Build ersetzt sein src durch das Feld und entfernt srcset und sizes, damit der Browser das Bild aus dem Adminbereich zeigt und keine alte Kopie.
„Daten laden“ findet das Bild in der Mediathek anhand seines Dateinamens oder lädt es aus dem Theme hoch.
Das Feld erscheint im Adminbereich nur, wenn die Seite einen Gruppennamen hat: wp-fields-group auf ihrem <body>.
Beispiel: das Foto im Hero
<img class="hero__img" src="images/latte.jpg"
srcset="images/latte-p-500.jpg 500w" sizes="50vw"
alt="Latte art" fld-image="Hero photo">Worauf es ankommt
- Nur an
<img>. Für ein Hintergrundbild eines Blocks nimm fld-bg-image. altundclassbleiben so, wie sie im Markup stehen. In einer Listenzeile nimmt jedes Bild seinen eigenenaltaus der Mediathek.- WordPress nimmt keine SVG-Dateien in die Mediathek auf: Ein an ein Feld gebundenes Bild muss PNG, JPG oder WebP sein.
Typische Fehler
Das Build-Protokoll ist der Tab „Logs“ deines Projekts auf themeforge.pro; die kostenlose Markup-Prüfung zeigt dieselben Hinweise.
<div class="hero" fld-image="Hero photo"></div>An einem Block gibt das Attribut nichts aus; das Build-Protokoll nennt das falsche Element.
<div class="hero" fld-bg-image="Hero photo"></div>Ein Hintergrundbild eines Blocks ist ein Fall für fld-bg-image.
Dasselbe in den Website-Einstellungen oder bei einer Kategorie
fld-image | auf einer Seite oder in einem Beitrag |
|---|---|
opt-image | in den Website-Einstellungen, etwa ein Logo |
tax-image | bei einer Kategorie oder einem Schlagwort, etwa ein Kategoriebild |
Alternative Schreibweise
f_image, o_image, t_image funktioniert genauso: Der Build ergibt ein identisches Theme.