Adding custom headers and footers Headers and footers You add a custom header to include a publication title, company logo, or other common branding elements in HTML output. A custom footer can also be added with copyright information, legal boilerplate, or other fine print. header footer divHTML headerHTML footer role HTML5headers HTML5footers CSSadding custom CSSHTML5 HTML5CSS

In HTML5 output, the contents of the header file will be wrapped in an HTML5 header element with the role attribute set to . The footer file contents are wrapped in an HTML5 footer element with the role attribute set to .

For example, the DITA-OT documentation includes a simple header banner with the publication title and a horizontal rule to separate the header from the generated topic content:

Header and footer files should be specified using absolute paths and must contain valid XML. A common practice is to place all content into a div element. Set args.hdr to include an XML file as a running header that appears above the page content. Set args.ftr to include an XML file as a running footer that appears below the page content. Add custom CSS rules to style headers and/or footers.

For example, the DITA-OT documentation stylesheet includes the following header rules:

For an example of HTML output generated using this method, see the HTML5 version of the DITA-OT documentation included in the installation folder under doc/index.html.