Broadcast v6.2 has been released - Learn more about
What's new
Broadcast Documentation
NewSupport
Broadcast v4
Broadcast v4
  • About Broadcast
    • Broadcast Theme Documentation
  • Sections
    • Broadcast sections
      • Accordion
      • Accordion group
      • Contact form
      • Before and After
      • Blog posts
      • Collection list
      • Collection list hover
      • Custom content
      • Featured blog posts
      • Featured collection
      • Featured product
      • Image banner
      • Image with text
      • Multicolumn
      • Newsletter
      • Press logos
      • Rich text
      • Shop the look
      • Sidebar
      • Tab collections
      • Testimonials
      • Text columns with images
      • Text promo
      • Text with products
      • Collection list hover
    • How to use sections
    • Section blocks
  • Header
    • Announcement bar
      • Text announcement
      • Free shipping message
      • Custom HTML
    • Header
      • Transparent header
      • Header icons
      • Social icons
      • Navigation images
      • Sticky header
    • Target Settings
  • Upsell
    • Upselling with tags
    • Upselling with metafields
  • Products
    • Product pages
    • Tabs and accordions
    • Tab content using metafields
    • FAQ Accordions
    • Swatches
    • Size charts
    • Pre-order products using tags
    • Pre-order using metafields
    • Sale items
    • Free products
    • Product Theme Blocks
      • Title
      • Price
      • Variant picker
      • Buy buttons
      • Siblings
      • Description
      • Upsell
      • Icon
    • Low inventory message
    • Accordion section
    • Product ratings
    • Related products
  • Siblings
    • About product siblings
    • How to setup siblings
    • Siblings metafields
      • Siblings color
      • Siblings collection
    • Siblings product setup
    • Siblings block
  • Collections
    • Collection page settings
    • Product badges
    • Product badges with metafields
    • Product filtering
    • Quick add
    • Sub-collections
    • Cutline second line
    • Featured image
  • Popups
    • Popups Theme Blocks
      • Large newsletter
      • Text promo
      • Small newsletter
      • Cookie consent
    • Coupon codes
    • Popup Behavior and Target
  • Pages
    • Page templates
    • Creating page templates
    • Page section
  • Updates
    • Check your theme version
    • Download latest theme version
    • Updating your theme
      • Updating from version 1 or 2
      • Updating from version 3
      • Shopify's Online Store 2.0
  • Changelog
    • What's new in 5.0
    • Tips and detailed information about v4.0 release
  • Theme settings
    • Theme Settings Intro
      • Colors
      • Typography
      • Buttons
      • Layout
      • Search
      • Social media
      • Product Grid
      • Product Form
      • Cart
  • Blogs
    • Featured posts
    • Blog pages
  • Blog posts
    • Article page
    • Theme blocks
  • Footer
    • Footer
    • Footer Theme blocks
      • Link list
      • Newsletter
      • Social
      • Text
      • Page
  • Support
    • Contacting support
    • Share preview link
  • Custom
    • Where to make CSS changes
    • How to remove Shopify credit
    • Collection image spacing
Powered by GitBook
On this page
  • Logo above menu
  • Logo beside menu
  • Mobile drawer menu
  • Logo center menu left
  • Text-based items
  • Currency selector
  • Language selector
  • Predictive search
  • Currency, language, and search toggles
  • Transparent header
Export as PDF
  1. Header

Header

Broadcast includes multiple header styles to easily customize the look of your main header

PreviousCustom HTMLNextTransparent header

Logo above menu

Place the brand logo in the middle and navigation below.

The design allows for longer navigation. Stores with many menu items can place the navigation below the brand logo and position items like language selector, currency chooser, account, search, and cart icons on the top right:

Logo beside menu

This style places the brand logo to the left with the navigation in the center. The design is a more compressed header area. Ideal for smaller/shorter navigation menus:

Mobile drawer menu

This minimal style adopts the mobile design pattern which is used on all mobile devices.

This style is the cleanest option, hiding the navigation into a mobile-style drawer and keeping consistency between mobile and desktop:

When the menu text or icon is clicked, the slide-out mobile drawer is displayed on both desktop and mobile:

The search icon is placed next to the mobile-style hamburger icon for balance. Account and cart icons are on the far right.

Logo center menu left

This common design presents the brand logo centered with navigation menu items on the left. Ideal for compact headers with a shorter top-level menu structure:

Text-based items

Broadcast can replace icons with text for text-forward designs:

Currency selector

Broadcast supports Shopify's Currency selector and can be placed in the header:

Currencies are configured in your main Shopify Admin payment settings.

Language selector

Broadcast also supports Shopify's Language selector and can be placed in the header:

Languages are configured in your main Shopify Admin settings.

Predictive search

Broadcast includes a powerful redesigned search tool for finding products and resources within your site. Predictive search can be engaged right from the header. Addition menu options can be added to customize the shopping experience:

Configure and customize the search features under Theme Settings:

Currency, language, and search toggles

Each of these features can be individually toggled on or off to show in the main header area:

Transparent header

When using a transparent header, you can experiment with different icon styles to help the icons stand out with your background image.

A large icon size sometimes helps to bring attention to the icons:

Find the transparent header options lower in the Header section settings:

Cart icon style: Bag
Cart icon style: Cart
Cart icon shown as circle with number of items in cart
Cart icon style: Bag shown with items in cart indicator
Toggle off the Show icons option
Currency drop-down
Language drop-down
Customize the search to help customers find common items
Icon style: Modern
Icon style: Bold