¶ Customization Guideline for the Cactus Theme
This guide provide you with assistance on modifying the 2025 Uniguest Cactus base Theme.
Cactus is structured much like the established THOR theme, so please consult the detailed Thor Customization Guidelines documentation for all basic information and detailed guides.
This document will focus on the few key areas that are customized differently than THOR, which are:
1: In the construction of the main page where a bright or dark fading overlay is available.
2: In using images in the left hand side of submenu pages.
¶ Theme Information
THEME STRUCTURE
The general folder structure and theme organization remain similar for interactive pages, media, api, docs, css and data sources. Please consult the THOR documentation for further information on this topic.
CSS STRUCTURE
The CSS classes are generally very similar to THOR but the location of each have been slightly rearranged to better suit the flow of the CACTUS theme. Please consult the THOR documentation for further information on this topic.
THEME CONTENT
The CACTUS theme is built as a realistic representation of an install to make it easy for you to work with. Besides the TV/Radio and Entertainment areas and the Quickservices, we have built out three menu items with realistic looking examples of placeholder images and text. You can easily change these, move them around, rename or delete. Please refer to the THOR guide for more information on how to do this.
By default you will see a “campaign promo” item leading to a full screen image, and you will see a “hotel information” and a “food and drink” item, each leading to submenu and subsequent infopages. For information on how to customize submenus and infopages please refer to the THOR guide
GENERAL NOTE ON LICENSING
Please be aware that visual material contained in the theme is licensed for use by Uniguest with respective copyright holders. Make sure to re-license or replace these assets before pushing your deployment live to the public. Contact Uniguest support for further information.
¶ CSS architechture
Cactus retains the same CSS classes as used in THOR but they are arranged slightly different to give a more natural flow when customizing. No longer is there a split between "color" and "global", instead all aspects of a given page element will be grouped in the same sheet. All classes are commented for ease of use.
¶ Sheet - Global
"globalStyles" in the CSS tool is where you set all major general styles, the colors, logo, buttons, fonts and more. This should genrally be your first priority to set up the colors of your build, please refer to the Thor Customization Guidelines for more detailed information on this.
¶ Sheets - Specific
These sheets collect all classes relevant to a type of page, allowing you to easily add styles for the main menu, the infopages, the submenus, and for the specialized Services type pages and the specialized TV/Radio type pages.
¶ Customize the Main Menu
The Cactus main menu funtion much like the Thor Customization Guidelines , so please refer to that documentation for general help. Key differences are the bright/dark overlays, the positioning of top bar elements, the more flexible logo container and updated highlight animations.
¶ The Logo Container
By default the logo container does not show any background color, but if this is desired then simply click the container and define a background color in the CSS as seen below.
¶ The Top/Bottom gradient fade function
To help make text and icons easily visible on any background image, Cactus allow you to add a bright or dark overlay to the top and the bottom of the screen. This gives a very powerful visual addition to your design in a simple one-step manner.
Select the TopFade or BottomFade layer on the main menu, then select "settings" and then simply enter one of the three valid options in the "custom css classes" box. The valid options are 1: -bright or 2: -dark or 3: to remove the entry entirely for no gradient overlay.
We suggest you try these on your selected background image to achieve the best possible result.
¶ The top gradient
¶ The bottom gradient
¶ Editing the gradient specifics
The steps above point to these predefined CSS statements in the "mainMenuStyle" CSS, where you can adjust the details if you are a high level CSS user. Please back up the original before experimenting.
¶ Change a Sub Menu Image
Click the image container, then mark and delete the yellow css content between brackets, right click and select the new image from the folder structure. Save the page.
Your new image should be prepared in advance as a .JPG image in 920x950 pixel dimensions and uploaded to the media folder.
¶ Removing Individual Sub Menu Images
If no Sub Menu Image is identified on the page, the area will instead show a default image defined in the "GlobalStyles" CSS.
This is a fallback to ensure pages are not left blank and to allow for rapid deployment without all images defined.
¶ Any other submenu changes
Please refer to the Thor Customization Guidelines for more information on how to work with this.
¶ Various theme details
Cactus comes with some new built in features, working with these is outlined below:
¶ Using the six provided page layouts
To make advanced page building much simpler we have included 6 different page layouts for you to base any customization on, these are found in the system folder as indicated in the image below. Use the "Copy From" function when creating a new page to base it on any of these and quickly build your bespoke site.
¶ Switching on/off access to the PowerOn Slideshow
In “Settings” we have added a link to the “PowerOn slideshow” allowing the guest to return to the slideshow which automatically starts when the TV is turned on.
If you do not have this “PowerOn” slideshow enabled in your build, then simply delete the entry in the data source found here:
