# Smarty Variable in CSS verwenden **URL:** \ **Category:** Shopware 3.5\ **Tags:** programming\ **Created:** [17. April 2014 um 16:08 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831 "2014-04-17T16:08:29Z")\ **Posts on this page:** 13\ **Page:** 1
**Author:** ![Jakko](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@Jakko](https://forum.shopware.com/u/Jakko)\ **Post date:** [17. April 2014 um 16:08 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/1 "2014-04-17T16:08:29Z")
Hallo, ich mache gerade einen Plugin, bei der die Benutzer einpaar CSS Eigenschaften in der Config einstellen können, was ich dann mit Smarty in meine CSS Datei einfügen möchte. Leider klappt das nicht einfach so, weil CSS die geschweiften Klammern { und } verwendet. Wie kann ich das aber denn noch so hinbekommen, dass in der CSS Datei meine Smarty Variable richtig gelesen wird?? ---
**Author:** ![Hype](https://avatars.discourse-cdn.com/v4/letter/h/b9e5f3/32.png) [@Hype](https://forum.shopware.com/u/Hype)\ **Post date:** [17. April 2014 um 16:20 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/2 "2014-04-17T16:20:35Z")
Moin Jakko, ich hab’s noch nie versucht, aber hast du schon ausprobiert, den Smartycode in CSS Kommentare zu verpacken? Also: ` .listing-1-col { color: #/\* {$config.color} \*/; } ` Meld dich mal, ob’s klappt, bin gerade auch mal neugierig! ---
**Author:** ![Jakko](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@Jakko](https://forum.shopware.com/u/Jakko)\ **Post date:** [17. April 2014 um 19:30 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/3 "2014-04-17T19:30:45Z")
Hallo Hype, ich habs gerade probiert, aber leider hat es nicht funktioniert… Hast du vielleicht noch eine Idee ;)? ---
**Author:** ![Hype](https://avatars.discourse-cdn.com/v4/letter/h/b9e5f3/32.png) [@Hype](https://forum.shopware.com/u/Hype)\ **Post date:** [18. April 2014 um 05:09 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/4 "2014-04-18T05:09:39Z")
Ist die Datei eigentlich eine TPL Datei, die auch tatsächlich von Smarty geparst wird? Wenn es nur eine CSS Datei ist, weiß Smarty ja gar nicht, dass da Werte eingetragen werden sollen. Desweiteren kenn Smarty übrigends die Tags {ldelim} und {rdelim}, die dann jeweils die Geschweiften Klammern ausgeben. Schau dir hierzu mal folgenden Thread im Smarty Forum an, vielleicht hilft das: [http://www.smarty.net/forums/viewtopic.php?t=11517](http://www.smarty.net/forums/viewtopic.php?t=11517) ---
**Author:** ![Jakko](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@Jakko](https://forum.shopware.com/u/Jakko)\ **Post date:** [18. April 2014 um 18:14 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/5 "2014-04-18T18:14:31Z")
Ja die Datei ist eine TPL Datei. Ich habe folgendes in meiner CSS Datei probiert und es geht wieder nicht… ` .tabs label:hover{ background-color: {ldelim}$Data.tabHoverColor{rdelim}; color: #333; top: 0; } ` ---
**Author:** ![EikeBrandtWarneke](https://avatars.discourse-cdn.com/v4/letter/e/cdc98d/32.png) [@EikeBrandtWarneke](https://forum.shopware.com/u/EikeBrandtWarneke)\ **Post date:** [18. April 2014 um 18:28 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/6 "2014-04-18T18:28:12Z")
Was steht nachher in der deinem HTML? Bist du dir -sicher-, dass du Datei von smarty geparsed wird? Wie rufst du die css auf bzw wie bindest du sie ein? Viele Grüße ---
**Author:** ![Jakko](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@Jakko](https://forum.shopware.com/u/Jakko)\ **Post date:** [19. April 2014 um 01:59 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/7 "2014-04-19T01:59:57Z")
Also, ich habe keine Ahnung wie ich das sehen kann, ob die Datei von Smarty geparsed wird oder nicht. Am besten füge ich hier noch kurze Codefragmente ein, dann wird es vielleicht ein wenig klarer. Bootstrap.PHP Da es ein Einkaufswelten Element sein soll, wird meine Template Datei über die createEmotionComponent Methode (in der registerEmotionElement Methode) aufgerufen! (‚template‘ =\> ‚component\_custom‘) ` ... ... ... public function install() { $this-\>createConfiguration(); $this-\>subscribeEvent('Enlight\_Controller\_Action\_PostDispatch','onPostDispatchWidgets'); $this-\>registerEmotionElement(); return true; } ... ... ... public function createConfiguration() { $form = $this-\>Form(); $form-\>setElement('color', 'tabHoverColor', array( 'label' =\> 'Tab Hover Color', 'value' =\> '#FFFFFF' //default ) ); } ... ... ... public function onPostDispatchWidgets(Enlight\_Event\_EventArgs $args){ $view = $args-\>getSubject()-\>View(); $config = $this-\>Config(); if (empty($config-\>show) && $config-\>show !== null) { return; } $args-\>getSubject()-\>View()-\>addTemplateDir( $this-\>Path() . 'Views/' ); $view-\>tabHoverColor = $config-\>tabHoverColor; } public function registerEmotionElement() { $component = $this-\>createEmotionComponent(array( 'name' =\> 'Name des Einkaufswelten Elements', 'template' =\> 'component\_custom' )); ... ... }//end: registerEmotionElement ` component\_custom.TPL Die CSS habe ich in meiner component\_custom.TPL Datei im Tag eingebunden! [code] ... ... .tabs label:hover { background-color:{ldelim}$Data.tabHoverColor{rdelim}; color: #333; top: 0; } ... ... ... ... [/code] ---
**Author:** ![EikeBrandtWarneke](https://avatars.discourse-cdn.com/v4/letter/e/cdc98d/32.png) [@EikeBrandtWarneke](https://forum.shopware.com/u/EikeBrandtWarneke)\ **Post date:** [19. April 2014 um 02:11 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/8 "2014-04-19T02:11:47Z")
[quote=“Jakko”]Also, ich habe keine Ahnung wie ich das sehen kann, ob die Datei von Smarty geparsed wird oder nicht. [/quote] Du kannst dir zb die erzeugte HTML angucken und schauen ob dein {ldelim} geparsed wird. Und dir ist schon klar, dass es {$Data.tabHoverColor} und nicht $Data.tabHoverColor? [quote=“Jakko”]background-color:{ldelim}$Data.tabHoverColor{rdelim};[/quote] Und was soll das überhaupt werden? Viele Grüße ---
**Author:** ![Hype](https://avatars.discourse-cdn.com/v4/letter/h/b9e5f3/32.png) [@Hype](https://forum.shopware.com/u/Hype)\ **Post date:** [19. April 2014 um 03:00 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/9 "2014-04-19T03:00:25Z")
Übrigens, die Geschichte mit dem {ldelim} ist dafür vorgesehen, die für CSS vorgegebenen geschw. Klammern auszugeben. Also etwa so: ` .tabs label:hover{ldelim} background-color: {$Data.tabHoverColor}; color: #333; top: 0; {rdelim} ` Wird deine components\_custom.tpl überhaupt im Frontend angezeigt (also korrekt eingebunden)? Keine Sorge, wir bekommen das schon hin 😉 ---
**Author:** ![bluewolf](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bluewolf/32/7886_2.png) [@bluewolf](https://forum.shopware.com/u/bluewolf)\ **Post date:** [19. April 2014 um 20:23 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/10 "2014-04-19T20:23:34Z")
Oder zum Beginn der CSS das Parsing mit {literal} deaktivieren. Dann bei der Variable {/literal}{$Data.xx.xx}{literal} Am Ende das CSS Blocks dann das Parsing wieder einschalten {/literal} Sent from my Samsung ativ S using Tapatalk ---
**Author:** ![Jakko](https://avatars.discourse-cdn.com/v4/letter/j/51bf81/32.png) [@Jakko](https://forum.shopware.com/u/Jakko)\ **Post date:** [20. April 2014 um 16:32 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/11 "2014-04-20T16:32:59Z")
Endlich! 🙂 Ich habe das Problem gelöst. Der Fehler war folgender… in der Bootstrap.php hatte ich folgendes stehen. ` ... public function onPostDispatchWidgets(Enlight\_Event\_EventArgs $args){ $view = $args-\>getSubject()-\>View(); $config = $this-\>Config(); if (empty($config-\>show) && $config-\>show !== null) { return; } $view-\>tabColor = $config-\>tabColor; $view-\>tabActiveColor = $config-\>tabActiveColor; $view-\>tabHoverColor = $config-\>tabHoverColor; $args-\>getSubject()-\>View()-\>addTemplateDir( $this-\>Path() . 'Views/' ); } ... ` `$args-\>getSubject()-\>View()-\>addTemplateDir( $this-\>Path() . 'Views/' ); ` Diesen Codeabschnitt habe ich mit folgendes ersetzt `$view = $args-\>getSubject()-\>View(); $view-\>addTemplateDir($this-\>Path() . 'Views/');` Also, ich glaube ich habe einfach vergessen meine Template in eine Varibale ($view) zu speichern. korrigierter bootstrap.php `public function onPostDispatchWidgets(Enlight\_Event\_EventArgs $args){ $view = $args-\>getSubject()-\>View(); $config = $this-\>Config(); if (empty($config-\>show) && $config-\>show !== null) { return; } $view-\>tabColor = $config-\>tabColor; $view-\>tabActiveColor = $config-\>tabActiveColor; $view-\>tabHoverColor = $config-\>tabHoverColor; $view = $args-\>getSubject()-\>View(); $view-\>addTemplateDir($this-\>Path() . 'Views/'); }` Dann konnte ich die Variablen, die ich in der Bootstrap Datei erstellt habe (tabColor, tabActiveColor usw.) ganz einfach ohne irgendwelche Modifikationen zu machen verwenden. Also so… [code] .tabs label { display: block; padding: 10px 20px; border-radius: 2px 2px 0 0; background: {$tabColor}; … } .tabs label:hover { background-color:{$tabHoverColor}; top: 0; } ``` [id^=tab]:checked + label { background: {$tabActiveColor}; top: 1px; border: solid thin #ccc; border-bottom:none; z-index:3; } ``` [/code] Vielen Dank an alle die mitgeholfen haben… :thumbup: ---
**Author:** ![EikeBrandtWarneke](https://avatars.discourse-cdn.com/v4/letter/e/cdc98d/32.png) [@EikeBrandtWarneke](https://forum.shopware.com/u/EikeBrandtWarneke)\ **Post date:** [20. April 2014 um 17:51 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/12 "2014-04-20T17:51:43Z")
Vielleicht postest du dann nächstes mal deinen tatsächlichen Code. Dann können wir wenigstens auch produktiv helfen anstatt dass du uns wild Raten lässt… Viele Grüße Gesendet von meinem iPhone mit Tapatalk ---
**Author:** ![Martin\_Weinmayr](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/martin_weinmayr/32/13016_2.png) [@Martin\_Weinmayr](https://forum.shopware.com/u/Martin_Weinmayr)\ **Post date:** [20. April 2014 um 18:03 UTC](https://forum.shopware.com/t/smarty-variable-in-css-verwenden/19831/13 "2014-04-20T18:03:41Z")
Habe mich verlesen …