Add image in header using html-pdf node module

I am using this to convert the html to PDF.The conversions are really good.But the problem is to add header and footer in the PDF pages.In the options if i add the header text i got the result what i expected.

//Options

var options = {
"header": {
"height": "45mm",
"contents": "

Author: Marc Bachmann

" // If i add image in content it wont work
// sample i tried
},
"footer": {
"height": "28mm",
"contents": "<span style='color: #444;'>{{page}}</span>/<span>{{pages}}</span>"
}
}
// Tried this in contents <img src="image path" />
var result =

HTML CONTENT

';

pdf.create(result, options).toFile(fileName + ".pdf", function(err, res) {
if (err) {
console.error(err);
callback();
}

Then if i add the image tag in the header(contents) option i didn't get the image in the generated PDF. Can you please give me a solution for this thanks.

3 Answers
3

It is possible to add the image in options header.
1.Load the image in html body with "display:none" style.
2.Then add the image in the options header
By doing this the image is cached and can attach the image in header.

var options = {
"format": 'Letter',
"orientation": "portrait",
"header": {
"contents": "<img src='image path' />",
"height": "30mm"
},
"footer": {
"contents": footer
}
}
pdf.create("

", options).toFile("sample.pdf", function(err, res) {
if (err) {
console.error(err);
callback();
}
});


this solution is not for html-pdf but for html to pdf....
– Rahul
Dec 26 '16 at 22:51

Refering to this issue on the github, you can't put your image directly in options.header, you have to put it in the body inside a

:

options.header

var pdf = require('html-pdf');
var path = require('path');

// this is very important, you have to put file:// before your path
// and normalize the resulting path
var imgSrc = 'file://' + __dirname + '/350x120.png';
imgSrc = path.normalize(imgSrc);
// or var imgSrc = path.join('file://', __dirname, '/350x120.png');

// Options
var options = {
"header": {
"height": "45mm",
"contents": ""
},
"footer": {
"height": "28mm",
"contents": "<span style='color: #444;'>{{page}}</span>/<span>{{pages}}</span>"
}
}
// put your entire header here and the content of the page outside the

var result = "

Author: Marc Bachmann

";
result += "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>";
var fileName = __dirname + '/test.pdf';
pdf.create(result, options).toFile(fileName, function(err, res) {
if (err) {
console.error(err);
}
});

With this code, I get this pdf:

Thanks for your reply... Here you are created the html and pass it to the package.But i need to set the image from options header (So that it will replicate all the generated pdfs).So is it possible to do that set image from options header itself ?
– venkats
Feb 11 '16 at 12:44

Auto-quoting myself: you can't put your image directly in options.header. You can store the

in a variable and append it to the body of all your pdf.
– Shanoor
Feb 11 '16 at 12:47

So we should have the image in the html itself for every page ?.But still the text can be repeated in the options header.
– venkats
Feb 11 '16 at 13:01

Thanks for your help . ShanShan :)
– venkats
Feb 11 '16 at 13:07

Created a simple NPM module for this purpose that can add arbitrary HTML and CSS to an existing PDF.

const pdf = require('add-html-to-pdf');

var options = {
input: 'sample.pdf',
output: 'done.pdf',
html: "

Author: Marc Bachmann

",
}

pdf.insertHTMLInPDF(options);


By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.