Adding a footer to PDF exports

When exporting release notes to a PDF you may want a repeating footer of each page. This article shows how to do this in Bravo Notes.

[ Adding a header works the same as adding a footer. Just modify the Header (PDF) template instead. ]

Add a PDF footer HTML template

When you create a document from scratch your PDF header template is probably empty. Once you have a PDF header template set it will be used automatically when exporting as PDF.

In the template code editor insert whatever HTML content you want to be rendered in your footer:

<footer>
    Hotel Web Relase Notes - {{ release.name }} - {{ReleaseNr}} - {{ProductName}}
</footer>

Note that you can use parameters and build / release variables.

Styling your footer with CSS

Your footer has a separate stylesheet that you can modify by selecting Footer (PDF) in the Styles tab.
Here is an example stylesheet to style the footer in our example.

@import url('https://fonts.googleapis.com/css?family=Roboto');

body {
     height:100%;
}

footer {
     font-family: 'Roboto';
     font-size: 16px;
     color:#7b3990;
     border-top: 2px solid #7b3990;
     padding-top:10px;
     position: relative;
     top:40px;
}

.page-numbers {
    position: absolute;
    right:0;
}

Adding page numbers to your footer template

You may want to have page numbers shown in the footer of each page.

You can do this by adding HTML elements with special CSS classes:

• page - number of the current page
• topage - total number of pages in the document

<footer>
    <div class="page-numbers">
     Page <span class="page"></span> of <span class="topage"></span>
    </div>
    Hotel Web Relase Notes - {{ release.name }} - {{ReleaseNr}} - {{ProductName}}
</footer>

What about adding a page header?

Adding a header works the same as adding a footer. Just modify the Header (PDF) template instead.