{"id":314,"date":"2023-11-21T16:44:24","date_gmt":"2023-11-21T16:44:24","guid":{"rendered":"http:\/\/localhost\/wordpress_ragnokdocs\/?p=314"},"modified":"2025-03-20T17:37:50","modified_gmt":"2025-03-20T17:37:50","slug":"banner-image","status":"publish","type":"post","link":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/banner-image\/","title":{"rendered":"Banner Image"},"content":{"rendered":"\n

The Ragnok <\/strong>theme supports the ragnok.banner_image<\/strong> metafield<\/a> on products. <\/p>\n\n\n\n

We use this field to allow you to add a banner image<\/strong> to your collections that can be displayed on collection pages.<\/p>\n\n\n\n

Below, you will find information on how to create the banner image metafield, how to add a banner image to a collection and display it:<\/p>\n\n\n\n

    \n
  1. Creating the Banner Image metafield<\/a><\/li>\n\n\n\n
  2. Adding a banner image to a collection<\/a><\/li>\n<\/ol>\n\n\n\n
    \n\n\n\n

    1. Creating the Banner Image metafield<\/h2>\n\n\n\n

    a) From your Shopify admin, go to Settings<\/strong> > Custom data<\/strong>.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    b) Select Collections<\/strong> and click Add definition<\/strong>.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    c) In the Name<\/strong> field, enter “Banner Image<\/strong>“.<\/p>\n\n\n\n

    d) In the Namespace and key<\/strong> field, enter “ragnok.banner_image<\/strong>“.<\/p>\n\n\n\n

    e) In the Description<\/strong> field, enter “Displayed in collection pages banner if the option is enabled when customizing the page.<\/strong>“<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    f) Click Select type<\/strong>, and then select “File<\/strong>“.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    g) Under Accept specific file types<\/strong>, leave only Images <\/strong>enabled.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    h) Click Save<\/strong> to create the Banner Image<\/strong> metafield.<\/p>\n\n\n\n

    \n\n\n\n

    2. Adding a banner image to a collection<\/h2>\n\n\n\n

    After creating the banner image metafield<\/a>, you will notice that a new field is now available in your collections:<\/p>\n\n\n\n

    a) From your Shopify admin, go to Collections<\/strong> and click on the collection <\/strong>you want to add a banner image to.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    b) Scroll to the bottom of the page, you will see a Metafields<\/strong> section and the Banner Image<\/strong> metafield will be available, click on it to edit collection banner image.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    c) Click on Select image <\/strong>and select your desired banner image.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    d) After entering your desired banner image for this collection, click Save<\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"

    The Ragnok theme supports the ragnok.banner_image metafield on products. We use this field to allow you to add a banner image to your collections that can be displayed on collection pages. Below, you will find information on how to create the banner image metafield, how to add a banner image to a collection and display it: […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[35,38],"tags":[],"class_list":["post-314","post","type-post","status-publish","format-standard","hentry","category-collection","category-metafields"],"_links":{"self":[{"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/posts\/314","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/comments?post=314"}],"version-history":[{"count":2,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/posts\/314\/revisions"}],"predecessor-version":[{"id":1077,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/posts\/314\/revisions\/1077"}],"wp:attachment":[{"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/media?parent=314"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/categories?post=314"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/odindesignthemes.com\/ragnokthemedocs\/wp-json\/wp\/v2\/tags?post=314"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}