Site Header

Introduction

This Site Header Module meant to give you another option of changing your website's header without changing your entire template. Site Header module was equip with ability to change logo, quick search and unlimited depth level of dropdown menu.

 

Key Features

  • Customizable Look and Feel
    • Background Color
    • Text Color
  • Change logo
  • Custom logo link
  • Unlimited depth child menu
  • Drill-down menu on mobile
  • Quick search
  • Custom content above the menu, ideal for welcome text and contact details.

How Module Works

This menu works just like any other modules, dragging anywhere on the template or a flexible group, this will still works but the proper way to use this module is put it inside a global group module in the header in your template.

 

Options enables you to update the following:

  • Enable Search - By default the search field placed in right side of the header is enabled. You can hide it through this.
  • Enable Options - This will show all options to customize the module.
  • Font - To change the font to use for this module.
  • Background - To change the sections background color or use image as background too.
  • Container - There 3 options to choose from, custom class, full width and custom width.
    • Custom width allows you to put a specific width of the container
    • Custom class allows you to put a class
    • Full width is will put 100% in module as width
  • Theme Colors - Allows you to change the background and text of the following:
    • Text Color - This will be the text color of the first level menu 
    • Text Color Hover - This will be the text color of the first level menu when mouse hovered to it
    • Child Text Color - This will be the color of the text from the the drop down.
    • Child Text Color Hover - This will be the text color once mouse hovered to the link.
    • Child Background Color - This will be the background color of all menus in the dropdown
    • Child Background Color on Hover - This will be the background color of the dropdown menu once mouse hovered.
    • Search Spinner Color - This is the color of the loading that shows while waiting from the results
    • Extra Content Background Color - This is the background color of extra content above the menu
    • Extra Content Text Color - This is the text color of extra content above the menu
  • Logo - Allows you to select a logo that's located at the left side of the module
  • Logo Link - A custom link for logo
  • Menu - To select a list of menu to display on the header.
  • Top Extra Content - Anything you put here will be displayed above the menu. Leaving this empty will automatically hide it.

Brief Guide

 

Please send an email to [email protected] if you have any concerns.

If you having a hard time on adding this module to your template, please don't hesitate to contact me.