use [[$orange]] outside of a CSS Stylesheet

mainenotarynet · Post by **mainenotarynet** » Sun Aug 28, 2016 8:39 pm

I recently fount the Simplex Template and am using it on a site I am designing for someone.

Now, I like the idea of [[assign var='blue' value='#00000FF']]

then anywhere in a stylesheet I want Blue I put [[$blue]]

Problem I can't do this in a page

blah blah in blue</span

the thing barfs (doesn't display ant background color), so I looked at the view-source, found the CSS file link and looked there.

What I see is that all the assigns had been transformed into the respective colors, so as far as the {content} tag sees the color names don't exist...Not Useable

How do I make them useable everywhere not just in CSS sheets?

chandra · Post by **chandra** » Tue Aug 30, 2016 7:41 am

mainenotarynet wrote: Now, I like the idea of [[assign var='blue' value='#00000FF']]

Note: Smarty delimiters are only changed inside the CMSMS stylesheets ( [[command ...]] ).

mainenotarynet wrote: then anywhere in a stylesheet I want Blue I put [[$blue]]

Problem I can't do this in a page

blah blah in blue</span

Outside stylesheet variables must be used with Smarty default delimiters as

blah blah in blue

But I see two problems for your special request.

To the first cms_stylesheet tag is running only at the first time completely. After that there's only a link to the cached stylesheet. And there's no chance to deactivate this behaviour. Means variable $blue is not available.

And to the second variable $blue is not global. Means is only available inside cms_stylesheet area.

So I suggest following solution:

Put all of this

Code: Select all

{assign var='blue' value='#00000FF'}

inside a global content block and call this block at the top of your template with

Code: Select all

{global_content name='style_vars' scope='global'}

So variable $blue will be available in all stylesheets and templates.

Btw don't forget to kill the assign inside the stylesheet

.

mainenotarynet · Post by **mainenotarynet** » Tue Aug 30, 2016 5:58 pm

I may have inadvertantly LOCKED the post by accepting a reply, I wanted to say Thank you to @Chandra, but add an observation.

By doing the Content Block and editing the Stylesheet way:
<code>[[assign var='Blue' Value='#000080']]</code>

to the GCB format of:
<code>{assign var='Blue' value='#000080'}</code>

Then just put the
<code>{global_Content name='colorschemes'}</code>

jst below the <head> tag ( I tried above, like just below the { $Process_Data } tag but that barfed it below the head tag worked.

I left everything in the stylesheet alone (I [[* Commented Out *]] the
<code>[[assign var='Blue' value='#000080']]</code>

just in case it didn't work -- also left all the [[color]] references in the stylesheet alone.

When my page came back I tried using
<code>BlahBlahin Blue</code>

It seems when you use the assigns like this, the way to invoke it is by
<code></code>

notice no delimiters or the '$' (Dollar Sign/String) character. This did work because I tried changing to Green and it changed.

So, again Thank You Chandra

Rolf · Post by **Rolf** » Tue Aug 30, 2016 6:35 pm

mainenotarynet wrote:I may have inadvertantly LOCKED the post by accepting a reply

fixed

chandra · Post by **chandra** » Wed Aug 31, 2016 3:19 pm

Maybe some words of my explanation are not clear - have tried it now by myself

. What have I done:

1. Edit Template and add this

Code: Select all

{assign var='Blue' value='#000080'}

directly after {process_pagedata}.

Yes, there's no need to put it inside a global content block. Could be directly inserted inside templates. The goal is scope param isn't needed.

2. Add this to related CSS

Code: Select all

.blue {
   color: [[$Blue]];
}

3. Check if it work with direcly formatting

Code: Select all

<span style="background-color: {$Blue};">blah blah background in blue</span>

and CSS formatting

Code: Select all

<span class="blue">blah blah text in blue</span>

Both options are working for me ... background and text have blue color.

My developer Page on the Forge · Post by **Jo Morg** » Wed Aug 31, 2016 4:43 pm

There is however a glitch to this approach: editing a template won't clear the cache for stylesheets... additionally if different templates use the same stylesheets but assign different values to the color vars the stylesheets will behave erratically depending on what value a var has assigned to it just before the combined stylesheets are cached, and they are (usually) computed and cached less frequently than templates and contents.
The best (and recommended) practice is to use Smarty configuration file variables, but still need to take in consideration clearing the cache while testing color schemes.

CMS Made Simple Forums

use [[$orange]] outside of a CSS Stylesheet

use [[$orange]] outside of a CSS Stylesheet

Re: use [[$orange]] outside of a CSS Stylesheet

Re:use [[$orange]] outside of a CSS Stylesheets

Re: Re:use [[$orange]] outside of a CSS Stylesheets

Re: use [[$orange]] outside of a CSS Stylesheet

Re: use [[$orange]] outside of a CSS Stylesheet