# Einkaufswelt/Kategorie mit eigener Farbe?

**URL:** https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343
**Category:** Shopware 3.5
**Tags:** themes--design
**Created:** [6. Dezember 2012 um 21:15 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343 "2012-12-06T21:15:49Z")
**Posts on this page:** 17
**Page:** 1

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [6. Dezember 2012 um 21:15 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/1 "2012-12-06T21:15:49Z")

</div>

Hallo Community, bin neu hier und absolut begeistert von der neuen Shopware 4. Obwohl ich mich grundsätzlich mit Templateanpassungen einigermaßen auskenne, und HTML und css keine Fremdworte mehr für mich sind, habe ich das Templatesystem von SW4 noch nicht so richtig verinnerlicht. Denke das kommt vermutlich beim Arbeiten. Nun zu meiner Frage: mir gefällt das emotion template schon ziemlich gut. Nun hätte ich gerne eine Kategorie (oder ist das eine Einkaufswelt?) wie z.B. Wohnwelten aus dem Demoshop in der Farbe blau, und den Rest in pink. Es sollten dann alle in der entsprechenden Kategorie gefärbten Elemente (Warenkorb Button, Links etc.) blau sein, im übrigen Shop pink. Meine Idee (so grundsätzlich) wäre jetzt für die gesamte Kategorie Wohnwelten das Template emotion\_blue zu verwenden, und für den Rest (Also Shopstandard) das template emotion\_pink. Ist das irgendwie machbar? Wenn ja, kann mir jemand hier auf die Sprünge helfen? thx

---

<div class="post-metadata">

### Author: ![leseaw](https://avatars.discourse-cdn.com/v4/letter/l/73ab20/32.png) [@leseaw](https://forum.shopware.com/u/leseaw)
#### Post date: [6. Dezember 2012 um 21:24 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/2 "2012-12-06T21:24:02Z")

</div>

