Customize the look and feel of your Stacks website.




How To


Apply a Stacks Theme

  1. Click on the thumbnail of the theme you would like to apply
  2. Click ACTIVATE THEME
    • The new theme has now been applied to your Stacks site

Customize a Theme

  1. Click on the thumbnail of the theme you would like to customize
  2. 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 image 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 overright 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 further customer 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 customer your Stacks site

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


NOTE

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


V 3.1.2