Background image in PDF

Frappe Framework Print Formats
1

Hi,

Currently i’m working on a new print format for our quotes.
We would like to have an background image on every PDF page generated.
I’ve managed to fix this for the preview version, by setting a background on thte .print-format class.
But this is not showing up on the PDF.

Is their onther any way of setting a background image in the PDF files?

Best Regards

2

A hack can be adding a letterhead image with absolute positioning.

<img src="/files/anand.png" style="position: absolute; left: 45%; top: 50%; opacity: 0.1">

Thanks,
Anand.

5 Likes
3

Hi Anand,

How can I make this image appear on every PDF page?

4

You can set the letterhead as the default and it should appear in every pdf.

5

Hi Anand,

Thank you, what do we need to add to our print format to show the Letter Head?
And how can we get this head on every page in the generated PDF files?

This is one of our last issues with Frappecloud and we’re hoping to get an subscription in the next few days.
Best Regards,

6

Hi,

When printing, make sure you check “Letterhead” in the print view

7

We’re still not able to add a background image on every PDF page (in case of a multi paged PDF) generated by ERPNext.
How can we manage this the best way?

Any help would be appriciated.

1 Like
8

hi, have you found any solution?

9

Hi,

I tried your method, but the image will be on top of the text, how to position the image to be at the back so text will visible.

image
image1015×177 16.3 KB

Thanks

10

please have a look at z-index https://www.w3schools.com/cssref/pr_pos_z-index.asp

11

Yes, that was the first thing i add on the inline css.

but still on pdf the logo all above the text.

12

hi,
need to bring this topic up, yes after two years.

I am fighting with the same issues z-index is not working with PDF printing.

anyone has a sollution to this?

br
Andreas

13

I second this request, did anyone find a solution for this ?

14

Having the same issue and its 2022 now, do anyone have a solution?

1 Like
15

This would be great for branding.

Has anyone figured out a way to have a watermark or background
image in custom print format or letterhead?

16

@volkswagner , I am implementing the following CSS for a background image:
.print-format {
background-image: url(“/files/abc.jpeg”);
background-size: 800px 1122px;
}