.png){kind=logo}
Choosing a Theme
- 08 Mar 2024
- 3 Minutes to read
- Contributors
- Print
- DarkLight
- PDF
Choosing a Theme
- Updated on 08 Mar 2024
- 3 Minutes to read
- Contributors
- Print
- DarkLight
- PDF
Article summary
Did you find this summary helpful?
Thank you for your feedback
A theme or template is the starting point for design of your website and apps. This includes design elements like fonts, color schemes, headers and footers, backgrounds, and page layout.
At this point, you'll have two options:
- Choose the Custom Theme option to personalize the complete design of your website and apps.
- Choose a pre-designed template from the available options (Sky Theme and Fire Theme) which will handle most of the design work for you.
NOTE: Once a template is selected, you cannot change it without the help of ViewLift. Please contact your Project Manager for further instructions.
About Custom Theme
A custom theme allows you to design your platform apps the way you want them to look. When you first select the custom theme, consider it as an empty art studio with walls, windows, and a floor—but without any paintings, sculptures, or artistic elements. For example, the Pages and the Global Settings sections in the Template Builder will appear as default, a blank canvas with no preconfigured pages or a navigation structure.
While pre-designed templates can be useful, they often have limited customization options. For a unique and personalized design, a customized theme/template is recommended, as it offers a wider range of functionality options and control over your design.
To choose the Custom Theme:
1. Within AppCMS in the top navigation, click TEMPLATE on the left navigation menu, and from the THEME section, select Custom Theme. 
Note
The selected theme is visually indicated by a blue Selected button and a blue bounding box around it.
2. As you explore the customization options, you'll discover a variety of design features available for each platform type: Web (Default), Apps, and OTT. If you want to apply the Web (Default) settings to Apps and OTT platforms, select the Use Default toggle in the Apps and OTT platforms.
To customize the designs for Apps and OTT platforms, you can set specific settings for each platform type from their respective tabs.
3. Click Save to save your design.
.png)
| Screen element | Description |
|---|---|
| Metadata | To display the metadata of your content in the UI, turn on the toggles as necessary. |
| Player | In the player settings, you can customize the colors for the progress bar and progress bar background of the video player. |
| General | Customize the colors for the background, text, and links of your site. This includes the overall color scheme of your site's interface. |
| Navigation | Set colors for the navigation bar, including the background, link hover, link active, and dropdown. |
| CTA | Bring greater contrast between the background and nav items using the options in CTA. Set colors for primary and secondary callouts, normally on the top right corner of the web/app page as Sign up and Login buttons, change the border color in the submenu selector screen, and so on. For Focused State: Border Color is CTA->Primary->Border. For Unfocused/Normal State: Border Color is CTA->Secondary->Border. |
| Primary CTA | This section controls the layout for buttons such as "Start Free Trial," "Watch Now," and "Subscribe Now," as well as the chevron controls on the standard carousel, trays, tray title, stock module for subscription plans (on the View Plans page), and the horizontal line above the footer. As all module text is controlled here, making custom changes to the CTA buttons might create site-level changes. If you wish to hardcode replacement images for CTA buttons such as Sign Up, use the CSS Style override in AppCMS > Settings > Features > Embedded Styles. This falls under the realm of custom work. |
| Secondary CTA | Customize the Logout button for the mobile web interface. |
| Footer | Customize the Logout button for the mobile web interface. |
About Template Builder
Once you have selected and applied a template for your project, the option to choose a new theme will no longer be available when you click on the Template section again. Instead, you'll see the name of the template applied, example, Entertainment Template, Sport Template, Fitness Template, etc.
1. Click EDIT TEMPLATE below to launch the TEMPLATE BUILDER.
The TEMPLATE BUILDER is where you will create web/app pages and set up your site navigation. Learn more.
FAQs
Q. Focus is not appearing for some trays, so users cannot identify which video is selected.
Make sure the color code for Brand > General > Background Color and Brand > CTA > Primary Hover > Background Color is not the same. Please confirm with our Support team whether or not the settings in AppCMS are deliberate before making any changes.
Q. In OTT apps, how do I change the color of the little bar over the nav menu selection?
Use the CTA > Primary Hover > Border settings.
Q. How do I upload custom icons for page navigation beyond the ones provided by ViewLift?
Reference this article to learn how: Adding Custom Icons to Navigation Section.
Was this article helpful?