Breadcrumbs

Creating a Tile View for Categories

You can first present your visitors with offer categories using images (tile view), allowing them to select a category, after which only the specific offers within that category will be displayed. We have created an example with a yoga page for you.

Yoga Demo Page
Category Tile View
Subpage Tile View
Offer Table within a Single Category

Instructions for Implementing the Tile Design

  1. In the Design Manager, copy an existing design using «New Design» and assign a suitable name to the copy (hereinafter referred to as Kachelansicht_main ). Ideally, select a design as the copy template that already incorporates many desired settings (e.g., an extended registration form). If no design has been created yet, please use the edoobox Start Design as the copy template.

  2. Now, set the Kachelansicht_main design as the default and assign it to no category.

    image-20240129-162017.png

    3. In the Kachelansicht_main design, within the «Offer Overview» template, drag the «Category Tiles» widget into the workspace and save the design.

  1. image-20240129-162218.png

    Now, create another new design, based on the Kachelansicht_main design, and name it, for instance, Kachelansicht_sub.

  2. Do not select this design as the default; however, assign it to all (desired) categories.

image-20240129-161722.png

In the Kachelansicht_sub design, within the «Offer Overview» template, remove the «Category Tiles» widget and insert an offer overview widget. Possible widgets include «Offer List», «Offer Table», «Calendar», and/or «Offers in Tiles».

image-20240131-122219.png
  1. For an appealing presentation across all categories, add appropriate images (optional).

  2. Verify your result by opening the default view from your account shortcut in the offer tree using the preview share function.

Overview of Hierarchy and Designs:

Level

Output Design

Template

Display

Root Directory (Account Shortcut)

Design Set as Default (Kachelansicht_main)

Offer Overview

image-20220331-141729.png


Categories

Design assigned to categories
(Tile view_sub)

Offer Overview

image-20220331-141734.png


Offerings

Design assigned to categories
(Tile view_sub)

Offer Details

image-20220331-141737.png


 

Related Guides

Keywords for this guide

Tile Design ¦ Designs ¦ Design Manager