How Do I Make My Website Navigation Bar A Solid Colour?

How Do I Make My Website Navigation Bar A Solid Colour?

This Article Is For:

  • Users with 'Manage Website Settings' permissions
  • Users who are comfortable working with custom HTML code (provided)
  • This is applicable to: Hero 1.0 Theme


Step-by-step guide

  1. Log into the SoCast Platform
  2. Click Settings in the top right corner
  3. Go to: Website Settings>Website
  4. Scroll down to Website Settings and Click Website
  5. Scroll down to Customer Header HTML and paste the HTML code provided.
    NOTE: the colour word will dictate the colour of your Navigation Bar. If another <style> tag exists in the Customer Header HTML field, you can copy and paste the code between without the <style> tags and paste within the existing <style> tags.
  6. Click Save
  7. Your Navigation Bar should now be a solid colour

Custom Header HTML Code Is Attached to This Article

#stickyHeader, #ribbon, .ribbon-content.site_width {
	background-color: black !important;
}




    • Related Articles

    • How Do I Add or Edit A Page In My Website's Navigation Bar?

      This Article Is For: All users who have: Manage Page Navigation Permissions This is applicable to: All themes These instructions are used to add, re-order, or remove pages from your website’s primary and footer menu navigation. Step-by-step guide Go ...
    • Navigation Menu Bar: Overview

      This Article Is For: All users who are SoCast Website Admins This is applicable to the SoCast 2.0 Theme and Hero 1.0 Theme The navigation bar, is the main bar located at the top of your website. This is home to your most important navigation items ...
    • Step #3: Custom Listing Fields

      This Article Is For: All users who have: Manage Local Listings, Manage Local Listings Settings This is applicable to all SoCast Themes Requirements: Must have already purchased the Local Listings product ( If you would like this product, please speak ...
    • How Do I Change The Secondary Navigation Bar Text Color? (SoCast 1.0 Theme)

      This Article Is For: All users who have the 'Manage Website Settings' permission This is applicable to all SoCast 1.0 Theme Only These are the instructions for adding custom css to your 'Custom Header HTML' section in order to change the color of ...
    • Navigation Theme Settings

      This Article is For: All users who have the 'Manage Website Settings' permission This is applicable to all SoCast Themes Your website navigation theme is an important part of your website visitor’s experience. For more info on how to customize your ...