> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kwebby.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Departments

> A grid of department tiles, each a collection with a photo, its product count and a few sub-links.

![Departments on the storefront](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/departments.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=deae2b22124cbcd1eb895898a6849de8)

Departments, highlighted with the demo content

![Departments in dark mode](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/departments-dark.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=76cbc2403c5f1918d38f614e252b3761)

Departments in dark mode

## Where to find it

Fourth section of the Home page template. In the theme editor choose Home page in the page selector, then select Departments. Add it to other pages with Add section.

## How it works

* Each Department block is a tile with a small square photo, the title and the number of products, linking to its collection.
* The title is the block's Heading, else the collection title. The photo is the block's Image, else the collection image, else the photo of the collection's first product.
* The count is the total number of products in the collection, sold out ones included. It shows when Show product counts is on and the collection has products.
* Sub-links come from the block's Sub-links menu. Without one, Kelvin looks in the section's Sub-links menu for the item that links to the block's collection and shows that item's child links. Sub-links per department caps them (1 to 6).
* Link label shows a link beside the heading, to Link or, when Link is empty, to the list of all collections.
* Four tiles per row, two below 1000 px. On phones the tiles stay two per row but drop the count and the sub-links.
* A block without a collection shows a Department placeholder that links to all collections.

![Departments in the theme editor](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/editor-departments.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=140f4637b0190ecddc9ba93c07c4e48d)

In the theme editor: 1 the section in the sidebar · 2 its settings · 3 the section in the preview

## Edit it

* Add a Department block per main collection (up to 12) and choose its Collection. Eight or twelve tiles fill the rows evenly.
* Use square Images with the product on a plain background: the tile shows them small.
* For sub-links with no extra work, choose your main menu as the section's Sub-links menu. Each department then shows the child links of its menu item.
* Give a block its own Sub-links menu for a different list, such as the most-used subcategories.
* Shorten long collection names with Heading, such as Cases and cooling.

## Settings

| Setting | What it does |
| - | - |
| **Heading** | Text. Default: Shop by department. |
| **Link label** | Text. Default: Shop all collections. |
| **Link** | Link: a page, product, collection or web address. Leave empty to link to the list of all collections. |
| **Show product counts** | On or off. Default: on. |
| **Sub-links menu** | Choose a menu. Optional. A department without its own menu shows the child links of the item in this menu that links to its collection. |
| **Sub-links per department** | Slider from 1 to 6. Default: 3. |
| **Color scheme** | Color scheme for this area (edit the schemes in Theme settings → Colors). Default: Scheme 1. |

## Blocks

Up to 12 blocks. Add a block with **Add block** under the section in the sidebar; drag blocks to reorder them.

### Department

| Setting | What it does |
| - | - |
| **Collection** | Choose a collection. |
| **Heading** | Text. Leave empty to use the collection title. |
| **Image** | Image: upload one or choose from Content → Files. Leave empty to use the collection image. |
| **Sub-links** | Choose a menu. A menu whose links show under the department, such as its subcategories. |

> [!NOTE]
>
> On install the eight Department blocks have no collections, so the store shows Department placeholders until you choose them.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.