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
  5. Scroll down to Website Settings and Click Website
  7. 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.
  9. Click Save
  11. 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 ...

    • How Do I Manage My Homepage Navigation?

      This Article Is For: All users who have: Manage Page Navigation Permissions This is applicable to: All themes These instructions are for managing/adding/deleting a page to your website's navigation. Step-by-step guide This is the way to add or remove ...

    • 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 ...

    • 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 ...