WooCommerce Headers
Header Store – logo, hamburger, cat nav, search [ 1 ]
Components: Logo, Hamburger Menu (primary), Menu (secondary), Product Search Icon
Use Cases: Stores with lots of/long menu links. Stores that want categories in the header.
Store Topbar – icons, cart, account [ 1 ] OR
Store Topbar – announce, cart, icons [ 2 ]
Header Store – logo, hamburger, search, cart, icons [ 2 ]
Components: Logo, Hamburger Menu, Icons (map, account, wishlist, cart), Product Search
Use Cases: Stores with lots of/long menu links. Stores using wishlists.
Site Topbar – secondary menu [ 3 ]
Header Store – logo, hamburger, search, cart, icons, cat nav [ 3 ]
Components: Logo, Hamburger Menu (primary), Icons (map, account, wishlist, cart), Menu (secondary), Product Search Icon
Use Cases: Stores that want categories in the header. Stores with centered/vertical logos.
Stores can also make use of site headers, paired with topbars containing store elements.
Header Simple –
logo, hamburger, cta [ 1 ]
Components: Logo, Hamburger Menu, CTA
Use Cases: Sites with lots of/long menu links. Sites that want a Call-to-action in the header.
Store Topbar – icons, cart, account [ 1 ] OR
Store Topbar – announce, cart, icons [ 2 ] OR
Site Topbar – secondary menu [ 3 ]
Header Simple –
logo, menu, cta [ 3 ]
Components: Logo, Menu, Call-to-action
Use Cases: Sites with very few menu items. Sites that want a CTA in the header.
Store Topbar – icons, cart, account [ 1 ] OR
Store Topbar – announce, cart, icons [ 2 ] OR
Site Topbar – secondary menu [ 3 ]
Header Simple –
logo, menu with cta css [ 5 ]
Components: Logo, Menu, CSS Class
Use Cases: Sites with very few menu items. Sites that want a menu item styled like a CTA.
Store Topbar – icons, cart, account [ 1 ] OR
Store Topbar – announce, cart, icons [ 2 ] OR
Site Topbar – secondary menu [ 3 ]