Header

The Header serves as the primary navigation area of the storefront, providing customers with access to navigation links, search functionality, customer accounts, and cart interactions. It is designed to improve product discovery, streamline navigation, and maintain quick access to key store features throughout the customer journey.

Documentation screenshot

The section supports customizable navigation menus, optional utility icons, sticky header functionality, search enhancements, and cart drawer upsell opportunities.

How to Edit the Header

  1. From your Shopify admin, go to Online StoreThemes.
  2. Click Customize on the active theme.
  3. Select the Header section from the left sidebar.
  4. Modify the settings according to your store requirements.
  5. Click Save to apply the changes.

Section Settings

  • Color Scheme: Select the color scheme applied to the header. This setting controls the overall visual appearance of the header and helps maintain consistency with your store branding.
  • Main Menu: Select the navigation menu displayed in the header. The selected menu serves as the primary navigation structure for your storefront and can be used to trigger mega menu content where applicable.
  • Show Search Icon: Displays a search icon within the header, allowing customers to quickly access the store search experience.
  • Show Account Icon: Displays a customer account icon that provides access to login, registration, and account management pages.
  • Show Cart Icon: Displays the cart icon and allows customers to access their shopping cart from any page.
  • Enable Cart Drawer Gift Box: When enabled, customers can add an optional gift product directly from the cart drawer before proceeding to checkout. This feature can be used to promote gift wrapping services, complimentary products, or special add-on items.
  • Cart Drawer Gift Product: Select the Signature gift box product that will be offered as the optional gift item within the cart drawer.
Documentation screenshot
  • Enable Sticky Header: Keeps the header visible at the top of the page while customers scroll. This improves navigation accessibility and provides continuous access to search, account, and cart functionality throughout the shopping journey.
  • Suggested Searches: Enter popular search terms separated by commas. These suggestions help customers discover products more quickly and improve the overall search experience. Example: Running Shoes, Sneakers, New Arrivals, Best Sellers.
  • Suggested Products Collection: Select a collection to display recommended products within the search interface. Products from the selected collection can be surfaced to customers during search interactions to improve product discovery and engagement.
Documentation screenshot

Best Practices

Do

  • Use a clear and organized navigation structure.
  • Enable sticky header for improved usability.
  • Add relevant suggested search terms.
  • Use a high-converting collection for suggested products.
  • Enable the gift box feature when offering gift wrapping or add-on products.

Don't

  • Use overly complex navigation menus.
  • Add unrelated search suggestions.
  • Offer unavailable products as gift options.
  • Disable essential icons that customers frequently use.