Mar 062014
 

Suffusion Navigation Bar Above Header Settings Part Two shows you how to set up the navigation menu items hover, and more.

Last Updated: March 1, 2018

Latest News: I have updated the documentation.

There are many options for you to play around. This will guide you in setting up your website or blog. Remember to always check with other browsers and see how your website looks.

Suffusion Navigation Bar Above Header Settings Part Two Steps

Navigation Bar Above The Header Tutorials:

  1. Header Settings
  2. Part Two
  3. Header Options

Step 1 ) Go to Navigation Menu Items: Hover to set up the following options.

  • Background Color
  • Image URL
  • Image Position
  • Image Repeat
  • Layer Transparency (not for IE)

navigation-bar-above-header-menu-items-hover

Navigation Menu Items: Hover Border

Step 2 ) Go to Navigation Menu Items: Hover Border to set up the following options.

Top border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Right border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Bottom border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Left border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

navigation-bar-above-header-items-hover-border

Navigation Menu Items: Hover Font

Step 3 ) Go to Navigation Menu Items: Hover Font to set up the following options.

  • Font Color
  • Font Face
  • Font Size
  • Font Size Type
  • Font Style
  • Font Variant
  • Font Weight

navigation-bar-above-header-items-hover-font

Navigation Menu Items: Visited

Step 4 ) Go to Navigation Menu Items: Visited to set up the following options.

  • Background Color
  • Image URL
  • Image Position
  • Image Repeat
  • Layer Transparency (not for IE)

navigation-bar-above-header-items-visited

Navigation Menu Items: Visited Border

Step 5 ) Go to Navigation Menu Items: Visited Border to set up the following options.

Top border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Right border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Bottom border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Left border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

navigation-bar-above-header-items-visited-border

Navigation Menu Items: Visited Font

Step 6 ) Go to Navigation Menu Items: Visited Font to set up the following options.

  • Font Color
  • Font Face
  • Font Size
  • Font Size Type
  • Font Style
  • Font Variant
  • Font Weight

navigation-bar-above-header-items-visited-font

Navigation Menu Items: Highlighted

Step 7 ) Go to Navigation Menu Items: Highlighted to set up the following options.

  • Background Color
  • Image URL
  • Image Position
  • Image Repeat
  • Layer Transparency (not for IE)

navigation-bar-above-header-items-highlighted

Navigation Menu Items: Highlighted Border

Step 8 ) Go to Navigation Menu Items: Highlighted Border to set up the following options.

Top border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Right border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Bottom border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

Left border

  • Border Style
  • Color
  • Border Width
  • Border Width Units

navigation-bar-above-header-items-highlighted-border

Navigation Menu Items: Highlighted Font

Step 9 ) Go to Navigation Menu Items: Highlighted Font to set up the following options.

  • Font Color
  • Font Face
  • Font Size
  • Font Size Type
  • Font Style
  • Font Variant
  • Font Weight

navigation-bar-above-header-items-highlighted-font

You have now completed Part Two. Click on the following link Header Options to complete the Third Part of the tutorial.

Click on the following URL Skinning Tutorials for more skinning tutorials.

If you have any questions please let me know. I will be updating this from time to time. So keep coming back for the latest.

Enjoy.

More Suffusion Tutorials:

Manuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

The following GDPR rules must be read and accepted:
This form collects your name, email and content so that we can keep track of the comments placed on the website. For more info check our privacy policy where you will get more info on where, how and why we store your data.