Nein, ein Bild kann man nur mit einer "Codezeile" direkt in den Text einfügen und hier muss man das Bild extra auf den Server laden.

Also ist das Widget in der Vorschau irre führend, dort ist ein Bild drin. Schade

Hello Michael,
you can add an image to the block from here in order to achieve blocks such as those seen in the preview page below.

Online translation:

Hallo Michael,
Sie können von hier aus ein Bild zum Block hinzufügen, um Blöcke wie diejenigen zu erstellen, die auf der Vorschauseite unten zu sehen sind.

Hallo Eric,

was hast du für ein Widget?

Bei mir wird sowas gar nicht angezeigt siehe Bild

noch ein Bild

auch hier ist nichts mit Bild einfügen zu finden

Es gibt 2 Versionen:

• Neue Version: Accordion Text & FAQ
• Alte Version: Accordion Text/FQA

Ich habe die neue Version, da gibt es das Image-Feld.

Bei der alten Version muss wohl HTML-Code im Text-Feld genutzt werden.

Und wo bekommt man die neue Version her?

Die neue Version Accordion Text & FAQ gibt es im Marketplace, siehe

>> https://market.websitex5.com/de/objekte/3cfb4af5-aedd-43b3-ad77-1bb2392e5cd

Und das muss ich jetzt noch mal kaufen, ob wohl ich schon das "alte" habe?

Man hätte doch einfach ein Update über das alte Widget spielen können. Schade

Die Begründung für eine neue Version statt einem Update darf gerne Incomedia begründen.

.

Oder die Methode von Andreas verwenden, siehe

----- Auszug -----

Andreas S.

Moderator

Nein, ein Bild kann man nur mit einer "Codezeile" direkt in den Text einfügen und hier muss man das Bild extra auf den Server laden.

-------------------

2 Beispiele: HTML- und CSS-Code für Bilder (zum kopieren und anpassen):

A) Mit Rand um das Bild

<img src="bilder/landschaft.jpg" alt="Alternativer Text" style="width:100%; height:auto; border:1px solid #000;">

B) Ohne Rand um das Bild

<img src="bilder/landschaft.jpg" alt="Alternativer Text" style="width:100%; height:auto;">

Hier wäre das Bild landschaft.jpg ins Verzeichnis bilder hochzuladen.

Hello,
there were some major restructuring of the object's code, to also make use of some new features that were added in later versions of WebSite X5, and so a separate object was released rather than an update to the existing one, apologies for the inconvenience.

Online translation:

Hallo,
es gab umfangreiche Umstrukturierungen im Code des Objekts, um auch einige neue Funktionen zu nutzen, die in späteren Versionen von WebSite X5 hinzugefügt wurden.
Daher wurde ein separates Objekt veröffentlicht, anstatt ein Update des bestehenden bereitzustellen.
Wir entschuldigen uns für die Unannehmlichkeiten.

Ich wollte das Thema noch mal aufgreifen.

Ich meinte das eher so, aber ich glaube das geht nicht

https://mitkoforevents.com/octa-go/

Unten bei technische Verbesserungen, ist ein Accordeon und daneben ändern sich die Bilder je nach dem was man anklickt

...Sie können dies mit einem einfachen ZUSÄTZLICHEN Code von mir tun, wie Sie ihn bereits in der Vergangenheit verwendet haben...

.

ciao

.

Hallo KolAsim, kannst du mir den Code schicken?

... Ich mache das gerne, aber Sie müssen mir den Link zu Ihrer Seite mit Accordion schicken, die in etwa so aussieht: STAMP:

... also ein Akkordeon mit einem zugehörigen Bildobjekt, wobei ein generisches oder graues Bild als Platzhalter dient...
... Durch Klicken auf den jeweiligen Akkordeon-Titel wird das zugehörige Bild aus einer Liste geöffnet...
... Sobald Sie mir den Link geschickt haben, kann ich die IDs auswerten und meinen Code entsprechend anpassen...
... Geben Sie mir Bescheid, wenn Sie das getan haben. Ich melde mich dann wieder, prüfe es und gebe Ihnen Bescheid...

.

Tschüss, ciao

.

Mache ich, aber das geht erst, wenn alles komplett fertig ist oder?

Denn die Seite ist noch im Aufbau und da kann sich die Zelten und Spalten noch verschieben.

