Custom print format with water mark

hi i want to have custom pirnt format for sales invoice / quotation.
we have a water mark in our existing invoice.
which we want it in ERP as well. also how can i relocate the fields, logo position in erp as per existing fields positions in our invoice.
attached is our current format / layout.

@Kulbhushan_Kulbhusha Which software you are using to print this invoice.
You can create water mark, or add image/signature in print format using html and css (Creating watermark using html and css - Stack Overflow)

However printing to a fixed position is headache, You first need to setup page size in ERPNext as this is not standard A4/Letter size. You need to create print format with fixed location for every field.

If you really need it, then you can check Cheque Print format code in ERPNext

Sample html Code:

 <div style="position: relative; top: 19.535cm; left: 0.5cm;">
         <div class="row">
            <div class="col-xs-4 text-right">{{ doc.pay_to_recd_from }}</div>
            <div class="col-xs-4 ">{{ frappe.utils.formatdate(doc.cheque_date) }}</div>
            <div class="col-xs-4 ">{{ doc.name }}</div>
         </div>
</div>
3 Likes

hi, thanks for the reply.
currently its a shopper software from tally solutions.
we are migrating to ERP next.

[quote=“kolate_sambhaji, post:2, topic:17440”]
However printing to a fixed position is headache, You first need to setup page size in ERPNext as this is not standard A4/Letter size. You need to create print format with fixed location for every field.
[/quote] how can i do this ?

thanks but i have no idea how coding is done & how & what to do.

@Kulbhushan_Kulbhusha
I have made such print formats.
If you can switch to laser printer and only water mark is stopping you, You can easily add water mark and Letter Head in Print Format.
ERPNext also provide feature to add footer and page number.

You can create such print format without writing any code.

Reference: https://frappe.github.io/erpnext/user/manual/en/setting-up/setup-wizard/step-5-letterhead-and-logo
https://frappe.github.io/erpnext/user/manual/en/setting-up/print/letter-head.html

3 Likes

yes we are going to switch to laser printer only.
logo i had inserted in print format by attaching it in Edit heading section. how i insert the water mark ? same method ? but that should appear at middle of invoice.

@Kulbhushan_Kulbhusha

Fod adding images in background

<style>
 div {
    background-image: url("w3s.png");
}
</style>
<div>

<h1>Hello world!</h1>
<p><a href="http://www.w3schools.com">Visit W3Schools.com!</a></p>
<p>The background attribute is not supported HTML5. Use CSS instead.</p>
</div>
1 Like

thanks but where do i paste this ? &
where & how i attach the watermark image ?.

@Kulbhushan_Kulbhusha you can put this code in letter head with fix height,

hi, i think i m doing it wrong way.
PFA

Hi,

@kolate_sambhaji, can share the code used to get this background image visible in the print format attached. I have exactly same requirement having watermark on letterhead on bottom left. I tried many ways, but each time while generating PDF the code background-repeat:no-repeat; is getting ignored. The image keep getting replicated.

First I tried, but imgae keeps repeating in PDF

.print-format {
background-image:url(‘/files/FINBYZbg.png’);
background-repeat:no-repeat;
background-position:left bottom;
}

I also tried, but it doesn’t go in background, nothing can overlap.
<img src="/files/FINBYZbg.png" style="position: absolute; left: 0%; bottom: 0%; opacity: 0.1">

Any help will be greatly appreciated. Thanx

Can you able to view image in print preview?

I was able to set single image as background using below css for division wrapping my custom print format:

.Container {
background-image:url(‘/files/FINBYZbg.png’);
background-repeat:no-repeat important!;
background-position:left bottom important!;
}

I want background image starting from bottom corner of page instead of from footer.

But I am getting below result

While I want background image as below:

The print format you have attahced on Nov4 is actually kind of solution, where image is starting below footer continuing in print body.

sir how to add watermark in middle of invoice
tally erp 9 invoice

Hello
i want ask you
where i add this code to make watermark appear in printing invoice ?

this link -
https://frappe.github.io/erpnext/user/manual/en/setting-up/print/letter-head.html
and
this - https://frappe.github.io/erpnext/user/manual/en/setting-up/setup-wizard/step-5-letterhead-and-logo

does not work anymore…
any other alternative to the above solution will be much appreciated.

absolute position with z-index thing in HTML is not giving desired output
also flex not working as required.