> For the complete documentation index, see [llms.txt](https://webibazaar.gitbook.io/lyra-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://webibazaar.gitbook.io/lyra-documentation/collection-filter-color-swatch-from-metaobject.md).

# Collection filter color swatch from metaobject

{% embed url="<https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da>" %}

#### Display the color swatch using the metaobject in the collection filter, follow the steps below

* From your Shopify admin, go to **Settings** > **Custom data.**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FZMfWl5fFdqHuQGEX4Vn4%2Fhttps-files-gitbook-com-v0-b-gitbook-x-prod-appspot-com-o-spaces-2FUEBGZ0ypDJpAB41jYu9K-2Fuploads-2F1a9XZM1vtLB8p4jikc6Y-2Fcol-setting-png-alt-media-token-e24d5df6-b2e2-4bc4-b924-30b6dab37919-1912%C3%97875--06-04-2025_11_1.png?alt=media&amp;token=13320b6b-647e-4f2a-9b31-f77ed0ab002e" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FYnwYyQbdDWe0Rup4j0ba%2Fmeta-collection.png?alt=media&amp;token=52bc27da-b5fb-428c-ba18-a1de14438ac5" alt=""><figcaption></figcaption></figure>

Click on "**Add definition".**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FVdHK2DD7WqVqzhFIYVXi%2Fmeta2.png?alt=media&amp;token=3d92b198-b365-4ba6-bc36-4bdd73151efc" alt=""><figcaption></figcaption></figure>

Add the desired name if needed and Add field.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FCkZ6pNMAgzOX5QowO4UO%2Fmeta4.png?alt=media&amp;token=27429762-929d-42dc-90ff-fef3150979b7" alt=""><figcaption></figcaption></figure>

Select **File** type.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2F92b68LHSaTUvTO0VigbT%2Fmeta5.png?alt=media&amp;token=34848ea1-d924-4383-9649-4e2a0ce0a30c" alt=""><figcaption></figcaption></figure>

Add the desired name if needed and Accept all file types, then click on **Add** button.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FHv805jIYQdGgFXSHZMrK%2Fmeta6.png?alt=media&amp;token=12d8a7bc-941a-4a0f-8a10-41dc25d16715" alt=""><figcaption></figcaption></figure>

To add a second field, click on '**Add Field**' again.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FoJFx1NJrEgswRIbPfdXq%2Fmeta7.png?alt=media&amp;token=fefcb2cf-cb23-46f1-918b-ef8ada0ac4fd" alt=""><figcaption></figcaption></figure>

Click on "Single line text".

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2F7wh0CVIuvo4kZeMwumEg%2Fmeta8.png?alt=media&amp;token=f23f8165-827c-4d61-b532-76322cefe1da" alt=""><figcaption></figcaption></figure>

Add the desired name if needed and click on "Use as filter in metaobject index", then click on **Add** button.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FaB4l2ZNIHwA8Qqbadxn8%2Fmeta9.png?alt=media&amp;token=22ca6ae0-c9cc-4c5b-962a-3a6258ee8a17" alt=""><figcaption></figcaption></figure>

The metaobject fields you created will be displayed. Then click 'Save'.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FRSEFvqPzyqemIH1vOsLl%2Fmeta3.png?alt=media&amp;token=f7efb3be-490c-4205-bdd6-a63a614ba369" alt=""><figcaption></figcaption></figure>

From your Shopify admin, go to **Settings** > **Custom data > Products.**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FuEDh1ttEzHeu5cWZiOW9%2Fmeta1.png?alt=media&amp;token=6d86ad8a-64b2-44fc-bb85-46e0d777be35" alt=""><figcaption></figcaption></figure>

Click on "**Add definition**".

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FpabdWd16IHyfPtbjsVl1%2Fmeta4.png?alt=media&amp;token=0542afaa-ae25-4988-9261-88ea90c72895" alt=""><figcaption></figcaption></figure>

Add the desired name if needed. The name you add here will be displayed in the collection page filter. then click on Select type.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FfrJjwmtFZeto59s1GWZ2%2Fmeta5.png?alt=media&amp;token=54c7ce50-6ca1-40a6-9eb1-a85154c9f4f4" alt=""><figcaption></figcaption></figure>

Click on "**Metaobject**".

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2F7jAQcy6eLyMqCZvnhNRD%2Fmeta14.png?alt=media&amp;token=2cb9eb68-6080-4dad-ae54-7b802d091846" alt=""><figcaption></figcaption></figure>

Select the "**Reference**".

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FfS4r8aO3lJrpmQFFIiLF%2Fmeta15.png?alt=media&amp;token=54c31642-81bc-43d1-b561-c013bf132cb2" alt=""><figcaption></figcaption></figure>

Click on created metaobject, then select the "List of entries" and **Save**.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FyqWl6zrypoh6JAHjI4hn%2Fmeta16.png?alt=media&amp;token=5da47a91-31b3-4a8e-bbf9-0e8134cc277b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FcPQGZAA39lLEFXflAVRF%2Fmeta6.png?alt=media&amp;token=8e5a9c1a-c23c-4d70-ab4c-dee6a9e6676c" alt=""><figcaption></figcaption></figure>

From your Shopify admin, go to **Content > Metaobjects.**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FQAT773b62oCBo2KsaEIs%2Fmeta18.png?alt=media&amp;token=2cd8d2bc-f5e6-4ade-befd-0bd3138efaa6" alt=""><figcaption></figcaption></figure>

Click on "Add entry".

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FDOZfGe7mM4slbNHJWk0B%2Fmeta19.png?alt=media&amp;token=91eaf12d-2bf3-49d5-93e6-5522466a9113" alt=""><figcaption></figcaption></figure>

Select the image you want to display in the color swatch filter and add a label, Then Save.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FmCfg1XNmV41XhYldb1Ct%2Fmeta20.png?alt=media&amp;token=d6b80e6a-32cf-43a8-b641-7a9f9e855f24" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FsTokKwqHLvpnNcCq9958%2Fmeta21.png?alt=media&amp;token=1f8a7a0f-3968-4068-a613-6db7afa7c7c5" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FeZUgPMlQC2DzIFFwYLw8%2Fmeta22.png?alt=media&amp;token=b5a29979-7a6f-4c90-83f7-a4d53cee3a57" alt=""><figcaption></figcaption></figure>

Install the "**Search & Discovery**" app and open it.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FpQxgVdxajSbIPDZ30Kjk%2Fmeta23.png?alt=media&amp;token=fb1f57c0-01d2-4b94-a425-2b3c0fd255f5" alt=""><figcaption></figcaption></figure>

Click on "Filters" and Add filter.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FLg7PvLl60qkkMzrVHIjP%2Fmeta24.png?alt=media&amp;token=66e11b13-77b5-4d9e-b433-d5c9aa7f950f" alt=""><figcaption></figcaption></figure>

Select the source.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FbZO2r1LmQZGOkonyTRQH%2Fmeta25.png?alt=media&amp;token=dd4f8589-3f74-4d57-bac4-fdd6b5b7b7cd" alt=""><figcaption></figcaption></figure>

Select the metafield for the name that you created in the product here and Save.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FIM4qnh4Kvy1ngSgQPfV3%2Fmeta26.png?alt=media&amp;token=a0ed1ae0-c5de-4fcb-812d-510b60f08759" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FdimzQkXXwwY9F2YeZQmq%2Fmeta27.png?alt=media&amp;token=1c91ea07-25dc-4d1f-b03f-cd2481359267" alt=""><figcaption></figcaption></figure>

From your Shopify admin, go to **Products** and select any one product.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FsUuQbofN2PE1oEVceTla%2Fmeta28.png?alt=media&amp;token=e2cb845b-8b8a-4308-a42c-4badc26620ff" alt=""><figcaption></figcaption></figure>

Select the entry you added in the metaobject under the content section here and Save.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FhwV83CNZKb9FdyIjhkVG%2Fmeta29.png?alt=media&amp;token=03214ee5-d5fa-474d-b365-47fb20e62113" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FyTYgoXrRrmdknu5BOnvN%2Fmeta30.png?alt=media&amp;token=2b75eb40-413b-4ef6-a218-2dcd8d24fd06" alt=""><figcaption></figcaption></figure>
