# Sections, blocks & templates

How Techno builds pages from templates, section groups, sections and blocks, and where each section can be used.

Every page in Techno is a template. A template is a stack of sections. Some sections hold blocks, which you can add, reorder and remove. Once you know those parts, you can find any setting in the theme editor.

## The parts of a page

| Part | What it is | Where you edit it |
| --- | --- | --- |
| Template | The layout for one kind of page: home, product, collection, cart and so on. | The page picker at the top of the theme editor |
| Section group | Sections that appear on every page. Techno has two: Header and Footer. | The Header and Footer areas in the editor sidebar |
| Section | A full-width band of content. | Add, drag to reorder, hide or remove in the sidebar |
| Block | A piece of content inside a section, such as a price, a button or a menu column. | Under the section in the sidebar |

A page is laid out like this:

```
Header group
├─ Announcement bar        ← optional, from Add section
└─ Header                  ← one section, with status strip and menu promo blocks
Template (Product)
├─ Product                 ← main section
│  ├─ Product metadata     ← block
│  ├─ Title                ← block
│  ├─ Price                ← block
│  └─ …
├─ Product recommendations ← "Pairs well with"
└─ Product recommendations ← "You may also like"
Footer group
└─ Footer                  ← one section, with column blocks
Cart drawer                ← on every page, outside the groups
```

## Main sections

Each template has a main section that shows the page's own content: the product, the collection, the article. You can't remove the main section, but you can add other sections above or below it.

| Template | Main section | Blocks you can add |
| --- | --- | --- |
| Home page (`index`) | none (all sections are optional) | n/a |
| Product | Product | Product metadata, Product vendor, Title, Price, Inventory, Variant picker, Description, Buy buttons, Pickup availability, Spec table (with Spec rows), the general blocks, generated blocks, app blocks |
| Collection | Collection | none |
| Collections list (`list-collections`) | Collections grid | none |
| Search | Search | none |
| Cart | Cart | none |
| Blog | Blog | none |
| Article | Article | Breadcrumb, Title, Byline, Featured image, Content, Tags, Share, the general blocks, generated blocks |
| Page | Page | Fact |
| Comparison page (`page.compare`) | Compare | Spec table (with Spec rows) |
| Contact page (`page.contact`) | Contact form | Menu column, Text |
| 404 | 404 page | none |
| Password | Password | none |
| Gift card | Fixed layout, not editable in the theme editor | n/a |

## Sections you can add

These sections can be added from **Add section**. Some are limited to certain templates or kept out of the header and footer.

| Section | Available on | Not available in |
| --- | --- | --- |
| Announcement bar | The Header group only | Templates, Footer |
| Hero | Home page only | n/a |
| Slideshow | Home page, pages and collection pages | Other templates, Header, Footer |
| Featured collection | Any template | Header, Footer |
| Featured product | Any template | Header, Footer |
| Kits | Any template | Header, Footer |
| Image with text | Any template | Header, Footer |
| Schematic | Any template | Header, Footer |
| FAQ | Any template | Header, Footer |
| Rich text | Any template, and the Footer | Header |
| Icon row | Any template, and the Footer | Header |
| Logo list | Any template, and the Footer | Header |
| Blog posts | Any template | Header, Footer |
| Newsletter | Any template, and the Footer | Header |
| Custom Liquid | Any template, and the Footer | Header |
| Product recommendations | Product template only | n/a |
| Collections grid | Collections list template only | n/a |

See [Building pages](../building-pages/home-page.md) for how to use each one.

## Two kinds of blocks

Most blocks belong to one section and only appear in that section's **Add block** menu. The Hero's Stat block and the Header's status strip and Menu promo blocks are examples.

The Product, Featured product, Article, Rich text, FAQ and Footer sections use **theme blocks** instead. Theme blocks are shared: the same Price block appears in both the Product section and the Featured product section, with the same settings. Blocks that show product data read the product of the section they're in.

Theme blocks come in two groups:

* **General blocks:** Eyebrow, Heading, Text, Button, Collapsible row and Custom Liquid. They don't depend on a product or article, so the Product, Featured product, Article, Rich text and Footer sections all offer them, and so does the section Shopify creates for a generated block. The FAQ section offers only Collapsible row, since each of its blocks is a question.
* **Blocks for one kind of section:** product blocks such as Price and Buy buttons in Product and Featured product, article blocks such as Byline and Share in Article, and the Newsletter, Menu column, Text column and Social media blocks in Footer. Each appears only in the sections it works in, so the footer never offers Buy buttons and Rich text never offers Byline.

### AI-generated blocks

The Product, Featured product, Article, Rich text and Footer sections accept any theme block, so you can use **Generate** in their **Add block** menu to describe a block and have Shopify create it. A generated block inherits Techno's fonts and colors unless it sets its own, and sits in the section's column.

When you generate a block in a new section, Shopify places it in a section of its own. Techno styles that section like Rich text: the same spacing above it and between its blocks, across the page's content width.

## Alternate templates

You can create more than one template for the same page type. For example, a second product template without the spec table, for gift cards or accessories:

1. In the theme editor, open the page picker and choose **Products › Create template**.
2. Name it, base it on the default product template, and change what you need.
3. In Shopify admin, open a product and choose the new template under **Theme template**.

The contact page works the same way: Techno ships a `page.contact` template with the contact form. Assign it to your Contact page in **Online Store › Pages**.

## App blocks

The Product and Featured product sections accept app blocks, for things like reviews or size guides from apps you've installed. Add them from **Add block › Apps**. For apps that need a full section, add a Custom Liquid section and paste the app's code. See [Custom code](../developer-platform/custom-code.md).

## Recipes

### A product template without specs

* Page picker › Products › Create template: "accessory"
* Product section › Spec table block: remove
* Product section › Add block: Collapsible row, "Heading": "What's in the box"

### A landing page for one product

* Page picker › Pages › Create template: "launch"
* Add section: Featured product, "Product": your launch product
* Add section: Image with text
* Add section: Newsletter

## See also

* [Colors & palettes](theme-styles-and-color.md): the palette every section uses
* [Sections reference](../reference/sections.md): every section setting
* [Blocks reference](../reference/blocks.md): every block setting
