Asset Plugin

The asset plugin gives you access to various functions that interact with the Assets Library.

asset:css

{{ asset:css file="theme::styles.css" file_min="theme::styles.min.css" group="global" }}

Adds a stylesheet to a specific group. Returns empty.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.css of the file
file_min	None	No	The namespace::filename.css for the minified version of the file, if available.
group	None	No	The group you wish to add the file to. If empty, it will be added and rendered with the global group.

Example

Adding a new file to a specific group

{{ asset:css file="theme::products.css" group="page" }}

Returns:

(empty) Adds the stylesheet to the 'page' group which will need to be rendered later.

asset:css_inline

{{ asset:css_inline }}
	#content { background: red }
{{ /asset:css_inline }}

Add inline CSS to be output later. Inline CSS is not grouped so everything will be added to the same global group. Also, inline CSS is not output automatically like the rest of the assets. You will need to use asset:render_css_inline to output the CSS.

asset:css_url

{{ asset:css_url file="theme::styles.css" }}

Returns the full file URL to a CSS asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.css of the file

Example

Returning the full file URL

{{ asset:css_url file="theme::styles.css" }}

Returns:

http://www.domain.com/system/cms/themes/default/css/style.css

asset:css_path

{{ asset:css_path file="theme::styles.css" }}

Returns the file path to a CSS asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.css of the file

Example

Returning the file path

{{ asset:css_path file="theme::styles.css" }}

Returns:

/system/cms/themes/default/css/style.css

asset:js

{{ asset:js file="core::actions.js" file_min="core::actions.min.js" group="global" }}

Adds a JavaScript file to a specific group. Returns empty.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.js of the file
file_min	None	No	The namespace::filename.js for the minified version of the file, if available.
group	None	No	The group you wish to add the file to. If empty, it will be added and rendered with the global group.

Example

Adding a new JS file to a specific group

{{ asset:js file="theme::rotator.js" group="effects" }}

Returns:

(empty) Adds the JavaScript file to the 'effects' group which will need to be rendered later.

asset:js_inline

{{ asset:js_inline }}
	alert('Welcome to our site');
{{ /asset:js_inline }}

Add inline JS to be output later. Inline JS is not grouped so everything will be added to the same global group. Also, inline JS is not output automatically like the rest of the assets. You will need to use asset:render_js_inline to output the JS.

asset:js_url

{{ asset:js_url file="theme::rotator.js" }}

Returns the full file URL to a JavaScript asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.js of the file

Example

Returning the full file URL

{{ asset:js_url file="theme::actions.js" }}

Returns:

http://www.domain.com/system/cms/themes/default/js/actions.js

asset:js_path

{{ asset:js_path file="theme::actions.js" }}

Returns the file path to a JavaScript asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.js of the file

Example

Return the file path

{{ asset:js_path file="theme::actions.js" }}

Returns:

/system/cms/themes/default/js/actions.js

asset:image

{{ asset:image file="theme::icon.png" alt="Icon Image" }}

Outputs an <img> tag for the specified file.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.ext of the file
alt	None	No	The alt attribute for the image tag
attribute="value"	None	No	Allows you to have additional attributes, passed in like so: class="something" id="content"

Example

Adding an image to the page

{{ asset:image file="theme::logo.jpg" alt="Company Logo" }}

Returns:

<img src="http://www.domain.com/system/cms/themes/default/img/logo.jpg" alt="Company Logo" />

Adding an image with additional attributes

{{ asset:image file="theme::george.jpg" alt="George Costanza" id="george_costanza" class="person_img" }}

Returns:

<img id="george_costanza" class="person_img" src="http://www.domain.com/system/cms/themes/default/img/logo.jpg" alt="George Costanza" />

asset:image_url

{{ asset:image_url file="theme::under_construction.gif" }}

Returns the full file URL to an image asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.ext of the file

Example

Returning a full file URL

{{ asset:image_url file="theme::foobar.gif" }}

Returns:

http://www.domain.com/system/cms/themes/default/img/foobar.gif

asset:image_path

{{ asset:image_path file="theme::flame.png" }}

Returns the file path to an image asset.

Attributes

Name	Default	Required	Description
file	None	Yes	The namespace::filename.ext of the file

Example

Returning a file path

{{ asset:image_path file="theme::flame.png" }}

Returns:

/system/cms/themes/default/img/flame.png

asset:render

{{ asset:render group="global" }}

Renders the requested group (CSS and JS) and returns the output tags.

Attributes

Name	Default	Required	Description
group	None	Yes	The group name

Example

Rendering CSS and JS of custom group

{{ asset:render group="effects" }}

Returns:

(HTML tags for CSS & JS of 'effects' group)

asset:render_css

{{ asset:render_css group="modal" }}

Renders the requested group CSS and returns the output tags.

Attributes

Name	Default	Required	Description
group	None	Yes	The group name

Example

Rendering CSS of custom group

{{ asset:render_css group="modal" }}

Returns:

(HTML tags for CSS 'modal' group)

asset:render_css_inline

{{ asset:render_css_inline }}

Render any inline CSS previously set with asset:css_inline or Asset::css_inline().

asset:render_js

{{ asset:render_js group="validation" }}

Renders the requested group JS and returns the output tags.

Attributes

Name	Default	Required	Description
group	None	Yes	The group name

Example

Rendering JS of custom group

{{ asset:render_js group="validation" }}

Returns:

(HTML tags for CSS 'validation' group)

asset:render_js_inline

{{ asset:render_js_inline }}

Render any inline JS previously set with asset:js_inline or Asset::js_inline().