# How to create and use Templates?

This page explains about - "How to create and use Templates in Siteoly?"

{% hint style="warning" %}
This is only available in Enterprise Plans. Enterprise plans supports upto 10K cards/detailed pages. Please contact us to setup Enterprise plan.
{% endhint %}

The concept of 'Templates' will help users to create **html/markdown/css/javascript** templates that can be used inside 'DetailedPages' in Siteoly.

Instead of repeating the same content inside DetailedPages and bloating the sheet, now you can create repeatable content that is used across multiple 'DetailedPages' into a template that can be used with simple short codes in Detailed Pages.

Templates usually have **html/markdown/css/javascript** content with placeholders for certain variables.

For example, if you want to display below content on various pages in Siteoly, you can create a template with below content.

```
<h3> {{city}} in {{country}} has a population of 
{{population}} in {{area}} square miles </h3>
```

To embed this template in a DetailedPage, enter below short code in DetailedPage by passing the required data. **Note that the short code can be used along with any other existing content in Detailed Pages. Multiple short codes can be also used in same Detailed Page**.

```
[sly-template @template-id="CityTemplate" @city="New York" 
@country="United States of America" 
@population="8,336,817" 
@area="302.6"]
```

This translates the template automatically into html as below.

#### New York in United States of America has a population of 8,336,817 in 302.6 square miles

Here is the sample Google sheet to look at. (Make your own copy by copying the sheet to easily expand cell content and see the data in the sheet)

* [Google Sheet Link](https://docs.google.com/spreadsheets/d/1t3Qwa6vFkAWUGwRe6y1Iw5PV3au3bdmSoMjMfA-TL38/edit#gid=1489117852)
* Sample [Detailed Page link](https://templatedemo.siteoly.com/sample-detailed) from the above Template setup

Follow the below steps if you don't have 'Templates' sheet inside your Google sheet.

1. Add a new sheet next to 'DetailedPages' sheet (You can add it anywhere as well but adding it next to 'DetailedPages' sheet will make it easy to make changes)
2. Name the newly created sheet as "Templates"
3. In the new 'Templates' sheet, name the first row's Column A as 'Template Id' and Column B as 'Template Content'. (It should look like as below image) - You can also see this [Google Sheet Link](https://docs.google.com/spreadsheets/d/1t3Qwa6vFkAWUGwRe6y1Iw5PV3au3bdmSoMjMfA-TL38/edit#gid=1489117852) for reference.&#x20;

![](/files/-MZBpgtnJb7r9HlFh_Ld)

Once this setup is completed, you can start adding multiple templates and map the variables as needed in the short code.

Here is a short code for above sample setup that can be used in 'DetailedPages'.&#x20;

```
[sly-template @template-id="CityTemplate" @city="New York" 
@country="United States of America" 
@population="8,336,817" 
@area="302.6"]
```

**Make sure you append '@' before every parameter as above.**

Note that the short code is supported in two columns in  'DetailedPages'&#x20;

* Column D (Markdown/HTML) - The content inside Detailed Pages Body
* Column G (Javascript/CSS in Head Tag) - The content inside Detailed Pages \<head> tag. (See [here for more information](https://help.siteoly.com/advanced/embed-extra-html-css-scripts-into-detailed-page-header-for-specific-detailed-pages) about content inside \<head> tags in Detailed pages)

{% hint style="info" %}
Note that you need to escape @ and = characters inside the short code if used inside parameter value.

* If you want to use @ inside parameter value, use \\@ instead of just @
* If you want to use = inside parameter value, use \\= instead of just =

{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.siteoly.com/advanced/how-to-create-and-use-templates.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
