Thread

I am using EE v2.4.0. I have a CSS type template file that I want to use either snippets or User Defined global variables in. I can get it to parse “global variables” just not User Defined global variables” or snippets for that matter.

Template file (type CSS):

div.one{background:url({theme_img_path}/bg.jpg) 0 0 repeat-x;}
div.two{background:url({site_url}/bg.jpg) 0 0 repeat-x;}

User Defined global variable or snippet:

{theme_img_path}    /themes/red/

I would expect my template to parse like this:

div.one{background:url(/themes/red/bg.jpg) 0 0 repeat-x;}
div.two{background:url(http:www.domain.com/bg.jpg) 0 0 repeat-x;}

but it does this:

div.one{background:url({theme_img_path}/bg.jpg) 0 0 repeat-x;}
div.two{background:url(http:www.domain.com/bg.jpg) 0 0 repeat-x;}

I need this ability so that way I can change my img directory for my themes with on variable edit

any help would be appreciated….

Off the top of my head, I don’t think EE parses files defined as CSS in that way.

That being said, perhaps this is worth a shot:

http://gotolow.com/blog/snippets-and-preload-replace-variables

I had the same problem… 

Turns out the snippets aren’t processed if you link to a stylesheet via {stylesheet='path/stylesheet'}.  If you use {path='path/stylesheet'} your snippets and glob vars are processed.  If you do this you have to make sure your stylesheet is defined as a css file.

It’s explained here:  http://ellislab.com/expressionengine/user-guide/templates/globals/stylesheet.html#using-tags-and-php-in-a-stylesheet

I leave here an article from the blog of a contact in LinkedIn that talks about how to use variables in CSS, http://sergiocebrian.com/blog/2012/05/variables-con-css-3/

maybe you should put something like this: theme_path_relative the snippet

{theme_path_relative} 'dot/theme/images', ie './theme/images' but I have not tried.

on the other side in the css file you would have to put:

: root {mypath '{theme_path_relative}';};

and after all the other elements you want to use the variable:

p {background-image: url(var(mypath)/mybackground1.jpg);}

this should work, at least partially, the link should be fine, is for CSS3, and the first thing I have not tried it, but if you put the dot before maybe get what you want.

if you need any correction to write a post that I am following the thread