Learn how to use predefined headers and footers in an HTML template through the Zuora UI by following a series of steps.

1. Follow the steps in Configure page setup for HTML templates to set the top and bottom margins to have space to add a header and footer. The following image shows how the header and footer work with the content within the whole page, given the page size is A4 (210mm x 297mm), left margin is 5 mm, right margin is 5 mm, top margin is 30 mm, and bottom margin is 30 mm:

   

2. In the Blocks tab, navigate to Header > All to see all the predefined headers.
3. Drag one of the predefined headers into the HTML template, and place it at the top of the HTML template.
4. In the HTML template, click the header Row block. You can add additional columns if the default columns cannot meet your needs.
5. In the header Row block, modify the content for each column. For example, you can drag an image component to add your company logo, or update the text to add the detailed addresses for your company.
6. Follow the same steps to configure a footer for the template.