What are Themes?

Choose from a number of specially designed theme templates and then decide on fonts, color palettes, background images, and more to create the look and feel you want for your Stacks website. The most popular Themes in Stacks are Aurora, Utopia, and Bishop.

Use the Style Editor to further customize colors to specific areas of your website.

Themes

Style Editor

Apply a Stacks Theme
  1. Navigate to the Theme tile on your dashboard
  2. Click on the thumbnail of the theme you would like to apply
  3. Click ACTIVATE THEME
    • The new theme has now been applied to your Stacks site

 

Customize a Theme
  1. Navigate to the Theme tile on your dashboard
  2. Click on the thumbnail of the theme you would like to customize
  3. Click on Settings in the bottom-left corner of the thumbnail

Enable/Disable Page Elements

  1. Under ’Toggle Display’, choose to hide or display specific elements

Configure Logo

Configure the settings for the logo that will be displayed in the main navigation bar of your Stacks site

  1. Check the ‘Use the default logo’ checkbox to use the default Stacks logo
    • OR - Click CHOOSE FILE to upload an image file to use as your website logo
    • OR - Enter the file path of a logo file accessible on the server using the ‘Path to custom logo’ field

 

Configure Shortcut Icon

Configure the settings for the icon that will be displayed in the address bar of your Stacks site

  1. Check the ‘Use the default shortcut icon’ checkbox to use the default Stacks icon
    • OR - Enter the file path of an icon file accessible on the server in the ‘Path to custom icon’ field
    • OR - Click CHOOSE FILE to upload an image file to use as the custom site icon

Customize Theme Colors

  1. To apply a color palette to the theme, choose from one of the color combinations in the ‘Select a theme’ dropdown menu
    • This will change the colors of the theme’s elements including but not limited to labels, buttons, borders, etc.

Apply a Custom Primary or Secondary Color

  1. Enter the hexadecimal color value

  2. OR - Choose a color from the color picker

Apply a Custom Background

Apply a background color:

  1. Enter the hexadecimal color value

  2. OR - Choose a color from the color picker

Add a background image from the Gallery

  1. Click on the preferred image to select it

    • Selecting a background image will override the background color

Add a custom background image:

  1. Click ATTACH
  2. Browse to find the desired background image
    • Selecting a custom background image will override both the background color and any images selected in the Gallery

Choose a custom font:

  1. Click the Dropdown field
  2. Select your desired font from the list
  3. Click SAVE CONFIGURATION

Reset site font:

  • Click the Reset button

  • Click SAVE CONFIGURATION

Activate the Style Editor

The style editor allows you to adjust your theme colors at a much more granular level. Enabling the style editor will override color options chosen in theme settings.

  1. Activate the Style Editor from the Theme tile on the dashboard
  2. Click "Style Editor"

  1. Toggle "Enable the Style Editor"
  2. Toggle "Show on front page" (Optional)

 

Use the Style Editor

To use the style editor you need to be looking at the frontend of the site.

  1. Adjust color option in the dropdowns below the activation toggles
  2. Navigate to the Homepage (If "show on front page" toggled on)
  3. Expand the section of the side menu you would like to work with
  4. Pick the colors you want for the object in the corresponding dropdown menu

 

Upload a CSS Override File

Use this feature to upload a CSS file to customize your Stacks site

  1. Click CHOOSE FILE
  2. Select the appropriate .css file
  3. Click OPEN
  4. Click UPLOAD

 

Enable the CSS Editor

Use this feature to add CSS directly, to further customize your Stacks site

  1. Toggle the Yes checkbox
  2. Add the appropriate CSS
  3. Click SAVE CONFIGURATION

Click SAVE CONFIGURATION to save any changes and/or customizations to your theme.

Watch a Video
User Manual

Back to User Manual