> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.avada.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to Create and Manage Header Blocks

Header blocks are a simple method to construct a navigation bar that you can reuse across all of your email templates. You also have complete control over how your headers appear on desktop versus mobile.

In this guide, let's see how you can create and manage header blocks in AVADA.

## How to create a header block

### Step 1. Open Header options

Once inside an email template editor, find the **Header** option on the left hand side menu. Click on it and you will find all the available header block option for your email.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-1_k0w6jn.png)

### Step 2. Drag and Drop one option

To use one, simply drag and drop your chosen header into the email at the center.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/header-1_amlhq0.png)

### Step 3. Save header for other emails 

If you want to make a new header block, edit the existing one and then click on the **Save** button (like in the image below). Then, you can find your customized header block in the **Saved Blocks** section on the left hand side menu.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-2_7w6x3u.png)

## How to edit a header block

To edit a header block and make it truly your own, follow these steps.

### 1. Choose your layout

Once you click on the **Header** block, you will be presented with 5 common header layout options. 

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-3_iax1lg.png)

The layout you select will be the foundation for the header block that you want to create. 

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/header-1_amlhq0.png)

### 2. Change the header content

You can also change the content of the header through the block **Content** on the right side menu. This lets you modify your logo image and choose what section to include in the header.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-4_1yjw6w2.png)

If you provided your logo and common navigation links while setting up the account, all these information will automatically be pulled into the header block. If not, you will find placeholders that you can swap out information.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-5_1x4mkns.png)

### 3. Change the header style 

You can make more changes to the header style in the **Style** tab in the right hand side menu. You will see a number of formatting options here. How these changes work will vary depending on the layout you chose. With the real-time preview, you will immediately see how your style changes affect the email template.

![](https://storage.crisp.chat/users/helpdesk/website/b66870a37c890800/template-header-6_103rvpx.png)

* **Background color**: The primary color of the header, you can enter your own color code or click on the square to pick your color.
* **Logo**: You can use the slider to change the size of your logo in pixel.
* **Menu**: You can choose the font family for your menu in the header block. There are default fonts and you can also pull in fonts from Google fonts or your custom fonts. You can also change font size, weight, and text color in this.

## Optimize your logo for the header block

A logo size of 150-300 pixels is ideal for conveying your message without being too big or little.

If the logo you selected is too large, you can make it smaller by using the **Logo** option in the **Style** tab and reduce the width. Note that this setting will change your logo's width by reducing the whole image size to keep the aspect ratio.