# Sidebar Filter

## Step 1:

![](/files/-MhmbnHs6zWxY7PA3Ub1)

## Step 2: Color filter

![](/files/-Mhmcny3juHhMT5Ve3Wj)

* **You need to add all the color names on the TAGS field for every single product**

![](/files/-Mhmd84B6xbWQ5yICzkH)

* **You must add the names of all the characters in the collection color settings field. The colors you put in the product's tag field**

![](/files/-MhmdI-m3ys-7dj1JS04)

## Step 3: Size filter

#### In the same way as adding color filters, you need to add the size filters

![](/files/-MhmgmzE5noSH4RPhoEv)

**You need to add all the size variant names on the TAGS field for every single product**

![](/files/-Mhmh4lNtm5tV0cYOufO)

**You need to put all size names to the size customizer field**

![](/files/-Mhmhv92q12rP5cdSn0C)

## Step 4:  **Vendor & Type Filter**

![](/files/-MhmiabXXnuDKxTO1a1w)

{% embed url="<https://youtu.be/JAk0LRTlibA>" %}

## Step **5**: **Custom Menu**

* **You need to create a navigation menu.** Then you can add the navigation for the custom menu.
* **You can add any collection link or any link.**

![](/files/-MhmjKU3wJEbsYC7byw2)

## Step 6: Topbar filter Widget

![](/files/-Mhmk9hbvW1xn9vXP0x8)


---

# 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://lezada.docs.hasthemes.com/collections/collection-page/sidebar-filter.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.
