Adding a logo and header

  • logo
  • header
  • navigation
  • customizer
  • site-editing

The header combines a WordPress menu (your links) with theme options (logo and bar layout). Start with a menu and a logo, then adjust desktop behavior if you need a transparent or sticky bar.

Assign a Primary menu

  1. Go to Appearance β†’ Menus.
  2. Create or select a menu and add pages or links.
  3. Check the primary / header Display location.
  4. Click Save Menu.

For adding, renaming, and nesting items, see Menu editing. For large dropdown panels, see Creating a mega menu.

Upload logos

  1. Open Appearance β†’ Customize β†’ Header & Menus β†’ Logo.
  2. Upload a Logo (SVG or PNG) for the default masthead.
  3. Optionally upload a Reverse Logo (often all white) for transparent or dark heroes.
  4. Set Logo Size so the mark fits the bar.
  5. Click Publish.

Useful options when you need them:

Control When to use it
Hide Logo Hide the image while keeping menu placement.
Change Size on Mobile / Logo Mobile Size Shorter logo on phones.
Change Size on Scroll / Logo Scroll Size Smaller logo after scroll.
Change Logo on Scroll / Scroll Logo Swap to a simplified mark when the bar sticks.

Shape the desktop bar (optional)

Open Header & Menus β†’ Desktop after the logo and menu look right:

  1. Choose a Layout that matches your brand.
  2. Turn on Transparent Masthead when the first block is a hero or full-bleed image β€” the menu overlays the photo.
  3. Pair transparent headers with Reverse Print and/or your Reverse Logo so links stay readable.
  4. Use Sticky Menu to keep links visible while scrolling, or try Floating Masthead for a rounded bar.

Use the Customizer device preview to check an interior page as well as the home page.

Tips

  • SVG logos stay sharp at every size.
  • Finish Choosing colors and fonts so header link colors inherit a readable palette.
  • Mobile drawer settings live under Header & Menus β†’ Mobile β€” set those after desktop looks solid.