...zu Testzwecken können Sie vorübergehend eine versteckte Seite hinzufügen, die niemand ohne LIMK sehen kann, damit wir die Situation beurteilen können....

ciao

Ich habe das hochgeladen

https://regotent-zelte.de/test02/faltzelt-octa-go.html

In der Mitte ist das Widget. Die Bilder sollen sich je nach Accordeon ändern.

Darüber das Accordeon habe ich mal gestestet, wäre zumindest eine Alternative, falls das andere zu kompliziert ist

Dann habe ich noch ein Problem oder Fehler im Accordeon bei den Wandarten auf dieser Seite wie oben.

Die Register habe ich links und rechts die Bilder. Wenn ich diese zentriere, sind die in der Vorschau immer wieder links.

Nur mal so zur Info...wenn du ein Projekt in einen Unterordner hochladest als Test, dann musst du auch die URL der Website ändern auf den Unterordner!  https://regotent-zelte.de/test02

Gibt es hier schon eine Lösung?

... OK ... das ist meine Erfindung, du wirst sie selbst verstehen. Sie ist jetzt deiner TEST02/...-Seite gewidmet.

Du musst die Akkordeon-ID und die Bildkarten-ID ermitteln und in den beiden zugehörigen Anfangsvariablen speichern. Füge dann die Bilder, die zum Klicken auf die Akkordeonkarten gehören, der leicht erkennbaren Bildliste hinzu. Mehr musst du nicht tun. Mit einem Klick kannst du es direkt ausprobieren.

Ich habe hier natürlich Bilder von Pixabay verwendet. Tschüss! ... ciao...

<script>
/** -- controllo EXTRA apertura immagini x Accordion x WSx5 by KolAsim --**/
$(document).ready(function() {
const accordionK = "#pluginAppObj_129_1082_accordion_container"; // *** ======= ID oggetto Accordion;
const corniceImgK = "#imObjectImage_129_1083_container"; // *** ========= ID oggetto cornice contenitore immagine;
const imgDefaultK = "https://cdn.pixabay.com/photo/2023/12/13/17/47/christmas-tree-8447387_640.jpg"; // *** immagine default;
const imgK = [ // *** ==== lista immagini; tante quante sono le schede di Accordion;
"https://cdn.pixabay.com/photo/2025/11/05/20/57/monastery-9939590_1280.jpg",
"https://cdn.pixabay.com/photo/2025/01/27/20/18/wheat-9364066_640.jpg",
"https://cdn.pixabay.com/photo/2025/10/03/09/14/asters-9870320_640.jpg"
];
/** -- fK -- **/
function initAccordionK() { $(corniceImgK + " img").attr("src", imgDefaultK); $(accordionK + " .accordion_el:nth-child(1)").trigger("click"); $(accordionK + " > div").on("click", function() { const isSelected = $(this).hasClass("selected"); const index = $(this).attr("data-position"); $(corniceImgK + " img").attr("src", isSelected ? imgK[index] : imgDefaultK); }); } function waitForAccordionK(maxTimeMs = 5000, intervalMs = 500) { let elapsed = 0; const checkInterval = setInterval(function() { if ($(accordionK).length > 0 && $(accordionK).is(":visible")) { clearInterval(checkInterval); setTimeout(initAccordionK, 1000); } else if ((elapsed += intervalMs) >= maxTimeMs) { clearInterval(checkInterval); } }, intervalMs); } waitForAccordionK(); });
</script>

.............................

.

Super danke. So meinte ich das. 

Es ist zwar viel mehr Aufwand die Bilder auf den Server zu laden und dann die Links einzufügen, aber das geht schon. Besser wäre wenn es im Programm möglich wäre

...OK ...

… Sie können Ihre Bilder wie erwartet an das Projekt anhängen und „files“ als Standardordner in den Programmeinstellungen beibehalten...
...Vorausgesetzt, die Bilder heißen default.jpg, pippo.jpg, pluto.jpg und minnie.jpg ...
… passen Sie die Bildliste einfach mit den relativen Pfaden an den entsprechenden Stellen im bearbeitbaren Code an, wie hier gezeigt:

const imgDefaultK = "files/default.jpg"; // *** Standardbild;
const imgK = [ // *** ==== Bildliste; so viele wie es Akkordeonkarten gibt;
"files/pippo.jpg",
"files/pluto.jpg",
"files/minnie.jpg"
];

.................................

.

ciao

.