Enterprise / Site Design & CSS Overview

This article provides an overview of how to design and implement custom CSS for your Brightidea.

Before we begin, please note that some options should only be used with knowledge of HTML/CSS/Javascript. The Design tab in Enterprise/Site allows the administrator to fully implement any custom design and gives great flexibility to your Brightidea site.


    • To access the Design section, navigate to:
      • Enterprise / Site Setup > Site > Design


  • There are three options you can use for your banner:

    • HTML/CSS/Java Experience recommended when using this option.
    • Hide Enterprise Banner (No banner will display)
    • Image: Upload an Image from a file on your computer to use as the banner.
    • HTML: Custom HTML (This is for a custom Banner/Navigation)


Footer HTML

  • Designers have an easy way to apply footers to the bottom of pages in Brightidea.
  • By using some basic HTML code, the footer can be customized and designed as needed
    • Input any Text/HTML to display in the footer and save changes to take affect.
  • Remember this will show up on every page above the Initiative logo, including the login page.

Favicon Icon (Initiative/Site)

  • A Favicon is an Icon that represents your website will show up in the tab of your browser. Usually it’s a company logo.

  • NEW: The Favicon feature has been updated to a new version. However, affiliates that were created before June 2019 may not have this feature enabled by default.

    Contact your Customer Success Manager or our Support department and one of our team members can quickly enable this for you. Please see our support article here for more information

    • The Favicon file should be an .ICO file.
    • Recommended size should be 16x16 pixels.
  • Below are example of Favicons from Brightidea and Microsoft:

Stylesheets/Pre‐sets/Color Picker

  • Pre‐sets/Color picker: Preset color palette default templates with allow the administrator to quickly select different color schemes.
    • The Color picker will populate to the set colors. You can change colors accordingly in the picker if desired.
    • You are able to enter any HEX code and are not limited to just the colors in the “picker” input field:

  • At the Initiative/Site Level
    • Note: Headers will not be inherited by your Enterprise CSS. Headers are controlled from the individual Site level.
    • Enable Enterprise CSS – Selecting this will apply the Custom CSS Design from the Enterprise level design configuration at any Site level.

Custom CSS

  • The goal of the Design tab is to be able to work with your Custom CSS directly in the browser making your changes in this text field without needing to upload CSS files.
    • Here, you are able to enter your custom styled CSS code that will apply to your Brightidea site:


It is very important to understand the formatting hierarchy in order to comprehend how the CSS is generated on your Brightidea site:

  • First, there’s a barebones default template already in place (Brightidea core CSS code)
    • Second, Color picker values are selected
      • Third, Custom CSS entered into the text box, then any external CSS files uploads.

Make sure to always “Save” any changes in the Design tab before navigating away from the page! 

Was this article helpful?
1 out of 1 found this helpful
Have more questions? Submit a request


  • Avatar
    Vigneron, Anthony (IT-LON)

    can you share more css templates?

  • Avatar

    Hi Anthony,

    If any custom design changes are needed, we would recommend reaching out to your Brightidea Account Manager, who can scope an engagement with our Professional Services team.

    They will be able to implement custom design in your site according to your specific requirements.