General header options

MyListing header contains these components

• Site logo
  Can be set in wp-admin > Theme tools > Theme options > General
  
• Quick search
  Displays results in real time. Can be enabled Theme tools > theme options > header > search form. You can also set the placeholder text and featured categories which will appear when the user clicks the input initially.
  
• Main navigation
  The Main navigation menu is created under Appearance > menus
  In the header, you are able to position the main to the left, center or right side of the header. Find the option under theme options > header
• User area
  Displays sign in and register links if the user is logged out. Displays avatar, username and user menu (when clicked) while the user is logged in. You can create the user menu under appearance > menus
• Cart
  The header cart allows the user to quickly toggle the cart modal and access your cart without having to go to another page. You can enable/disable this under theme options > header > Show cart
• Messages
  Here users can find messages they've sent and received. You can enable/disable messages under theme tools > direct messages.
• Call to action button
  You can add a call to action button in the header under theme options > header. You can select the page where it links to, modify the title and add an icon using a shortcode. You can get icon shortcode under theme tools > shortcodes > icon
  

  There are different types of header options

• Global header options
  These options are set in theme tools > theme options > header and apply to all pages unless overwritten
  
• Page specific header options
  These options can be found by editing a page using Elementor > Page settings (bottom left cog icon) > header > customize header. These options will only apply to that specific page
  
• Listing page header options
  Can be found under theme tools > theme options > single listing
  

  There are header options for two states

• Default state
  This is the default state which appears before user starts scrolling.
• On scroll
  While the user scrolls down, the header will be hidden so it doesn't use unnecessary space. However the moment the user starts scrolling up, the header will animate down and be sticky at the top of the browser window. This ensures a better experience as the user won't have to scroll all the way to the top of the page to access the header components.
  You can have different colors based on the state of the header which can be found in theme options > header

  You can use HEX or RGBA to set header background

  I'm sure you are familiar with HEX, however you can also use RGBA to set the background of the header. RGBA is useful as it allows you to add transparent backgrounds to the header. You can convert HEX to RGBA code by visiting this site

  A 50% transparent red color would be rgba(255, 0, 0, 0.5)
  While a 100% transparent color would be rgba(255,255,255,0)