Theme Customizer

The Theme Customizer lets you make changes to the appearance of your website. The change can be something as simple as applying a new font color and weight for headings. Or, it can be more drastic such as switching to a dark background color and a lighter font. Maybe you simply want to switch to fall colors for the change of seasons. Additionally, the Theme Customizer also lets you preview your changes before you commit and save them to your site.

Theme Customizer Prerequisites

Your site and theme must meet certain requirements before you can use the Theme Customizer in SMT. If you don’t meet the requirements, you can’t access the Theme Customizer. There are three requirements for using the theme customizer:

  • You must be using version 3 of Site Management Tools.

  • You must be on the Aconcagua release of SuiteCommerce or later.

  • The theme deployed to the site must include elements that can be edited.

More on Themes

Your website theme controls the appearance of your site. The theme determines everything from the color of the page background, to the font size and weight, and elements you may haven’t even thought of. Themes are normally created by web designers or developers and are deployed to your SuiteCommerce site in NetSuite. When the designer creates the theme, they can specify that certain elements in theme are customizable. These customizable elements are listed in the side panel when you select the Theme Customizer from the SMT Settings menu.

As you make changes to these elements they are displayed in real time in the preview pane.

There are several different types of controls for customizing website attributes. The customizable elements, possible values, and types of controls can vary from theme to theme and even for different skins within a theme. If there are attributes, you want to change, but those aren’t available, talk to your developer to see if they can change the theme to give you control for more elements. There’s even an entire set of documentation just for the developer that tells how to do it. The Themes topic tells all about it.

Themes with Skins

A theme can include one or more skins. A skin is a group of elements that are designed to compliment each other. You can quickly change the appearance of your site, simply by choosing a different skin. To select a skin, you select it from the Skin dropdown list at the top of the Theme Customizer. When you select a skin two things happen:

  1. The site preview updates to reflect the attributes of that skin. The variables are reset to their defaults for each new skin selected.

  2. The Theme Customizer displays the customizable attributes for the selected skin.

It is also possible to have a theme with no skins at all. If this is the case, the Skin dropdown menu isn’t displayed, and the theme customizer shows the customizable attributes for the current theme.

Example: Theme With Multiple Skins

You have a theme named Seasons deployed to your site. This theme includes four different skins:

  • Winter

  • Spring

  • Summer

  • Fall

As the seasons change, you choose the corresponding skin for your site. When summer turns to fall, you want your site to mirror the goldenrods, crimsons, and umbers in nature. In the Theme Customizer, you choose the Fall skin. You’re happy with most of the elements, but you think the level three headings could be a few sizes larger and a darker shade of red. So in the Theme Customizer, you change the font size and weight for the heading and choose a deeper red. You preview the changes and are happy with the new look, so you save the changes.

Restoring a Theme

If you apply theme changes and decide later that you prefer the original theme better, you can restore the them to its default settings. At the bottom of the theme customizer in the side panel, there is a link that says Restore defaults. Click this link to discard any changes to the theme and restore it to the default settings. Depending upon the theme, restoration can take a couple of minutes.