Theme Plugin

The theme plugin gives you access to theme assets and partials. It is a critical and extremely useful plugin for building your sites with PyroCMS.

The theme plugin's slug is theme, so it can be used like so:

{{ theme:function }}

theme:options↑

Displays an option for the current theme. To read more about this tag and its usage refer to the theme documentation.

Attributes

Name	Default	Required	Description
option	None	Yes	Option slug to request from theme.

Example:

{{ if theme:options:layout == 'full-width' }}

    <div class="full-width">

        {{ template:body }}

    </div>

{{ endif }}

theme:partial↑

Loads partial from the current theme.

Attributes

Name	Default	Required	Description
name	None	Yes	Name slug of the theme to be loaded.

Example:

{{ theme:partial name="header" }}

theme:css↑

Generates a <link> to a css file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the css file.
type	text/css	No	The type attribute.
title	None	No	The title attribute.
media	None	No	The media attribute.
rel	stylesheet	No	The rel attribute.

Example:

{{ theme:css file="style.css" }}

Returns:

<link href="/addons/shared_addons/themes/default/css/style.css" type="text/css" rel="stylesheet" />

theme:css_path↑

Generates an absolute web path to a CSS file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the CSS file.

Example:

{{ theme:css_path file="style.css" }}

Returns:

/addons/shared_addons/themes/default/css/style.css

theme:css_url↑

Generates an absolute URL to a CSS file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the CSS file.

Example:

{{ theme:css_url file="style.css" }}

Returns:

http://example.com/addons/shared_addons/themes/default/css/style.css

theme:image↑

Generates an <img> tag for an image in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the image file.
misc	None	No	This function will take any other attributes and turn them into img HTML attributes.

Example:

{{ theme:image file="fun.jpg" alt="Fun!" }}

Returns:

<img src="/addons/shared_addons/themes/default/img/fun.jpg" alt="Fun!" />

theme:image_path↑

Generates an absolute web path for an image in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the image file.

Example:

{{ theme:image_path file="fun.jpg" }}

Returns:

/addons/shared_addons/themes/default/img/fun.jpg

theme:image_url↑

Generates an absolute web URL for an image in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the image file.

Example:

{{ theme:image_url file="fun.jpg" }}

Returns:

http://example.com/addons/shared_addons/themes/default/img/fun.jpg

theme:js↑

Generates a <script> link for a javascript file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the javascript file.

Example:

{{ theme:js file="extra.js" }}

Returns:

<script type="text/javascript" src="/addons/shared_addons/themes/default/js/extra.js"></script>

theme:js_path↑

Generates an absolute web path for a javascript file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the javascript file.

Example:

{{ theme:js_path file="extra.js" }}

Returns:

/addons/shared_addons/themes/default/js/extra.js

theme:js_url↑

Generates an asbolute web path for a javascript file in the current theme.

Attributes

Name	Default	Required	Description
file	None	Yes	Name of the javascript file.

Example:

{{ theme:js_url file="extra.js" }}

Returns:

http://example.com/addons/shared_addons/themes/default/js/extra.js

theme:favicon↑

Generates a <link> tag for a favicon file in the current theme.

Attributes

Name	Default	Required	Description
file	favicon.ico	No	Favicon file.
rel	shortcut icon	No	Favicon rel.
type	image/x-icon	No	Favicon type.
xhtml	true	No	Need a W3C valid link tag xhtml? Enter false if you use HTML5.
base	path	No	"path" or "url".

Example:

{{ theme:favicon file="favicon.png" }}

Returns:

<link href="/system/cms/themes/default/img/favicon.png" rel="shortcut icon" type="imagem/x-icon">

theme:variables↑

Sets or retrieves a variable for the theme of your choosing. Variables can be set in a layout and be used anywhere thereafter.

Attributes

Name	Default	Required	Description
name	None	Yes	Name of variable.
value	None	No	Value to set. Leave blank to retrieve a previously set variable.

Example (Variable Setting - nothing displayed):

{{ theme:variables name="day_or_night" value="day" }}

Example (Variable Retrieval):

{{ theme:variables name="day_or_night" }}

Returns:

day

theme:lang↑

Displays a language string from the current language for the theme of you choosing. Language files are typically stored in the theme folder.

Attributes

Name	Default	Required	Description
line	None	Yes	The array key of the language string that you wish to display.
lang	None	Yes	The language file that you wish to load. The file should store under /themes/[theme folder]/languages/[language code]/[language file]
default	None	No	The default value will be displayed when the language line returns false.

Example (Displaying a line "theme_title" from language "theme" file):

{{ theme:lang lang="theme" line="theme_title" default="PyroCMS" }}