marcbachmann / node-html-pdf

This repo isn't maintained anymore as phantomjs got dreprecated a long time ago. Please migrate to headless chrome/puppeteer.
MIT License
3.55k stars 544 forks source link

Is watermark possible in pdf? #698

Open tanvir8321 opened 1 year ago

tanvir8321 commented 1 year ago

I tried to make a watermark on every page. But did not able to make a watermark. How can I get a watermark in pdf generation?

tanvir8321 commented 1 year ago

There are several ways to add a watermark to a PDF document, depending on the tools and libraries you are using for PDF generation. Here are a few options:

  1. Use a library that provides built-in support for watermarks. For example, the iText library for Java allows you to add a watermark to a PDF by creating a "template" PDF with the watermark, and then overlaying that template on top of the content pages.
  2. Use a PDF editor tool that supports watermarking. Adobe Acrobat, for example, allows you to add a watermark to a PDF by using the "Watermark" feature in the "Edit PDF" section.
  3. Create the watermark as an image and add it to each page of the PDF using a PDF generation library. For example, using the PyPDF2 library in Python, you can use the "PdfFileWriter" class to add an image of the watermark to each page of the PDF.
  4. Use a pre-processing step to add the watermark to each page of the document before generating the PDF. For example, you can use a document processing library like OpenCV to add the watermark to each page of the document as an image then convert it to pdf.

It's important to note that watermarking a pdf is not an easy task and it depends on what libraries or tools you are using. It's good idea to check the documentation of the libraries or tools you are using to see if they have built-in support for watermarking and how to implement it.

But want to implement a watermark this library (html-pdf)

danielnydrle commented 1 year ago

What came to my mind is setting an element in the header/footer and styling it so that it fills the whole page, that would be possible by rotating the element. I think you are going to need absolute positioning of the element and setting the z-index of the element smaller than all the other elements on the page.

But I have no idea whether that would work.

chavaleon commented 1 year ago

I don't know if this can to help you, but I had a similar require few months ago; I fixed it adding to the body a background-image, the rest is just design and css -try and error-, of course the image have an alpha and I tried a lot of css combination to achive a good result:

<body style="background-image: url('WATERMARK_IMG'); background-repeat: no-repeat;">

Another way is to repeat the same idea but adding the image with absolute position to the header div with id="pageHeader" (it will be repeat in all new page on the document), This works for me too, but the only inconvinent is this: the image is cutted at the end of the document.

This is not the most elegant solution but it works :) good luck!