Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

wkhtmltopdf: show content on footer, for example page number

I expected this command to show 1/1 at the bootom of the generated pdf but no... any idea?

wkhtmltopdf --footer-center [page]/[topage] www.google.com /tmp/foobar.pdf

Version: 0.12.2.4 on Linux

like image 385
ziiweb Avatar asked Jan 05 '17 18:01

ziiweb


People also ask

How do I add a footer in Wkhtmltopdf?

Footers And Headers: Headers and footers can be added to the document by the --header-* and --footer* arguments respectively. In header and footer text string supplied to e.g. --header-left, the following variables will be substituted.

How do I add page numbers to a footer in HTML?

Refer to Adding Content to a Header or Footer for an example of how to create content for a header or footer. 2. Highlight numbered-header then the Edit button to open the Generated Text Editor. Place your cursor in the right hand cell of the header table, then choose Insert > Page Number.

How do I use Wkhtmltopdf?

Open a command prompt window. The syntax for using the tool is fairly simple, enter the name wkhtmltopdf, followed by the URL of the web page, and the name of the PDF that you want to create, like so. Let's say you want to save a copy of a website, this is what the command will look like.


2 Answers

I think this issue may be due to version 0.12.2.4 otherwise, this --footer-center [page]/[topage] command will be doing your work.

one more example i have checked that substitutePdfVariables() is called in body onload.

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script>
        function substitutePdfVariables() {

            function getParameterByName(name) {
                var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
                return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
            }

            function substitute(name) {
                var value = getParameterByName(name);
                var elements = document.getElementsByClassName(name);

                for (var i = 0; elements && i < elements.length; i++) {
                    elements[i].textContent = value;
                }
            }

            ['frompage', 'topage', 'page', 'webpage', 'section', 'subsection', 'subsubsection']
                .forEach(function(param) {
                    substitute(param);
                });
        }
    </script>
</head>
<body onload="substitutePdfVariables()">
    <p>Page <span class="page"></span> of <span class="topage"></span></p>
</body>
</html>

Here Docs You can find out more variables about header and footer.

like image 67
Kumar Rakesh Avatar answered Oct 01 '22 10:10

Kumar Rakesh


Seems like a stability issue but there has not been a stable release of the version 0.12.2.4 for linux (debian or ubuntu) but just for the debugging purposes as mentioned in their repositories here.

Here is the working screen shot for the version and 0.12.4

Version 0.12.4foobar1

or you can add the page number by the following snippet to add the footer as mentioned here

  <html><head><script>
  function subst() {
    var vars={};
    var x=window.location.search.substring(1).split('&');
    for (var i in x) {var z=x[i].split('=',2);vars[z[0]] = unescape(z[1]);}
    var x=['frompage','topage','page','webpage','section','subsection','subsubsection'];
    for (var i in x) {
      var y = document.getElementsByClassName(x[i]);
      for (var j=0; j<y.length; ++j) y[j].textContent = vars[x[i]];
    }
  }
  </script></head><body style="border:0; margin: 0;" onload="subst()">
  <table style="border-bottom: 1px solid black; width: 100%">
    <tr>
      <td class="section"></td>
      <td style="text-align:right">
        Page <span class="page"></span> of <span class="topage"></span>
      </td>
    </tr>
  </table>
  </body></html>
like image 37
Pritish Vaidya Avatar answered Oct 01 '22 09:10

Pritish Vaidya