[http://store.shopware.de/template-desig … sel?c=2159](http://store.shopware.de/template-design/kategorie-hintergrundwechsel?c=2159) das vielleicht?

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [6. Dezember 2012 um 21:33 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/3 "2012-12-06T21:33:34Z")

</div>

Hallo leseaw, danke schonmal für diese superschnelle Antwort. Das Plugin hatte ich noch nicht gesehen, und ist vielleicht auch eine Idee. Momentan lieber wäre mir eine Kategorie im komplett andersfarbigen Design der Elemente, also eigentlich exakt der farbigen Unterscheidung von emotion\_blue zu emotion\_pink zu haben. Also Shopware mitteilen: Grundsätzlich das Template emotion\_pink verwenden, ausser in der Kategorie „wohnwelten“ dort bitte das Template emotion\_blue! Ginge das?

---

<div class="post-metadata">

### Author: ![leseaw](https://avatars.discourse-cdn.com/v4/letter/l/73ab20/32.png) [@leseaw](https://forum.shopware.com/u/leseaw)
#### Post date: [6. Dezember 2012 um 21:56 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/4 "2012-12-06T21:56:24Z")

</div>

alles geht 🙂 entweder du selber oder wer anderes macht es für dich.

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [6. Dezember 2012 um 22:10 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/5 "2012-12-06T22:10:28Z")

</div>

[quote=„leseaw“]alles geht 🙂 entweder du selber oder wer anderes macht es für dich.[/quote] Na das ist mir ja klar. Ich dachte hier sei ein Forum, wo man sich ein bisschen hilft. Habe ja nur gefragt, ob mir jemand auf die Sprünge helfen kann. Hab hier schon ein paar Tutorials durchgelesen. Was ich schon verstanden habe, ist daß man für template-Änderungen eine Art Klon, des Ursprungstemplates erstellt, dann nur mit den Anpassungen. Ich Habe auch ein anders Tutorial gefunden, wo mit einer if/else Bedingung verschiedene kategoriebezogene styles angesprochen werden. Nur, ich dachte es sei eventuell möglich, einer Kategorie „zu sagen“ nehme dieses oder jenes template, also nicht jedes einzelne grafische Element mit einer Bedingung zu versehen. Vielleicht mag mir dazu jemand noch was schreiben?

---

<div class="post-metadata">

### Author: ![hth](https://avatars.discourse-cdn.com/v4/letter/h/b77776/32.png) [@hth](https://forum.shopware.com/u/hth)
#### Post date: [7. Dezember 2012 um 08:38 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/6 "2012-12-07T08:38:06Z")

</div>

Hallo „Allgemeine Einstellungen - Kategorie“ -\> Templateauswahl Aber dann muss die ganze Vererbungsreihenfolge beachtet werden. Wie wäre es denn mit einer if Abfrage nach der aktiven Kategorie und danach der Auswahl von verschiedenen CSS-Dateien. Dann können alle Hintergrundbilder und Farben einzeln angepasst werden. Also ein Wechsel von emotion\_pink nach emotion\_black. Meiner Ansicht nach der einfachste Weg. Allerdings ist beim Klick auf ein Produkt unter Umständen die Artikeldetailseite in einer anderen aktiven Kategorie. Das müsste getestet werden.

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [7. Dezember 2012 um 23:45 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/7 "2012-12-07T23:45:28Z")

</div>

Hallo hth, ich habe mal folgendes versucht bei aktiviertem emotoion\_pink Template den Header entsprechend so angepasst Im Ordner templates\>emotion\_pink\>frontend\>index\>header.tpl [quote] {extends file=‘parent:frontend/index/header.tpl’} {block name=“frontend\_index\_header\_css\_screen” append}{if $sCategory.id eq 8}{else} {/if} {/block} [/quote] und natürlich die emotion\_blue.css in das entsprechende Verzeichnis kopiert. Klappt leider aber nicht. Die ID der Kategorie habe ich aus der Datenbank. Da ist es die “id”. Ne Idee?

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [8. Dezember 2012 um 10:17 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/8 "2012-12-08T10:17:12Z")

</div>

Also, das vorstehende Snippet lädt die emotion\_pink.css und zwar bei jeder Kategorie. Dann habe ich es mal so probiert: [quote] {extends file=‘parent:frontend/index/header.tpl’} {if $sCategory.id eq 5} {block name=“frontend\_index\_header\_css\_screen” append} {/block} {else} {block name=“frontend\_index\_header\_css\_screen” append} {/block} {/if} [/quote] und nun werden beide \*.css (emotion\_pink.css und emotion\_blue.css) geladen und zwar in jeder Kategorie. Das sagt mir zumindest, dass der Ansatz ja funktionieren könnte, allerdings meine if/else Bedingung nicht zu stimmen scheint. Kann mir hier jemand weiterhelfen?

---

<div class="post-metadata">

### Author: ![leseaw](https://avatars.discourse-cdn.com/v4/letter/l/73ab20/32.png) [@leseaw](https://forum.shopware.com/u/leseaw)
#### Post date: [8. Dezember 2012 um 10:33 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/9 "2012-12-08T10:33:16Z")

</div>

{block name=“frontend\_index\_header\_css\_screen” append} {if $sCategory.id eq ‘5’}{else}{/if} {/block} du hast ja die Blöcke immer abgeschlossen Probiere das mal

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [8. Dezember 2012 um 10:43 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/10 "2012-12-08T10:43:54Z")

</div>

Das war ja der Versuch einen Post vorher. Das führt dazu, dass immer das pink css geladen wird. (habe es jetzt auch noch mal mit Deinem Snippet versucht). Wie sieht es denn aus mit der Identifizierung der Kategorie? Ich habe als ID das hier eingetragen [Your text to link here…](http://awesomescreenshot.com/0e4p1no79) …scheint ja so, als würde SW hier mit der Bedingung die gewünschte Kategorie nicht erkennen, wenn er ja direkt auf die {else} Bedingung geht.

---

<div class="post-metadata">

### Author: ![leseaw](https://avatars.discourse-cdn.com/v4/letter/l/73ab20/32.png) [@leseaw](https://forum.shopware.com/u/leseaw)
#### Post date: [8. Dezember 2012 um 11:03 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/11 "2012-12-08T11:03:27Z")

</div>

{block name=„frontend\_index\_header\_css\_screen“ append} {if $sCategory.id eq 5}{else}{/if} {/block} [post49639.html?hilit=$sCategory.id#p49639](http://forum.shopware.de/post49639.html?hilit=%24sCategory.id#p49639) [post48974.html?hilit=$sCategory.id#p48974](http://forum.shopware.de/post48974.html?hilit=%24sCategory.id#p48974) da findest du alles was du brauchst 🙂

---

<div class="post-metadata">

### Author: ![hth](https://avatars.discourse-cdn.com/v4/letter/h/b77776/32.png) [@hth](https://forum.shopware.com/u/hth)
#### Post date: [8. Dezember 2012 um 14:22 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/12 "2012-12-08T14:22:00Z")

</div>

Hi, der Ansatz funktioniert und es funktioniert alles so wie es @senana im ersten Versuch im Template angegeben hat, allerdings übergibt das Shopware-Backend nicht die Variable $sCategory.id an die Template-Engine (smarty). Da $sCategory.id für Smarty nicht existiert, kann der Wert natürlich auch niemals 8 ergeben und {else} wird ausgeführt. Es wird nur ein assoz. Array $sCategories übergeben, schaut es euch mit firephp an. Daraus wird im horizontalen Menü immer die Variable $sCategory.id zugeordnet. Entweder ihr macht das auch so, oder ihr sprecht einzelne Elemente des Arrays mit Index an. Smarty-Dokumentation: [http://www.smarty.net/docs/en/language.variables.tpl](http://www.smarty.net/docs/en/language.variables.tpl) Firephp: gibt ein tutorial für die 3er Version, funktioniert mit Ver. 4 genauso. Bleibt die Frage, was jetzt genau gewünscht ist: (A.) alle Kategorien einer Hauptkategorie id=8 in Pink oder (B.) tatsächlich nur die aktuelle Kategorie. A. `{if $sBreadcrumb[0].id eq 8} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_pink.css'%7D"> {else} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_meintheme.css'%7D">{/if}` B. `{if $sCategoryCurrent eq 5} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_pink.css'%7D"> {else} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_meintheme.css'%7D">{/if}`[/code]

---

<div class="post-metadata">

### Author: ![senana](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/senana/32/14169_2.png) [@senana](https://forum.shopware.com/u/senana)
#### Post date: [8. Dezember 2012 um 16:32 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/13 "2012-12-08T16:32:28Z")

</div>

Super! Lösungsweg A. ist genau das was ich haben wollte. Perfekt! Tausend dank. Ich hatte mir schon gedacht dass Smarty hier vermutlich mit der Kategorie Id nix anfangen kann. Allerdings ist das mit einem assoziativen Array/firePHP für mich erst mal Neuland. Werde es mir aber mal ansehen. Auf jeden Fall danke für diese konkrete Hilfestellung.

---

<div class="post-metadata">

### Author: ![wollstylisten](https://avatars.discourse-cdn.com/v4/letter/w/34f0e0/32.png) [@wollstylisten](https://forum.shopware.com/u/wollstylisten)
#### Post date: [10. Januar 2013 um 18:05 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/14 "2013-01-10T18:05:11Z")

</div>

Hallo zusammen, zwei Fragen zum Aufbau der vorstehenden Abfrage. 1.) Muss ich diesen Aufbau für jede Kategorie, die abgefragt werden soll, einzeln durchführen? 2.) Es reicht doch wenn in der jeweiligen CSS-Datei nur die Farbänderungen enthalten sind oder? Alles andere wird ja aus der Stammdatei genommen, wenn ich es bisher richtig verstanden habe. Gruß Markus

---

<div class="post-metadata">

### Author: ![hth](https://avatars.discourse-cdn.com/v4/letter/h/b77776/32.png) [@hth](https://forum.shopware.com/u/hth)
#### Post date: [10. Januar 2013 um 18:22 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/15 "2013-01-10T18:22:58Z")

</div>

[quote=“wollstylisten”]Hallo zusammen, zwei Fragen zum Aufbau der vorstehenden Abfrage. 1.) Muss ich diesen Aufbau für jede Kategorie, die abgefragt werden soll, einzeln durchführen? [/quote] Für jede Kategorie, die eine eigene CSS-Datei erhalten soll, muss eine if-Abfrage erstellt werden. Mit “Eigene CSS-Datei” ist eine andere CSS-Datei als die Standardatei des Templates gemeint. Wenn mehrere Kategorien ein und dieselbe alternative Datei bekommen sollen, dann kann man die Bedingung mit or verknüpfen und muss nicht jedes Mal eine komplett neue if-Abfrage schreiben. [quote=“wollstylisten”] 2.) Es reicht doch wenn in der jeweiligen CSS-Datei nur die Farbänderungen enthalten sind oder? Alles andere wird ja aus der Stammdatei genommen, wenn ich es bisher richtig verstanden habe. [/quote] Kommt darauf an. Es muss grundsätzlich die emotion\_meintemplate.css Datei plus die Farbänderungen sein. Alternativ kann man den header so umschreiben, dass zuerst immer emotion\_meintemplate.css aufgerufen wird und danach noch eine CSS-Datei über die if-Abfrage, in der nur die geänderten Farben sind. Auf jeden Fall muss ein Mal die emotion\_meintemplate.css im HTML-Header verlinkt werden, sonst geht es nicht.

