CODEWITHSUNDEEP
c#wkhtmltopdf
Flg
Flg

Reputation: 171

wkhtmltopdf Header, Image & Pagenumbers

I want to add a Header to my PDF with this: --header-center TEST

and it works fine, but if i want to insert Whitespace: --header-center TEST test

it wont be displayed. Do I have to write something instead of " "?

Another question is how to insert pagenumbers into the footer. I found this code-snippet, but I'm new in this issue and have no idea how to implement it:

var pdfInfo = {}; 
  var x = document.location.search.substring(1).split('&'); 
  for (var i in x) { var z = x[i].split('=',2); pdfInfo[z[0]] = unescape(z[1]); } 
  function getPdfInfo() { 
    var page = pdfInfo.page || 1; 
    var pageCount = pdfInfo.topage || 1; 
    document.getElementById('pdfkit_page_current').textContent = page; 
    document.getElementById('pdfkit_page_count').textContent = pageCount; 
  }

And my last question is how to insert Images into the footer with --header-html ~\image.html. I inserted a link referencing a simple html with a picture but it wont be displayed.

I know... many questions. This issue is very tricky for me.

Thanks in advance!

LG FG

Upvotes: 2

Views: 8022

Answers (1)

celadonz
celadonz

Reputation: 391

As in my comment, the whitespace in the text header should work if you surround it in quotes, ex --header-center "TEST test"

Okay, so I played around and found how to get the page numbers and image to work. Your header.html should look something like (notice how the image URL is the absolute path) :

<html>
<head>
    <script type="text/javascript">
        var pdfInfo = {};
        var x = document.location.search.substring(1).split('&');
        for (var i in x) { var z = x[i].split('=',2); pdfInfo[z[0]] = unescape(z[1]); }
        function getPdfInfo() {
            var page = pdfInfo.page || 1;
            var pageCount = pdfInfo.topage || 1;
            document.getElementById('pdfkit_page_current').textContent = page;
            document.getElementById('pdfkit_page_count').textContent = pageCount;
        }
    </script>
</head>
<body onload="getPdfInfo()">
    <img src="/var/sites/mysite/htdocs/images/logo.jpg" />
    <br />Page <span id="pdfkit_page_current"></span> Of <span id="pdfkit_page_count"></span>
</body>
</html>

Then generate the with something like wkhtmltopdf --margin-top 40mm --header-html /var/sites/mysite/pdf/header.html content.html output.pdf

You'll have to play with --margin-top to get the right spacing. The same procedure should work for footers as well.

My source for this was http://metaskills.net/2011/03/20/pdfkit-overview-and-advanced-usage/ (PDFkit is a wrapper for wkhtmltopdf)

Upvotes: 2

Related Questions