Themes

Article Topics: Themes, Blocks, Member Area, CMS Tour

What is a Theme?

With the CMS, every visual element is controlled by the Theme of your site. With Themes, you can easily change the design, colors, and layout of your Tour or Member Area while leveraging your knowledge since the design process for the Tour and Member Areas is the same.

Your Tour and Member Areas can have multiple themes that can be swapped and modified anytime. Changes can be made to a second copy of your theme while being able to preview it without it impacting the active theme currently viewable by users.

Managing your Theme

Themes can be accessed by navigating to the Tour or Member Area section of Content Management, selecting the Area you wish to customize, and selecting the Theme tab.

Once on the Theme tab, you will be presented with settings associated with the default Helpful Hands theme.

Pages

The Pages section of the Theme menu contains a collection of your Site's Pages, which are sections of your website comprised of various Page Blocks within your NATS install that present content to your users. Each page can be as unique as you wish, allowing you to organize and display relevant types of information depending on the function that page serves on your site.

Each page uses the Block Builder to customize the layout of the page. To learn more, view the Block Builder article.

Creating a set of pages that are easy to navigate through is another powerful element of Themes in NATS. The navigation section gives you control over where a user ends up when clicking a link provided by a Navigation Block.

Navigation Blocks can be configured to either be presented vertically or horizontally, while also providing you with settings that can be customized for Mobile Sites.

Design

Navigating to the design tab contains global color settings for elements that are shared across all pages in your theme. These settings include Base Theme Colors, navigation background, pagination settings, button colors, link colors, and much more.

Custom CSS

The Custom CSS tab contains a text area for you to implement any custom CSS to give you more control over the design of elements on your page. This is used in conjunction with the Body ID, Body Class, Content ID, and Content Class associated with each Block on your page.

Custom JS

The Custom JS tab contains a text area for you to implement any custom JavaScript to give you more control over the functionality of specific elements on your page.

Block Defaults

Block Defaults are associated with behaviors a block will adopt by default, like showing the number of scenes each model in a Model List is in, setting what happens when a user clicks a video on a Set View Block, or selecting the Channels that the Theme as a whole has access to.

Please Note: Individual Block Settings will override global settings set in Block Defaults.

Visitor Defaults

The Visitor Defaults tab controls functions regarding the Content Consent Popup and the Cookie Consent Popup, like requiring the content consent popup, setting the exit button URL for it, setting the placement for the cookie consent popup, and more.

Managing Active vs Inactive Themes

Your Tour or Member Area can have only one active theme at a time. The Active Theme is what visitors see on the Tour and members see in the Member Area. While you can create and customize multiple themes, inactive ones won’t affect your live site. You can manage and preview Inactive Themes safely.

This is useful for:

  • Creating seasonal designs

  • A/B testing different designs

  • Redesigning your theme without affecting the user experience

Learn more about changing your themes in the Changing Your Primary Theme article.

Customizing Your ThemeUsing the Page Builder

Last updated

Was this helpful?