Ich bin ja jetzt seit 2 Tagen an der Umsetzung eines ersten Shopware-Designs und sehe eigentlich Shopware zum ersten mal richtig von der funktionellen (Anwender)-Seite, bisher habe ich ja mehr in die Innereien geschaut… Und bin wieder richtig begeistert! Tolle Funktionalität, sauber und spektakulär implementiert, [b]fast/b perfekt. Wenn dieses verdammte Layouting-Problem nicht wäre… Wir halten uns im Moment ziemlich an das Standard-3-Spalten-Layout, weil Änderungen daran doch recht aufwändig wären. Aber ich bin ja immer noch guter Hoffnung, dass das [color=red]spätestens [/color]mit Version 4 (“Drag-and-Drop”-Plazierung von Template-Elementen) endgültig gegessen ist. Zum Thema ““Drag-and-Drop”-Plazierung von Template-Elementen”: Um nicht Leute wie uns dadurch wieder zu Backend-Orgien zu “verdonnern”, wäre es [b]außerordentlich/b wünschenswert, wenn man diese Plazierung der Template-Elemente alternativ auch in einer Konfigurationsdatei festlegen könnte.
Hey, danke für das Lob. Sobald wir die organisatorischen Tasks abgeschlossen haben, an denen wir im Moment so arbeiten (Public Bug-Tracker, Public SVN usw.), werde ich mal probieren deine Ideen zur Template-Basis in einem Proof-of-concept zusammenzufassen und das dann ins Wiki stellen… Dann können wir da ja ein wenig sammeln und ich kann das vernünftig intern koordinieren und prüfen, wann wir was wie wo deployen können, okay?
[quote=“Stefan Hamann”]Hey, danke für das Lob. Sobald wir die organisatorischen Tasks abgeschlossen haben, an denen wir im Moment so arbeiten (Public Bug-Tracker, Public SVN usw.), werde ich mal probieren deine Ideen zur Template-Basis in einem Proof-of-concept zusammenzufassen und das dann ins Wiki stellen… Dann können wir da ja ein wenig sammeln und ich kann das vernünftig intern koordinieren und prüfen, wann wir was wie wo deployen können, okay? ;)[/quote] Okay!
[/code] eingefügt [code] {* Insert target for right boxes *}
[/code] 2. Meine Template-Analyse hat ergeben, dass Shopware insgesamt folgende „Boxen“ in der rechten Spalte verwaltet: (Schon mit der von mir verwendeten Terminologie bezeichnet.) box\_CAMPAIGNS\_RIGHT\_TOP box\_MANUFACTURERS box\_TOPSELLER box\_CAMPAIGNS\_RIGHT\_MIDDLE box\_ACCOUNT box\_FILTER box\_BLOG\_FILTER box\_BLOG\_SUBSCRIBE box\_REGISTER\_ADVANTAGES box\_CAMPAIGNS\_RIGHT\_BOTTOM
Diese Boxen müssen nun adressierbar gemacht werden, wozu in den Template-Dateien zusätzlicher HTML-Markup eingefügt wird. Beispiel „Topseller“-Box auf der Startseite: In „frontend\home\right.tpl“ wird die standardmäßig wie folgt eingebunden: {\* Topseller \*} {block name='frontend\_home\_right\_topseller'} {include file='frontend/plugins/index/topseller.tpl'} {/block}
Für meinen beschriebenen Bedarf wurde das geändert zu: [code] {* Topseller *} {block name=‚frontend_home_right_topseller‘}
{include file=‚frontend/plugins/index/topseller.tpl‘}
{/block} [/code] (Nicht aller zusätzlicher Markup ist notwendig, um diese Box nur adressierbar zu machen, dazu würde
ausreichen… Das weitere Markup brauche ich für zusätzliche Styling Zwecke… (Wozu, kann man in dem später gezeigten Bild sehen.)) Auf jeden Fall habe ich jetzt erreicht, dass die „Topseller“-Box der rechten Spalte über die ID „box_TOPSELLER“ für Javascript adressierbar ist. Das muss dann analog für alle identifizierten „Boxen“ durchgeführt werden… 3. Das notwendige jQuery-Programm ist erschreckend simpel, und wird in „frontend\index\header.tpl“ eingebaut: [code] $(document).ready(function() { var box_indexes=new Array( ‚#box_CAMPAIGNS_RIGHT_TOP‘, ‚#box_MANUFACTURERS‘, ‚#box_TOPSELLER‘, ‚#box_CAMPAIGNS_RIGHT_MIDDLE‘, ‚#box_ACCOUNT‘, ‚#box_FILTER‘, ‚#box_BLOG_FILTER‘, ‚#box_BLOG_SUBSCRIBE‘, ‚#box_REGISTER_ADVANTAGES‘, ‚#box_CAMPAIGNS_RIGHT_BOTTOM‘); var boxes=box_indexes.length, i, box, box_index, left_box_insert_area=$(‚#left_box_insert_area‘); for (i=0;i
Gefällt mir sehr gut Ich hab es zwar nur überflogen, aber werde es sicher nächste Woche selbst ausprobieren… Gute Arbeit mein Lieber
Jetzt müßte man nur noch den mittleren content auf die volle Breite bekommen, dann hätte man ja das gewünschte 2 spaltige Layout.
Hallo avenger, ich hab mir deine Javascript-Lösung mal angeschaut. Hab aber auf die schnelle jetzt nicht kapiert warum du z.B. {include file=‚frontend/plugins/index/topseller.tpl‘} nicht einfach in left.tpl einfügst (ohne Javascript).
[quote=“avenger”][quote=“taaucher”]Jetzt müßte man nur noch den mittleren content auf die volle Breite bekommen, dann hätte man ja das gewünschte 2 spaltige Layout.[/quote] Das ist schon mal ein guter Anfang: In framework.css Zeile 68 .container\_20 .grid\_13 { width: 790px; } #right { display:none; }
[/quote] Moin, Besser wäre aus Grid13 einfach Grid17 zu machen Shopware verwendet ja die 20er Aufteilung. Wenn du grid20 machst, hast die volle Breite. So kannst du deine Aufteilung zuordnen
Ich habe, im Shop den ich gerade einrichte, ein 2-spaltiges Layout in der Artikelliste. Ich hab das in der ‘listing/index.tpl’ so gemacht. [code] {* Main content *} {block name=‘frontend_index_content’}
… [/code] Den rechten Bereich ausgeblendet: {\* Sidebar right \*} {block name='frontend\_index\_content\_right'}{/block}
[quote=“radox”]Hallo avenger, ich hab mir deine Javascript-Lösung mal angeschaut. Hab aber auf die schnelle jetzt nicht kapiert warum du z.B. {include file=‘frontend/plugins/index/topseller.tpl’} nicht einfach in left.tpl einfügst (ohne Javascript).[/quote] Das scheint sogar zu funktionieren, zumindest bei dem Topseller. :thumbup: Allerdings sehe ich Performance-Nachteile, wenn ich alle Boxen, die in der rechten Spalte verwendet werden, statisch in die left.tpl einbinde, weil dann bei jedem Shop-Aufruf diese ganzen includes (völlig unnötig) ausgewertet werden müssen… (Ich will ja nicht die rechte Spalte komplett platt machen (wie Du das in dem Beispiel weiter unten ja tust), sondern die Inhalte schon weiter verfügbar haben.) Bei der dynamischen Lösung per Javascript werden die nach wie vor nur dann (kontextabhängig) berechnet, wie das in der Shopware-Software vorgesehen ist. Das Umsetzen der Boxen im Browser DOM fällt zeitlich überhaupt nicht ins Gewicht… Und ich muss die “left.tpl” nicht massiv ändern, außer dem neuen Zielbereich… (Den könnte man durch andere jQuery-Befehle vermutlich auch noch entbehren, indem man die Boxen an den Anfang von “left” umsetzt.)
Auf jeden Fall interessanter Ansatz. :thumbup: Danke für die Info.
[quote=„avenger“][quote=„radox“]Hallo avenger, ich hab mir deine Javascript-Lösung mal angeschaut. Hab aber auf die schnelle jetzt nicht kapiert warum du z.B. {include file=‚frontend/plugins/index/topseller.tpl‘} nicht einfach in left.tpl einfügst (ohne Javascript).[/quote] Das scheint sogar zu funktionieren, zumindest bei dem Topseller. :thumbup: Allerdings sehe ich Performance-Nachteile, wenn ich alle Boxen, die in der rechten Spalte verwendet werden, statisch in die left.tpl einbinde, weil dann bei jedem Shop-Aufruf diese ganzen includes (völlig unnötig) ausgewertet werden müssen… (Ich will ja nicht die rechte Spalte komplett platt machen (wie Du das in dem Beispiel weiter unten ja tust), sondern die Inhalte schon weiter verfügbar haben.) Bei der dynamischen Lösung per Javascript werden die nach wie vor nur dann (kontextabhängig) berechnet, wie das in der Shopware-Software vorgesehen ist. Das Umsetzen der Boxen im Browser DOM fällt zeitlich überhaupt nicht ins Gewicht… Und ich muss die „left.tpl“ nicht massiv ändern, außer dem neuen Zielbereich… (Den könnte man durch andere jQuery-Befehle vermutlich auch noch entbehren, indem man die Boxen an den Anfang von „left“ umsetzt.)[/quote] Habe gerade noch einen Grund entdeckt, warum das statische Verlagern der Boxen von der rechten in die linke Spalte nicht funktionieren wird: Es gibt Situationen, in denen es keine linke, dafür aber eine rechte gibt (z.B. das Kontaktformular). Dabei würde die statische Verlagerung versagen, in meinem Javascript zur Boxenverlagerung kann ich das aber berücksichtigen! (Wenn es keine linke Spalte gibt, findet keine Verlagerung statt.)