The header is white by default with left-aligned text logo.
Site identity (logo)
Follow the steps to configure your site identity information:
- Go to Appearance → Customize → Site Identity.
- Specify your "Site Title" and optionally the "Tagline".
- Optionally upload your main image logo (dark).
- Supported formats: JPG, PNG, GIF and more (see get_allowed_mime_types()).
- Recommended format: SVG (can be enabled with plugins, see #24251).
- The maximum height of desktop logo is 170px. There is no width restriction.
- The maximum height of mobile logo is 32px. There is no width restriction but it should be narrow.
- If not uploaded, your "Site Title" and "Tagline" will be displayed instead.
- Optionally upload "Mobile logo — dark" or the text logo will be displayed on mobile resolutions.
- Optionally upload "Logo — light" if you'll be using the dark desktop header or transparent header (supported only on certain page types).
- Optionally upload "Mobile logo — light" if you'll be using the dark mobile header.
- The Theme Logo WordPress feature doesn't allow you to specify external URL for your logo. Our three additional logo upload fields also don't allow this.
- The logo options are theme modifications. It means they are remembered for each theme separately. Therefore, if you switch your theme to a child theme all your logo fields will become blank for the newly activated child theme. You will have to set them again for the child theme.
- By default it's not possible to have an image logo and text "Site Title" and "Tagline" enabled together.
Follow the steps to create your menus:
- Create three new menus in Appearance → Menus.
- You can turn menu items into icons by specifying one of the CSS classes from the fonts page in the "CSS Classes" field.
- Attach your menus to the three locations.
- Header menu left
- Header menu right
- Header menu mobile
- The logo is centered if both locations (left and right) have menus.
- Lack of "Header menu left" will make the logo left-aligned.
- Lack of "Header menu right" will make the logo right-aligned.
- Missing "CSS Classes" field.
You can enable them in "Screen Options" in the top right corner or using the "gear" icon if you're using Appearance → Customize → Menus.
Visit the body classes article to learn what header style modifiers are available to use in Administration → Theme Settings → Body classes.