{% add_stylesheet %}

Use this tag to add a stylesheet to the current page

There are two ways to use this method. The first (and more common) is to include a linked stylesheet (<link rel="stylesheet" href="https://..." />) and the second is to include an inline stylesheet (<style>...</style>)

Linked Stylesheet Syntax

{% add_stylesheet
input
 
Input could evaluate to a stylesheet object, the guid of a stylesheet, the name of a stylesheet, or a URL. In order to add a stylesheet using a URL, you must use a fully-qualified URL, incuding the leading "http://", "https://", or "//".
attribute1:"add or edit other attributes"
 
This method will accept any number of parameters and evaluate them before including them as attributes of the link tag. You may also include reference variables, which will be dereferenced into their attribute names.
%}

All stylesheets added using this syntax will only be included in the document once, regardless of how many times they are added. This makes it safe to include stylesheets in sub-templates that may be included multiple times in a page.

Syntax for Inline Styles

{% add_stylesheet inline
unique_name
 
If included, only one inline stylesheet will be included for each unique_name. This makes it safe to add an inline stylesheet in one or more sub-templates which may be included multiple times in a page.
=
position:'[head|in_place|body]'
 
Determines where the stylesheet will be placed in the document.
head is the default and places the style tag in the document's <head> element. Note that this typically results in the best browser performance.
in_place outputs the style tag directly where the add_stylesheet method is located in the markup.
body places the style tag directly before the document's &lgt;/body> closing tag.
attribute1:"add or edit other attributes"
 
This method will accept any number of parameters and evaluate them before including them as attributes of the style tag. You may also include reference variables, which will be dereferenced into their attribute names.
%}
...code block...
{% end_stylesheet %}

The styles to be included in the inline style sheet will be evaluated from the code block similar to the {% capture %} method.

Examples

Add Stylesheet

Copy
{% add_stylesheet "Bootstrap" %}

Add inline stylesheet

Copy
{% add_stylesheet inline xxkr_footer_frompage %} //Use your imagination here! #footer { background-color: '{{entity.footer_background_color}}'; color: '{{entity.footer_text_color}}'; } {% end_stylesheet %}