Add a logo, navigation menu, search box, social media icons, and other content to your site’s header. In this guide you will learn how to add content to your site’s header.
Your site must use a theme that supports the Site Editor. To check, look for Appearance → Editor in your dashboard. If you see Customize instead, consider switching to a theme that supports the Site Editor for full control over your site’s design.
Your header is a template part — a reusable section of your site’s layout that appears on every page. To add content to it, open your header for editing in the Site Editor. If you haven’t done this before, follow the steps in Customize your header.
To add a logo to your header, follow these steps:
- While editing your header, click the + Block Inserter button.
- Search for the Site Logo block.
- Click the Site Logo block to insert it.
- Click either “Generate with AI” or “Choose logo” from the toolbar that appears to select a logo.
- Click and drag the handles (small circles) around the logo to resize it. Click Save to save your changes.
Once you upload a site logo, it can be reused in different places and templates, using the Site Logo block.
To add a menu to your header, follow these steps:
- While editing your header, click the + Block Inserter button.
- Search for the Navigation block.
- Click the Navigation block icon to insert it.
- When you’re finished editing your menu, click the Save button to save your changes.
After adding the Navigation block, you can add links, create submenus, and change link settings.
To add a search bar to your header, follow these steps:
- While editing your header, click the + Block Inserter button.
- Search for the Search block.
- Click on the Search block icon to insert it into your header.
- When finished, click the Save button to save your changes.
You can also change the search button text, colors, and width of the Search block.
To add social media icons to your header, follow these steps:
- While editing your header, click the + Block Inserter button.
- Search for the Social Icons block.
- Click on the Social Icons block icon to insert it into your header.
- When finished, click the Save button to save your changes.
You can also add your social profiles, change icon styles, and remove icons using the Social Icons block.
After adding content to your header, you can arrange your header content to create the layout you want.