Kernattribut Text und Bilder

Ein Hintergrundbild, das dein Kunde ersetzen kann

fld-bg-image="Feldname"

Für einen Abschnitt oder ein Banner, dessen Bild als CSS-Hintergrund gesetzt ist, nicht als <img>.

Wo es hingehört

An den Block mit dem Hintergrund. Der Build ergänzt background-image in seinem style; Farben, Abstände und die übrigen Stile bleiben.

„Daten laden“ nimmt das Startbild aus dem Inline-Stil oder findet es in einem Webflow-Export über die Klasse des Blocks im CSS.

Das Feld erscheint im Adminbereich nur, wenn die Seite einen Gruppennamen hat: wp-fields-group auf ihrem <body>.

Markup index.html

<section class="hero" fld-bg-image="Hero background">
  <h1 fld-text="Hero title">Coffee for slow mornings</h1>
</section>

Im Adminbereich Pages → Home

Hero background window.jpg

Hero title Coffee for slow mornings

Auf der Website die Startseite

Hero background: window.jpg Coffee for slow mornings

Das Build-Protokoll ist der Tab „Logs“ deines Projekts auf themeforge.pro; die kostenlose Markup-Prüfung zeigt dieselben Hinweise.

So nicht

<img src="images/latte.jpg" alt="Latte" fld-bg-image="Photo">

An einem Bild setzt das Attribut einen Hintergrund dahinter, und das Bild selbst bleibt fest. Das Build-Protokoll nennt das falsche Element.

So geht’s

<img src="images/latte.jpg" alt="Latte" fld-image="Photo">

Ein <img> bekommt fld-image.

Dasselbe in den Website-Einstellungen

`fld-bg-image`	auf einer Seite oder in einem Beitrag
`opt-bg-image`	in den Website-Einstellungen, etwa ein Hintergrund für alle Seitenköpfe

Alternative Schreibweise

f_bg_image, o_bg_image funktioniert genauso: Der Build ergibt ein identisches Theme.

Wenn du so weit bist