Accordion Text & faq - Bild anders platzierbar? 
Author: Elisabeth K.
Visited 244,
Followers 1,
Shared 0
Ich nutze das Objekt "Accordion Text & FAQ". Wenn ich dort ein Bild einfüge, dann landet es immer automatisch UNTER dem Text. Gibt es eine Möglichkeit, es oberhalb zu platzieren? Oder gar zwischen dem Text? Oberhalb wäre zumindest schon hilfreich.
Posted on the
Vielleicht haben die CSS-Experten einen CSS-Code, um das Bild automatisch zu verschieben.
Das wäre dann am Einfachsten, aber leider bin ich kein CSS-Experte.
Alternative - hier die Anleitung:
1) Mit dem IMG-Tag im Text an beliebiger Stelle ein Bild eingefügt werden, siehe Screenshot (1)
2) Dieses Bild mit dem FTP-Fenster von WebSite X5 z.B. ins Unterverzeichnis "bilder" hochladen.
FTP-Fenster - siehe auch Screenshot (3):
WebSite X5: 5 Export > Export der Wbsite ins Internet
Zielverzeichnis ___________________ [Ordner-Symbol] <-- Anklicken
3) Dann das Objekt "Accordion Text FAQ" im Raster markieren und oben auf "Code" klicken.
Hier in die leere 2. Zeile diesen Code einfügen:
img { max-width: 800px; max-height: 600px; height: auto; width: auto; }
Bei Bedarf die maximale Breite und Höhe für die Bilder anpassen, siehe Screenshot (2)
----- (1) -----
----- (2) -----
----- (3) -----
Anzuschauen ist die Umsetzung der Anleitung auf meiner Testseite, siehe
>> https://findelinks.de/123test-aufklappmenue-2/faq.html
Es ist das 3. Beispiel unten.
Bei den anderen Beispielen oben ist das Bild rechts neben dem Text.
Nachtrag:
Wenn die HTTPS-Bildadresse angegeben wird, dann ist das Bild schon in der Vorschau sichtbar.
----- Screenshot -----
Oder du gehst auf die Seite mit dem Objekt und markierst dieses und drückst oben auf "Code"!
Dann fügst du zwischen dem Selektor diesen Code ein.
.ac.is-active .ac-panel {
display: flex !important;
flex-direction: column-reverse !important;
}
So sollte es dann aussehen
@ Andreas S.: Danke für den CSS-Code - habe ihn auf meiner Testseite eingefügt.
Damit ist es jetzt einfacher als mit externen Bildern und IMG-Tag als HTML-Code.
Beim CSS-Code kommt es oft auf Kleinigkeiten an, ob es klappt oder nicht.
Author
Hallo Andreas, danke dafür. Leider zerhaut er mir dann die ganze Seite, wenn ich den Code in deisem element einfügr - Abstände sind weg und völlig andere elemente verschieben sich einfach oder werden falsch dargestellt. Wenn ich den Code dann wieder entferne ist alles wieder richtig.
Es fehlt die geschweifte Klammer } am Ende bei 6 -siehe
-----
Author
super, vielen Dank :-) wusste nicht dass die Klammer dann 2x erscheinen muss. Top
Eigentlich sollte es so wie in meinem Screenshot eingegeben werden!
Aber wenn es so auch funktioniert....