How do I add a banner in a collection?

Callout banners are a great way to feature special promos within collection or search result pages.

Setting up the Callout

  1. In the left-hand navigation, go to Merchandising. Under Callouts, click Manage.

  2. Click Add Callout.

  • In the left-hand navigation, go to Merchandising. Under Callouts, click Manage.

  • Click Add Callout.

  • Enter the required details on the screen:

    • Name, Link, and Type are mandatory.

    • For the Link, ensure the URL is entered in the following format: /collections/sale

    • Type options:

      • Standard The asset will appear in your collection exactly as uploaded.

      • Auto Fill Auto Fill places an asset at the end of the collection based on the amount of empty space remaining after the last product image, helping reduce unused space in the grid. When using Auto Fill, you can create multiple size variations of the same asset. Reactify will automatically select and place the asset that best fits the available space.

  • The following fields are optional and will require front-end development if you wish to use them:

    • Title

    • Content

    • Text Colour

    • Background Colour

  • Alternatively, you can upload image or video assets instead of using styled fields.

  • In the Media section, add links to your asset files. You can:

    • Choose between image or video

    • Upload separate desktop and mobile versions

  • Ensure your artwork dimensions match your product image dimensions. This will allow callout banners to sit flush within the product grid.

Attaching the Callout to your collection

  • Within your Collection, click Callouts and select the banner you want to display.

Last updated