In this article...

In this article, we'll provide an overview of the Site Setup interface, which enables Site and Super Admins to manage a number of important site settings, including:

applying a Theme,
configuring various layout options,
and managing high-level imagery.

If you're managing a new site or have just created a new Microsite, configuring the various settings in this interface is one of the first tasks you should complete.

NOTE: If your organization licenses the Microsites module, the changes made here are specific to the Microsite you're currently managing.

Access the Site Setup interface

In the Admin Toolbar, click Site Options.
Click Site Setup.

The Site Setup interface has several tabs that you can click in order to manage the different aspects of your site.

Site Name

On this tab, you can configure the basic properties of your site (or Microsite), such as its:

Site name,
Slogan (i.e., mission statement)
Copyright notice
and domain name

Admin

NOTE: Only Super Admins can access this tab.

This is where Super Admins can control which features/settings Site Admins are able to access/change on the Site Setup page for the site they manage.

NOTE: If your organization licenses the Microsites module, you'll want to configure these settings for each Microsite or, better yet, update your Microsite template so each Microsite created from it automatically inherit these settings.

Allow Layout Changes? - These options correlate to the settings on the Layout tab, and you can enable/disable each of them to control which Layout options Site Admins can manage.
Allow Local Design? - Here, you can decide whether Site Admins can create a local Theme specifically for their site or be restricted to choosing an existing Theme (i.e., the prefabricated Higher Logic Themes and those created on the Theme Editor page). If local Themes are allowed, you can further control which Theme-creation options are available.
See Create and Edit Themes to learn more about importing Theme CSS, using the Color Picker, and overriding Theme CSS.
Allow Images? - These options correlate to the settings on the Images tab, and you can enable/disable each of them to control the types of imagery Site Admins can upload.

Layout

NOTE: Super Admins can control what layout options Site Admins are allowed to change on this tab; if you're a Site Admin, some (or all) of these options may not be available to you.

On this tab, you can manage several high level layout options for your site (or Microsite), including its:

main menu bar,
site search,
and footer type and content.

Theme

Here, you can establish a site's visual aesthetic in one of two ways:

by applying an existing Theme to a site
or manually creating a "local design" for a site

NOTE: Themes refer only to colors and CSS: A website's images, navigation, and other layout features are not controlled by a Theme.

Method 1 - Select a Theme

Using this method, you can apply any of the Themes created on the Site Admin > Theme Editor page to a site (see Create and Edit Themes).

Having officially-sanctioned Themes is a great way to ensure a site adheres to the branding of your organization or business.
It also makes it easy to quickly update the colors and CSS of all sites using a Theme, as updates to a Theme filter to the sites to which it's applied.

Method 2 - Create a "local design" theme

NOTE: Super Admins can control what Theme options Site Admins are allowed to use. If you're a Site Admin, some (or all) of the options listed below may not be available to you.

Rather than applying an existing Theme that you or someone else may have created, this method allows you to create a "local design" theme that is unique to a site.

Local design is typically only recommended for Microsites where a Site Admin wants total control over their site's design. In most cases, it's not the best option for any site under management by a Super Admin, as Local Design selections are not transportable to other sites.
While this functionality is available to meet specific business needs, we recommend Super Admins create Themes using the Theme Editor see Create and Edit Themes). This allows Themes to be copied, edited, and applied across all Microsites, while the only way to re-use a Local Design is to copy the website.

You can create a "local design" theme in the following three ways, represented by the three tabs shown above:

Import Theme CSS - Import external CSS, like a Bootstrap Theme or code that was purchased from another source or custom-developed for your organization by a third-party
Color Picker - This is Higher Logic's native design tool. It allows you to easily select and apply colors to different aspects of your site, and to emails generated from your discussions. This Theme option is a great choice for those without any specialized knowledge of CSS, as no coding is required and color selections are done by simply selecting them or entering hex codes.
Override CSS - Override CSS is a powerful tool that allows advanced users fluent in CSS to insert any desired code they want, providing the greatest flexibility and control.

NOTE: These three tabs are in hierarchical order, meaning choices made in the Color Picker override any Import Theme CSS, while the Override CSS takes precedence over the Color Picker AND Import CSS.

Additionally, you can toggle each of these theme options ON/OFF. Turning off options you aren't using can result in faster page loads across your site. When it comes to troubleshooting, if you have added CSS, imported a theme, or changed colors with Color Picker and these changes aren't rendering, check to make sure these theme options are toggled ON.

Images

NOTE: Super Admins can control what image options Site Admins are allowed to change. If you're a Site Admin, some (or all) of these options may not be available to you.

On this tab, you can manage a number of important images across your site:

NOTE: Compare the text to the image below for a visual example of where each image type displays on a site.

Logo - This is the logo (generally your organization's logo) you want displayed in the top-left corner of your Higher Logic site (i.e., in the header/masthead). By default, the logo links back to the site’s Home page. Suggested dimensions: 250–375px width by 80–100px height. For optimal display on mobile devices, keep your logo width under 320px.
Header Background - The background image in the site's header/masthead. When official branding is used here and a Logo is also desired, the best practice is to use .png Logo with transparency. Solid colors are often used as Header Backgrounds in conjunction with Logos.
Menu Bar Background - The Menu Bar's background image. This is often a solid color so navigation links are easy to read.
Page Background - The background image to show in the area outside the site's main content area.

NOTE: This image is only visible if the Site Frame on the Layout tab is set to Wide or Narrow: If set to Full, the site's main content area extends to 100% of the page.

Content Background - The background image to show in the site's main content area. We generally recommend a white Content Background so your site's content is easy to see.
Footer Background - The background image to show in the Footer. This is often a solid color so Footer text/information is easy to read.
Favicon (optional) - Favicons are small icons that display next to the URL of your site in a browser address bar. Additionally, they're often displayed next to the name of your site in a user's list of open tabs and bookmark listings, making it easier for users to identify it. The favicon must be 16x16px and of the file type .ico. You can generate a favicon using your organization/business logo.

NOTE: For best results, re-size images to meet their recommended dimensions before uploading them. Maximum file size is 5MB.

Accepted image types: .jpg, .jpeg, .png, .gif, .ico, and .jpe. The Favicon must be a .ico.

Contact Us

While the default Contact Us page is typically sufficient for most sites, you can use this tab to designate someone as a site's primary contact, who will receive the messages users submit via the Contact Us page (see sample page below). This is generally done for specific Microsites who want or need a specific individual to manage the messages received through the Contact Us form.

NOTE: If adding primary contact information to a site, we recommend setting the Hide email address option to Yes. This serves to important functions: (1) It enables the reCAPTCHA, which prevents bots from spamming them, and (2) it hides their email address on the form, preventing spam from other sources.

We also recommend notifying the individual designated as a site's primary contact so they're aware of the types of messages they may receive.

Sample Contact Us page

This is the primary contact information added to the site's Contact Us page.
The is the form provided on a default Contact Us page, and the one provided if the primary contact's email address is hidden (messages will still go to the listed email address).
The reCAPTCHA is added to the page to prevent bots from spamming your site. Users are required to complete the reCAPTCHA before they'll be able to send the message.

For a more detailed look at each of these tabs and their options, see Set Up Your Site.
To learn more about creating custom Themes using the Theme Editor, see Create and Edit Themes.

Getting Started with Site Setup