FROM CACHE - de_header

Bild per "benutzerdefiniertem HTML" einfügen und positionieren

JohnJ
Forscher
68 1 24

Hallo zusammen,

habe eine Frage an die, die etwas firm in Sachen HTML sind. (bitte nicht lachen 😄 )

JohnJ_2-1613723020506.png
Ich würde gerne ein Bild mittels benutzerdefiniertem HTML in der Mitte & unten im Segment platzieren. In der Mitte (centern) bekomme ich noch hin, aber nicht es unten zu platzieren. Kann mir jemand sagen, wie der Code aussehen müsste? Leider hat mich selbst Google nicht erhellen können.
Vielen Dank!

JohnJ_3-1613723236627.png

So sieht es aktuell aus:

<center><div class="flex">
<img src="https://url.meines.bildes" alt="">
</div></center>

Klappt übrigens auch nicht über die Auswahl

JohnJ_0-1613721439063.png



5 ANTWORTEN 5
Gabe
Shopify Staff
Shopify Staff
7536 1204 1962

Hey John! @JohnJ 

Mit HTML ist nicht zu spassen oder lachen haha : )

Es ist wie ein ungehorsames Kind - es macht nie so richtig was man haben will oder gibt ein "WYSIWYG". In deinem Fall ist es der Abschnitt Benutzerdefiniertes HTML, ist das richtig?

Hier ist es so das man das Bild nicht so leicht platzieren kann wie man es haben will da das ein Section ist und hier arbeitet dein custom html Code innerhalb bestimmte Parameter und Grids, wie z.B. wenn man die Elemente vergrößert oder verkleinert werden sie rumgerutscht innerhalb des Grids.

Frage: was passiert wenn du die Containerbreite änderst? Geht dann das Bild nach unten? Das habe ich jetzt in meinem eigenen Testshop getestet und es ging nach unten sobald ich die Containerbreite reduziert habe.

 

<div style="text-align:center;"><h2>Formatiere deinen Text mit HTML, damit er leichter lesbar ist.</h2>Mit diesem Text kannst du deine Kunden über deine Marke informieren.</div>
<center><div class="flex">
<img src="https://cdn.shopify.com/s/files/1/0002/2783/5906/files/grun.gif?v=1612947019" alt="">
</div></center>

 

Formatiere deinen Text mit HTML, damit er leichter lesbar ist.

Mit diesem Text kannst du deine Kunden über deine Marke informieren.
 

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

JohnJ
Forscher
68 1 24

Hallo Gabe,

vielen Dank für deine Antwort.
Ja, es geht um Benutzerdefiniertes HTML

Wenn ich die Containerbreite reduziere, wird das Bild kleiner und verschiebt sich nach links.
Ich habe bereits mit den vorhandenen Möglichkeiten (siehe Bild unten) rumgespielt, leider erfolglos.
Daher denke ich das es irgendwie über HTML zu machen sein sollte. Habe etwas von "allign: bottom;" und "vertical-align: bottom;" gefunden. Wusste aber nicht wie ich das in das vorhandene HTML einbauen soll.

JohnJ_0-1613735693603.png

 

JohnJ
Forscher
68 1 24

Hat irgendwer sonst eine Ahnung wie man das machen könnte? Würde mich freuen! Danke

r8r
Shopify Expert
2350 305 834

Hi @JohnJ 

für mich hört sich das mehr nach einer CSS-Frage an. Kannst du eventuell eine Seite mit entsprechendem Beispiel teilen? Eine generische Antwort ist seriös nicht möglich, weil das wirklich stark davon abhängt, wie das Theme im speziellen konfiguriert ist.

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
JohnJ
Forscher
68 1 24

@r8r 
Hallo Mario,

danke für deine Rückmeldung. Du hast recht. Es musste per CSS angepasst werden. Zudem noch unterschiedlich für Mobile und Desktop.
Hab es machen lassen und kann daher hier auch leider keine Angabe machen was genau es angepasst werden musste.
Aber das Thema kann als erledigt betrachtet werden.