How To: Display Different Banners for Different Category Pages

To display a specific banner for each category page:

Step 1. Create Banners

  1. In the Admin panel, go to Marketing → Banners and click + Add banner in the upper right corner:

    Press + Add banner

    Important

    If there is no such section, make sure that the Banners management add-on has an Active status in the Add-ons → Downloaded add-ons section.

  2. In the dialog:

    • Enter the Name of the banner.

    • In the Type field, select Graphic banner.

    • Upload the banner image.

    • Tick the Open in new window option to open the attached link in a new window/tab (available for graphic banners only).

    • In the URL field, enter the link that opens when a user clicks the banner.

      Configure the new banner
  3. Press Create.

  4. Repeat these actions to create banners for other categories.

Step 2. Create a Block for Banners

  1. Go to Website → Themes → Layouts and select the Categories page.

  2. Click + in the desired container and click Add block.

  3. Open the Create New Block tab and select Banners:

    Create a new Banners block
  4. In the section:

    • Specify the name of the new block (e.g. Banners).
    • Select Original in the Template field.
    • Click Create.
  5. Click the gear icon on the created block and select:

    • The desired wrapper in the Wrapper field.
    • The desired CSS class in the User-defined CSS-class input field.
  6. Go to the Content tab and select Manually in the Filling select box.

  7. Click Save.

Step 3. Add Banners to Specific Categories

  1. In the Admin panel, go to Products → Categories and select the desired category.

  2. Open the Layouts tab on the category details page.

  3. Make sure that the Banners block is active.

    Layouts
  4. Click the gear icon to see the block options and open the Content tab.

  5. Click Add banners, select the desired banners, and click the Add banners and close button.

  6. Click Save.

  7. Repeat these steps for other categories.

See an example of a banner for the “Video Games” category. The corresponding category will open when you click the banner.

Layouts

Note

After the block is created or modified, make sure it is displayed correctly. Sometimes not all wrappers are suitable for all blocks types.