Neu Designvorlagen mit Dreamweaver erstellen

[TDS2018]

Guten Morgen,

ich arbeite mich in die Ebay- Designvorlagen ein. Unter https://guide.jtl-software.de/jtl-eazyauction/ebay-designvorlagen/designvorlagen-editor/ wird ein "erweiterter Dotliquid-Editor" beschrieben.
Mein Problem ist, daß im Fenster "Bearbeiten" mit dem HTML-Code keinerlei Funktionen sind, die mich an einen Editor erinnern würden, geschweige denn an einen "erweiterten". Jemand der jahrelang HTML programmiert hat, kommt damit vielleicht klar, aber ich brauche wenigstens ein Split-View mit Code und Liveview. Zumindest für den Anfang. Daher möchte ich zunächst einfache Designvorlagen in Dreamweaver erstellen. Bislang konnte ich sie testen, indem ich HTML und CSS mit Copy & Paste in die Wawi eingefügt und das Ergebnis im Vorschaufenster betrachtet habe.

Gibt es eine elegantere Lösung, wo man das Ergebnis bereits beim Erstellen der Vorlage im Dreamweaver sieht oder einen anderen Designer, der mit Dotliquid Variablen umgehen kann?

Welche Workarounds gibt es noch und wie machen es professionelle Anbieter von Ebay-Designvorlagen? Programmieren sie ein separates Programm, das mit ihrem Editor (welchem?) auf die SQL-Datenbank von JTL zugreift, um die Livenansicht zu bekommen?

*** Update 1
Ich habe zwischenzeitlich index.html, styles.css und die beiden Verzeichnisse gfx und WawiPictures aus dem von JTL in der Browservorschau temporären Verzeichnis (z.B. in file:///C:/Users/jan/AppData/Local/Temp/lkxaorg2.ity/) gewonnen und diese in DW eingefügt. Einziger Wermutstropfen ist, daß ich anschließend viele Dotliquid-Variablen zurückschreiben muß, denn in der index.html stehen Infos aus einem bestimmten Artikel.

*** Update 2
Ich habe gerade was gefunden, was mich begeistert hat. Die in den Beispielvorlagen aufgeführten CSS sind teils unübersichtlich (da bei der beispielsweise bearbeiteten JTL-Tyro ein Teil des Codes minimalisiert und in einer sehr langen Zeile ist) und wenn man als noch ungeübter Coder per Hand aufräumen will, ist das eine lange Arbeit (doch man lernt dabei). Unter https://html-css-js.com/css/editor/ ist ein Online CSS Code Editor, der den CSS Code von JTL per Knopdfruck aufräumt und dieser nach Zurückspielen in JTL auch funktioniert.

Aus:

.container,.container .row [class*=col-]{padding-left:17px;padding-right:17px }.border,.tab-content{border:1px solid #ddd }#content .gallery>div.item img,.fixed-center{-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%) }.default-space,.default-space-top{margin-top:20px }#content .tabs:after,#content

wird:

.container,.container .row [class*=col-]{
padding-left:17px;
padding-right:17px
}
.border,.tab-content{
border:1px solid #ddd
}
#content .gallery>div.item img,.fixed-center{
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%)
}
.default-space,.default-space-top{
margin-top:20px
}
#content .tabs:after,#content

Wo ich das alles geschrieben habe, wird mir noch klarer, daß ich einen Editor benötige, der alle diese Funktionen vereint UND auf die SQL-Datenbank von JTL zugreifen kann. Gibt es ihn?

*** Update 3
Auf meiner Suche bin ich auf das Plugin „JTL Theme-Editor“ gestoßen https://jtl-devguide.readthedocs.io/projects/jtl-shop/de/latest/shop_templates/theme_edit.html
So etwas suche ich für die Ebay-Themes.

 

[TDS2018]

*** Update 4

Ich habe das Open-Source-Tool Responsively installiert, das simultan eine Reihe von Bildschirmgrößen anzeigt (PC, Tablet, Smartphone). Das Tool ist hier zu finden https://responsively.app/
Nach Installation der App und der Browsererweiterung kann ich es aus JTL Designvorlagen bearbeiten unter Browser-Vorschau (Standardbrowser) aufrufen. Wenn ich dann im in JTL im HTML bzw. CSS etwas verändere, sehe ich im Fenster Responsively per Liveview die Änderung. Ich will mich nun damit etwas beschäftigen - vielleicht ist dies das richtige Tool.