◦ Comprehensive security
◦ 24/7 support
WordPress Guide → Build → Edit a Header
How to edit a header in WordPress
Your site’s header is the first thing most visitors will see—it sets the tone for your brand and helps users navigate your site. Whether you want to update your logo, add custom colors, or insert tracking code, editing the WordPress header is a core part of personalizing your site.
Let’s walk through every method available for editing a header in WordPress, step by step, no matter what theme you’re using.
Get fast, reliable hosting for WordPress
Power your site with the industry’s fastest, most optimized WordPress hosting
Understanding the WordPress header
The header is the top section of your website, and it usually includes:
- Your logo or site title
- A navigation menu
- Optional elements like search bars, contact details, or call-to-action buttons
How you can edit the header depends on the type of theme you’re using:
- Full Site Editing (FSE) themes let you design headers using blocks, just like editing a page.
- Classic themes use the Customizer or theme options to control header appearance.
- Premium or custom themes may include their own header builder or layout panel.
Let’s start with the most modern method.
How to edit the header with the Full Site Editor
If you’re using a block theme (like Twenty Twenty-Four or any theme labeled as FSE), you’ll use WordPress’s Full Site Editor to customize the header.
Accessing the Full Site Editor
- Log in to your WordPress admin dashboard.
- From the left-hand menu, go to Appearance > Editor.
- Once the editor opens, you’ll see a live preview of your site.
- In the left sidebar, click Template Parts.
- Click on Header to open your site’s current header template.
Customizing the header in the visual editor
You’ll now see your header laid out in blocks.
You can:
- Change the logo: Click the existing logo and use the block toolbar to replace or remove it. Use the “Site Logo” block to upload a new image if none is there.
- Edit the site title or tagline: Click the “Site Title” or “Tagline” blocks and type directly into them.
- Add new blocks: Click the + icon to insert buttons, images, search bars, or text.
- Rearrange layout: Use drag-and-drop to move blocks. You can also group blocks into rows or columns for more control.
- Change colors and fonts: Select any block, then use the right-hand sidebar to adjust style settings like background color, font size, or spacing.
- Adjust height and padding: Click on a group or header block, then edit padding and margin in the block settings panel.
Save and publish changes
When you’re done customizing:
- Click the Save button in the top-right corner.
- Review the changes that will be saved (WordPress shows a list).
- Click Save again to confirm.
Now visit your site to see the updated header.
How to edit the header using the Theme Customizer
If your theme doesn’t support Full Site Editing, you’ll likely use the Theme Customizer instead. This method applies to classic themes like Astra, OceanWP, or older default themes.
Open the Customizer
- In your WordPress dashboard, go to Appearance > Customize.
- The Customizer will load a live preview of your site on the right, with settings on the left.
Make changes to header content
Look for a panel labeled Header, Site Identity, or something theme-specific like Top Bar Settings.
From here you can:
- Upload a logo: Click on the logo section to upload a new image or choose one from your Media Library.
- Edit the site title or tagline: Use the text fields under “Site Identity.”
- Change header layout: Depending on the theme, you may have layout options like logo alignment, menu style, or header width.
- Customize colors and typography: Use color pickers and font dropdowns to match your branding.
- Edit menus: Navigate to Menus to add or remove items from your header navigation.
Save and publish
Click the Publish button at the top of the left sidebar to apply all your changes.
Editing headers with theme builder tools
Many premium themes include their own drag-and-drop header builders that are more flexible than the default editor.
Theme-specific header editors
Themes like Divi, Avada, or Astra Pro offer header builder modules.
Typically, you would:
- Open the theme’s custom panel (e.g., Divi > Theme Builder).
- Select the header section and click Edit or Customize.
- Use the builder interface to drag elements like logos, menus, buttons, and social icons into place.
- Preview how your header looks on desktop, tablet, and mobile.
- Save and apply your custom layout across your site or assign it to specific pages.
These tools often include advanced options like sticky headers, transparency, and conditional display rules.
Add custom code to your WordPress header
If you need to insert tracking scripts, meta tags, or verification codes into your header, you have a couple of options—one safe and beginner-friendly, the other more technical.
Using a plugin
For non-developers, the easiest option is Insert Headers and Footers.
To use it:
- Install and activate the plugin.
- Go to Settings > Insert Headers and Footers.
- Paste your script into the Header field (e.g., Google Analytics, Facebook Pixel).
- Click Save.
This method safely adds your code without touching any theme files.
Editing header.php manually (for advanced users)
If you’re comfortable with PHP and file editing:
- Go to Appearance > Theme File Editor.
- In the right sidebar, look for Theme Files and open header.php.
- Insert your code just before the closing </head> tag.
- Click Update File to save.
Warning: Editing this file incorrectly can break your site. Always back up your site first. Also, use a child theme to avoid losing changes when the theme updates.
Common header changes you can make
Here are a few ideas and examples of what you might want to change in your header:
- Replace the logo with your business brand
- Change header background color to match your site’s palette
- Add a sticky navigation menu that stays visible while scrolling
- Insert a phone number or CTA button for easy contact
- Adjust header height or padding to improve layout
- Add a banner or announcement bar for promotions or alerts
Troubleshooting header changes
If your edits don’t appear on the live site:
- Clear your browser and site cache (especially if using a caching plugin)
- Use the right editor—make sure your theme supports FSE if you’re trying to use it
- Revert to a previous version if you broke the layout; FSE and Customizer support revision history
- Switch themes if your current one lacks header options and flexibility
Getting started with editing a header in WordPress
Customizing your site’s header helps create a strong first impression and improves usability. Whether you’re using a block-based theme or the older Customizer, WordPress makes it easy to tailor your header to your brand.
Start by identifying your theme type, then choose the right method—Full Site Editor, Customizer, theme builder, or code—for your skill level and needs.
Ready to upgrade your WordPress experience? Professional hosting improves speeds, security, and reliability for a website and a brand that people find engaging and trustworthy.
Don’t want to deal with server management and maintenance? Our fully managed hosting for WordPress is the best in the industry. Our team are not only server IT experts, but WordPress hosting experts as well. Your server couldn’t be in better hands.
Click through below to explore all of our hosting for WordPress options, or chat with a WordPress expert right now to get answers and advice.
Additional resources
How to build a WordPress site →
A complete beginner’s guide that covers 9 key steps to a successful launch
Website builders vs. WordPress →
With website builders and WordPress at your disposal, you don’t need to expend your energy or savings to build a website that suits your brand.
How to use WordPress Gutenberg blocks →
A complete beginner’s guide to Gutenberg blocks