---

<div class="post-metadata">

### Author: ![wollstylisten](https://avatars.discourse-cdn.com/v4/letter/w/34f0e0/32.png) [@wollstylisten](https://forum.shopware.com/u/wollstylisten)
#### Post date: [10. Januar 2013 um 19:02 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/16 "2013-01-10T19:02:33Z")

</div>

Vielen Dank für die schnelle Antwort. Habe jetzt folgendes in der header.tpl geschrieben: `{extends file='parent:frontend/index/header.tpl'} {block name="frontend\_index\_header\_css\_screen" append} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial.css'%7D">{if $sBreadcrumb[0].id eq 6} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial2.css'%7D"> {else} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial.css'%7D">{/if} {/block}` Und habe z.B. in der emotion\_tutorial2.css nur die entsprechenden Farben geändert. Bisher klappt es.

---

<div class="post-metadata">

### Author: ![hth](https://avatars.discourse-cdn.com/v4/letter/h/b77776/32.png) [@hth](https://forum.shopware.com/u/hth)
#### Post date: [11. Januar 2013 um 09:33 UTC](https://forum.shopware.com/t/einkaufswelt-kategorie-mit-eigener-farbe/10343/17 "2013-01-11T09:33:51Z")

</div>

```auto
else} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial.css'%7D">[/code] das ist überflüssig, schließlich wird diese Datei bereits for der if-Abfrage im Header geladen. So würde alles doppelt geladen und vom Browser interpretiert werden. emotion\_tutorial2.css ergänzt und ändert doch nur die emotion\_tutorial.css aus der Zeile vor der if-Abfrage. Das sind aber Grundlagen von HTML und CSS die fehlen. Wenn da noch mehr Änderungen im CSS/Template gemacht werden sollen, empfehle ich, die zuerst zu lernen und danach mit Änderungen im SMARTY-Template zu beginnen. [quote="wollstylisten"]Vielen Dank für die schnelle Antwort. Habe jetzt folgendes in der header.tpl geschrieben: [code]{extends file='parent:frontend/index/header.tpl'} {block name="frontend\_index\_header\_css\_screen" append} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial.css'%7D">{if $sBreadcrumb[0].id eq 6} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial2.css'%7D"> {else} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/emotion_tutorial.css'%7D">{/if} {/block}
```
