Loads compressed CSS files to the page, whenever possible directly from the cache

Kuvaus

Using the tag improves theme performance especially if multiple CSS files are used.

See also the {MinifyJS} tag with which you can add compressed Javascript files to the page.

Syntaksi

{MinifyCSS( files: string, mode: string )}

Näkyvyys

Toimii näkyvyydessä: globaali

It is possible to use global visibility tags in any page template and within any tag.

Loading compressed theme stylesheets

{MinifyCSS( files: 'css/master.css|css/base.css|css/forms.css', mode: 'development' )} 

While still developing the theme, keep the value of the {MinifyCSS} tag's mode attribute set to development, so that stylesheets won't be loaded from the cache but directly from the server at each page load. In this way, all changes will become visible in the theme immediately.

Once the theme has been developed and the website is about to be published, you may want to change the value of the {MinifyCSS} tag's mode attribute to production to improve theme performance by loading compressed styles, whenever possible, directly from the cache memory.

{MinifyCSS( files: 'css/master.css|css/base.css|css/forms.css', mode: 'production' )} 

Attribuutit

files:

Defines which files should be loaded by the tag.

The attribute's values are pipe separated file locations in relation to the theme's root directory.

E.g. files:'css/master.css|css/base.css|css/forms.css'

mode:

Defines a state for the tag based on which files are loaded either as packed or unpacked.

Allowed values:

  • 'production': In production, files are loaded compressed from the cache.
  • 'development': In development, files are loaded anew at every page load, so that potential changes become visible immediately.
before/after:

With the before and after attributes, you can define content that is output before or after the content produced by the tag.

Allowed values: text that may contain HTML and Interface markup.

E.g.

  • before: '<p>This markup appears before the tag's own content.</p>'.
  • after: '<p>This appears after the tag's own content.</p>'

If the tag does not produce any content, the content of the before and after attributes will also not be displayed.

escape:

Adds an escape character before quotation marks in the output. The attribute makes it easier to process the tag-produced content when using JavaScript.

Allowed values: true/false. The default value is false.

or:

Defines alternative content that is displayed if the tag itself does not produce any content.

Allowed values: text that may contain HTML and Interface markup.

E.g. or:'Content not found.'