Add fixed Footer on Print

You can add a static footer when printing a page. Keep in mind that the footer text is fixed, meaning it will print the footer with the same text on every page and cannot be modified.

The JS

None.

The CSS

Add the CSS below. The @media print{} defines what it will look like when the page is printed.

.page-footer {
  display:none;
}
@media print{
  .page-footer {
    position:fixed;
    display:block;
    bottom:0;
  }
}

How to implement

Add a Rich Text view on the page that is getting printed.

<div class ="page-footer">YOUR FOOTER TEXT</div>

Last updated