# Templates

Templates are the backbone of your theme's structure, providing the necessary layout and logic for each page type. They determine the overall structure and appearance of different pages in your online store. In a CocoShop theme, templates are Liquid files that are located in the templates directory.

## Page Templates

CocoShop provides a set of default page templates for various types of pages, such as product pages, collection pages, and blog pages. Each template corresponds to a specific type of content in your store, allowing you to maintain a consistent design throughout your site.

To create a custom template for a specific page type, you can create a new Liquid file in the `templates` directory. The file should have a name that reflects the purpose of the template (e.g., `product.liquid` for a product page).

Here's a list of some common page templates in CocoShop:

| Type                                                                             |                                                                                 |
| -------------------------------------------------------------------------------- | ------------------------------------------------------------------------------- |
| [index](/cocoshop-theme-development/architecture/templates/index.md)             | The home page of your online store                                              |
| [product](/cocoshop-theme-development/architecture/templates/product.md)         | The product detail page                                                         |
| [collection](/cocoshop-theme-development/architecture/templates/collection.md)   | The collection page, displaying a list of products within a specific collection |
| [collections](/cocoshop-theme-development/architecture/templates/collections.md) | Collection List page that displays a list of collections in the store           |

## Template Components

Templates can include various components such as sections, and snippets. These components help you build a flexible and modular architecture for your theme.

* **Sections**: Sections are reusable, customizable parts of a template that can be managed through the theme editor. You can include a section in your template using the `section` tag, e.g., `{% section 'header' %}`. See [Section](/cocoshop-theme-development/architecture/section.md) page for details.
* **Snippets**: Snippets are reusable pieces of code that can be included in templates or other snippets using the `render` tag, e.g., `{% render 'snippet-name' %}`. Snippets can be found in the `snippets` directory and are useful for organizing and reusing common elements across multiple templates.

When developing your theme, it's important to consider the organization and structure of your templates and components. This will help ensure that your theme is easy to maintain and customize in the future.<br>


---

# 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://cryptococo.gitbook.io/cocoshop-theme-development/architecture/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.