abbrechen
Suchergebnisse werden angezeigt für 
Stattdessen suchen nach 
Meintest du: 

Bild per "benutzerdefiniertem HTML" einfügen und positionieren

JohnJ
Forscher
67 1 22

Hallo zusammen,

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

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



0 Likes
Gabe
Shopify Staff
Shopify Staff
3520 347 810

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
67 1 22

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

 

0 Likes
JohnJ
Forscher
67 1 22

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

0 Likes
r8r
Shopify Expert
1157 124 375

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

Mario Rader [he] ★ If you want to achieve greatness, stop asking for permission. ★ Studio Mitte
• Meine Antwort war hilfreich? Hinterlass bitte ein Like.
• Meine Antwort hat Dein Problem behoben? Bitte akzeptiere sie als Lösung.
• Ich hab dir etwas erspart? Ich freue ich mich immer über eine kleine Aufmerksamkeit
• Ja, ich biete Shopify-Services & -Entwicklung und freue mich von Dir zu hören!
• Bitte teile einen Link zu der Seite, deren Problem Du in deinem Beitrag beschreibst!

• Yes, I provide Shopify-services & -development. Feel free to get in touch!
• Please share a link to the site, which you refer to in your problem description. This incredibly increases the chances of you receiving a useful answer!
• My answer was useful? Please leave a Like.
• My answer solved your issue? Please accept it as the solution.
• I saved you time or money? I'm always happy to receive a little thank you.
JohnJ
Forscher
67 1 22

@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.