> 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-page/collection-banner-using-metafield.md).

# Collection banner using metafield

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

## Adding metafield definition <a href="#adding-metafield-definition" id="adding-metafield-definition"></a>

Before you can add Collection image(metafield value) to specific collections, you need to add the necessary metafield definition for this information.

{% hint style="info" %}
**Recommendation Size**\
Collection image desktop size: 500x500\
Slideshow image mobile size: 1920x650
{% endhint %}

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

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FdiAqalFh7Q9vRqFCNywD%2Fcoll-banner-setting.png?alt=media&amp;token=3eeab950-151e-4d8e-b5b7-beeff795c9a4" 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>

2. Click **Add definition**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FKzFvVcTV0BcvyIRP3cWl%2Fcoll-banner2.png?alt=media&amp;token=1b6540fb-53ef-455d-bfd5-2fc53d02b060" alt=""><figcaption></figcaption></figure>

3. In the **Name** field, enter `Collection image.`In the **Namespace and key** field, enter `custom.collection_image`

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FloOOdpw4ssQzIgS7lbxU%2Fcoll-banner3.png?alt=media&amp;token=a150c215-c99f-4f72-b147-1c523c04487a" alt=""><figcaption></figcaption></figure>

4. Click **Select type** then select **File.**

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2F2aEUK4h9X8KKyN8FTU6k%2Fcoll-banner4.png?alt=media&amp;token=219a5cb5-98aa-4f1f-a517-f0c3fff1ab9c" alt=""><figcaption></figcaption></figure>

5. Than select **Accept all file types.**
6. Click **Save** to save the definition.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FADreeZ5vO3pU34192yYs%2Fcoll-banner5.png?alt=media&amp;token=2342920c-bbf6-42ee-bcac-3e4662b4dd4c" alt=""><figcaption></figcaption></figure>

7. You should see the **Collection image** in the list of definitions by now.

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FcSryWmbnWBk23OBBEJUU%2Fcoll-banner6.png?alt=media&amp;token=208ffe3a-c641-4ea3-a3ef-69c16af798a5" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FKN8tG9pnfn9jWMPlB5XY%2Fselect%20collection%20banner%20meta.png?alt=media&amp;token=5353c10b-0228-4853-81d2-8415bf55130a" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3128577213-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUEBGZ0ypDJpAB41jYu9K%2Fuploads%2FgDOFWScP9NvdX5bQcCEF%2Fdisplay%20selected%20image.png?alt=media&amp;token=5c83640b-9f4d-47d6-ba9e-4fceb73274d7" alt=""><figcaption></figcaption></figure>
