After July 2021, the 2.3.x release line no longer received quality updates or user guide updates. PHP 7.3 reached end of support in December 2021, and Adobe Commerce 2.3.x reached end of support in September 2022. We strongly recommend upgrading to Adobe Commerce 2.4.x to help maintain PCI compliance.

Header Template

This site contains archived merchant documentation for a version of Adobe Commerce and Magento Open Source that has reached end-of-support. The documentation available here is intended for historical reference only and is not maintained. The Adobe Commerce Merchant Documentation for current releases is published on the Adobe Experience League.

After completing the configuration, the email header template includes your logo that is linked to your store. If you have a basic knowledge of HTML, you can easily use predefined variables to add store contact information to the header.

Email templates Email Templates

Step 1. Load the Default Template

  1. On the Admin sidebar, go to Marketing > Communications > Email Templates.

  2. Click Add New Template.

  3. In the Load default template section, click the Template selector and choose Magento_Email > Header.

    Email template header - load default template Default Header Template

  4. Click Load Template.

    The HTML code and variables from the template appear in the form.

Step 2. Customize the Template

  1. Enter the Template Name for your custom header.

  2. Enter a Template Subject to help organize the templates.

    In the grid, the list of templates can be sorted and filtered by the Subject column.

    Email template header - information Header Template Information

  3. In the Template Content box, modify the HTML as needed.

    When working in the template code, be careful not to overwrite anything that is enclosed in double braces.

  4. To insert a variable, position the cursor in the code where you want to place the variable and click Insert Variable.

  5. Choose the variable that you want to insert.

    When a variable is selected, a markup tag for the variable is inserted in the code.

    Header teamplate - Insert variable Insert Variable

    Although the Store Contact variables are the ones most often included in the header, you can enter the code for any system or custom variable directly into the template.

  6. If you need to make any CSS declarations, enter the styles in the Template Styles box.

  7. When you are ready to review your work, click Preview Template. Then, make adjustments to the template as needed.

  8. When complete, click Save Template.

    Your custom header now appears in the list of available Email templates.

Step 3. Update the Configuration

  1. On the Admin sidebar, go to Content > Design > Configuration.

  2. In the grid, find the store view that you want to configure and click Edit in the Action column.

  3. Scroll down and expand Expansion selector the Transactional Emails section.

  4. Choose the Header Template that is used as the default for email notifications.

  5. When complete, click Save Config.

Transactional email design configuration - header template Transactional Emails

Field Descriptions

Load Default Template

Template Lists the selection of available templates and identifies the template to be customized.

Template Information

Template Name The name of your custom template.
Insert Variable Inserts a Store Contact Information variable into the template at the cursor location.
Template Subject The Template Subject appears in the Subject column, and can be used to sort and filter the templates in the list.
Template Content The content of the template in HTML.
Template Styles Any CSS style declarations that are needed to format the template header can be entered in the Template Styles box.
© 2024 Adobe. All rights reserved.