# How to add a new template?

### Add with admin builder feature.

**Step 1:** access **/settings/templates**

**Step 2:** Click the button to clone a template available

![](/files/-MkjD7NzMtIFAhzYvzeu)

**Step 3:** Click **button builder** for build template

![](/files/-MkjDCMbypFcHW8hAASo)

### Adding templates with your HTML and CSS code

*This is a guide for programmers. You need HTML and CSS skills to understand it.*

#### **Struct template HTML and CSS**

![](/files/-MkjJc4aBoNdCEznNBj_)

#### Some Rule for CSS and HTML to **fit with the builder**

**General**: \
\- Use **Bootstrap 4.5** default and **font-awesome 5.15** \
\- Separate CSS does not code in HTML\
\- Do not use a **background image and overlay** it will not work with the builder\
\- Don't use **"important attribute"** for **CSS**. The user can't change style in the builder

Use code bellow for set **background image**

```
#id {
    background: url (##image_url##image.jpg) rgba (0, 0, 0, .7);
    background-size: cover;
    background-blend-mode: multiply
}
```

**Upload new image:**

```
#Template HTML or CSS: ##image_url##yourimage.png => Upload yourimage.png to public/images/content_media

```

**Icon:** \
Do not use class **fa-2x fa-3x** (To increase size). Increase the size with CSS


---

# 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://docs.zillapage.com/frequently-asked-questions/how-to-add-a-new-template.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.