juanefren juanefren - 8 months ago 260
CSS Question

wkhtmltopdf - Add content to the bottom of the last page

I am using wkhtmltopdf to create PDF reports from HTML, I need to create a custom report that follows this pattern:

  1. Some information at the top of the first page.

  2. A table that can have 1 to n rows (it should use any amount of pages it needs)

  3. Some information at the end of the last page.

Putting all this together does the trick; however because step 3 info appears immediately after the table, is there a way to put the content at the end of the page?

I am not even sure if this solution is CSS based or wkhtmltopdf based.



Take a look at "Footers And Headers" section.

You can use --footer-html combined with some JavaScript to do this.

wkhtmltopdf --footer-html footer.html http://www.stackoverflow.com/ so.pdf

I based the contents of my footer.html on the example provided in the link above:

<!DOCTYPE html>

window.onload = function() {
    var vars = {};
    var x = document.location.search.substring(1).split('&');
    for (var i in x) {
        var z = x[i].split('=', 2);
        vars[z[0]] = unescape(z[1]);

    //if current page number == last page number
    if (vars['page'] == vars['topage']) {
        document.querySelectorAll('.extra')[0].textContent = 'extra text here';

.extra {
    color: red;

<div class="extra"></div>