Spaaza Console’s CMS
In this chapter, we dive into the core concepts of the Spaaza Console’s CMS and how it integrates with the app’s functionalities. The focus is on understanding how the CMS works within the Spaaza console, enabling you to manage and customize content effectively.
Pages
Pages are the primary building blocks of the app, serving as the framework for organizing and displaying content. You can customize pages by adding zones, which are flexible sections that display items. The most high level pages are accessible through the main navigation bottom tap menu: home, rewards, and deals. These main navigation pages can be named anything you like on request. (#13 Future Work) In near future updates it will be possible to create any page you like through console. You will be able to configure items to link to these pages. This give complete freedom in how you want to structure the app. (#1 Future Work)
Zones
Zones are sections within a page, acting as containers for items. Each zone can be customized to determine how its items are displayed. Pages can include multiple zones, which can be added, removed, named, and re-ordered as you see fit.
Each zone has four configurable parameters: (#2 Future Work)
- Name: assign a name to the zone, or leave it blank.
- Layout Type: defines how items within the zone are displayed. Options are: card, banner, tile, or horizontal tile.
- Orientation: determines the arrangement of items within the zone. Options are vertical or horizontal. Combined with the layout type, this defines whether items are shown in a list, horizontal list, or grid.
-
Assignment Type: specifies how content is added to the zone. Choose between manually adding content or automatically populating it using selected filters.
- Manual: select campaigns manually from the campaign overview list.
- Filtered: automatically add campaigns based on available campaigns filter tags and types. (#3 Future Work)
You can reorder zones on a page by dragging and dropping them in the page layout preview (ref: content-previews).
Items
Zones are populated with items. Currently, items can be of two types: campaigns or content. (#4 Future Work) You can add items to a zone or remove existing ones, giving you full control over the content displayed in each zone.
- Campaign items: These are the standard campaigns you are already familiar with in the Spaaza Console. You can find the overview of them at the “Campaigns” tab and can edit them in the campaign edit screen.
- Content items: These are configured and created the same way as campaigns. They have the same visual appearance options but do not have an “effect” as campaigns. They can be used to display additional information, such as recipes, blogs, or announcements. They are also ideal for linking to an external website or hosted PDF file.
Additionally, you can reorder items within zones by dragging and dropping them in the zone content preview (ref: content-previews).
Content Campaign Overview
The campaign overview provides a familiar interface, similar to the “Campaigns” main navigation tab overview in the Spaaza Console.
It allows you to:
- Filter campaigns by status, name, barcode, tags, incentive, and type (campaign or content).
- Add multiple items (campaigns or content items) to a zone at once (one is also possible).
- Add draft campaigns or campaigns scheduled to go live later.
image: content-campaign-overview
Full App Preview & Zone Content Preview
The full app preview is a preview that shows the layout of the zones and zone items as they would appear in the mobile app. When the “Admin view” is toggled off, you can have a view where you only see this.
The zone content preview is a preview for zone items. It also provides some relevant information about the added item (campaign) like Audience, Timing, and Stores assigned. You can also see if a campaign is scheduled, draft, or active.
image: content-previews
Base Styling Configuration
In the Spaaza Console’s “Settings” tab, under the “Default Campaign Content Settings” and “Default Voucher Settings” sections, you can configure general styling options for the app, such as background colors or card designs. In this section you can change som styling parameter for the campaign items. These root settings apply, for example, when no background image is uploaded, and no specific styling configurations are set for an individual campaign.
Currently you are limited in using: Background colour, Text colour, Primary action background colour. These relate to: background colour used when no background image is selected, color of text in items and the background colour of inteactive elements such as buttons. (#9 Future Work)
Here is how changes in the console are reflected in the app: Text colour: changes color of text for all layout types except for layout types banner and card (these have white text). Background colour: this is the color that will be seen as background of a card if no image and/or background image has been set in the campaign/voucher. Primary action background colour: this is the color of the button and/or other campaign type-specific element of an item, such as the background of the button of an exchange campaign.
There are styling settings that need to be configured manually by a developer during the initial setup. To see what these settings are, please refer to the section: ref: What do I Need to Provide to be Set Up?