Customizing Look and Feel - Latest

Spectrum Spatial Guide
Product type
Software
Portfolio
Locate
Product family
Spectrum™ software
Product
Spectrum™ software > Spatial > Spectrum Spatial
Version
Latest
ft:locale
en-US
Product name
Spectrum Technology Platform
ft:title
Spectrum Spatial Guide
Copyright
2025
First publish date
2007
ft:lastEdition
2025-09-26
ft:lastPublication
2025-09-26T10:03:58.880000

You can customize the look and feel of Spectrum Spatial Analyst by applying your unique brand elements to the application's HTML banner and brand.css file.

HTML Banner

You can change the banner across the top of Spectrum Spatial Analyst to use your organization's logo and brand colors to match your brand guidelines.

Banner settings are made in an index.html file under <Customerconfigurations>/analyst/theme/banner/default. To apply your brand elements, either:

  • edit the index.html file or
  • replace the reference to index.html in the brand.css file so that it points to your custom .html file.

brand.css

The brand.css file manages all branding elements, including:

  • Setting the color properties for user interface elements like buttons.
  • Making the banner visible or not.
  • Pointing to an .html file to use for the banner.
  • Pointing to an alternate .html file to display a banner on mobile devices.
  • Setting how navigation buttons, such as Options, Add, and Legends, display within the banner or on the map.
  • Customizing the color properties of map features, such as query layer, multi-select features, and annotations.

You can find the brand.css file under the branding folder: <Customerconfigurations>/analyst/theme/branding/default/brand.css.

globalBrand.css

The globalBrand.css file enables you to customize the following:

  • Login page
  • Template designer page
  • Project home page
Note: By default, import of globalBrand.css file will be commented out.

Follow the steps below to customize your Login, Template designer, and Project home pages:

  1. Go to <SSA_INSTALL_DIR>\webapps\connect\mobile and open the index.html file with a text editor such as Notepad++ or Visual Studio Code.
  2. Uncomment the following code block. 
    <link type="text/css"rel="stylesheet" href="assets/gobalBrand/globalBrand.css">
  3. Save the index.html file and refresh the browser. You can now edit the Login, Template designer, and Project home pages by modifying the corresponding values.
  4. Go to <SSA_INSTALL_DIR>\webapps\connect\mobile\assets\globalBrand and edit the globalBrand.css file to customize the page elements as required.
  5. Save the file.
  6. Restart the application.