Edit Print Format HTML

Frappe Framework Print Formats
1

I’ve created a duplicate of a Print Format I want to edit. At some point in the process I was able to see the HTML but it’s now gone and I’m not sure how to access it again to be able to edit it…

2

You can follow this steps:

Setup > Print Format

Pick up the desired one and then make sure that Custom Format is ckecked.

You should be able to see the TextArea field called HTML for that purpose. If not, then checked the Custom Format checkbox.

3

I do see the HTML area but not the existing HTML for that Print Format. As in, I would like to start from the HTML of an existing Format and modify it. Any way to do this?

4

I guess that what you are trying to achieve is getting the HTML source code from a Standard Format and then modify it. I guess there is not an easy way for you to be able to get that. I’m going to leave a kind of template with the basis for a Print Format. Hope it helps.

<h3>{{ doc.select_print_heading or "Invoice" }}</h3>
<div class="row">
	<div class="col-md-3 text-right">Customer Name</div>
	<div class="col-md-9">{{ doc.customer_name }}</div>
</div>
<div class="row">
	<div class="col-md-3 text-right">Date</div>
	<div class="col-md-9">{{ doc.get_formatted("invoice_date") }}</div>
</div>
<table class="table table-bordered">
	<tbody>
		<tr>
			<th>Sr</th>
			<th>Item Name</th>
			<th>Description</th>
			<th class="text-right">Qty</th>
			<th class="text-right">Rate</th>
			<th class="text-right">Amount</th>
		</tr>
		{%- for row in doc.items -%}
		<tr>
			<td style="width: 3%;">{{ row.idx }}</td>
			<td style="width: 20%;">
				{{ row.item_name }}
				{% if row.item_code != row.item_name -%}
				<br>Item Code: {{ row.item_code}}
				{%- endif %}
			</td>
			<td style="width: 37%;">
				<div style="border: 0px;">{{ row.description }}</div></td>
			<td style="width: 10%; text-align: right;">{{ row.qty }} {{ row.uom or row.stock_uom }}</td>
			<td style="width: 15%; text-align: right;">{{
				row.get_formatted("rate", doc) }}</td>
			<td style="width: 15%; text-align: right;">{{
				row.get_formatted("amount", doc) }}</td>
		</tr>
		{%- endfor -%}
	</tbody>
</table>

One thing I find myself doing a lot is viewing the final source code in the browser and the copying and pasting it. After that, the only thing you need to do is to change the values from litterals to variables using Jinja.

3 Likes
5

Thanks a lot @yefritavarez, that’s exactly what I meant.
So there’s no way to customize the HTML / Jinja of an existing one. This seems like a really weird thing to me but I might paste your template in the HTML field of my custom print format and start from there.

6

Im also interested in this

Is there a folder in the server (I have a self hosted instance of ERPNext) where I can get to see the code of the Standard Formats?

7

Hello @memo2d,

That is autogenerated on the fly. So, there’s no way to see the final source code unless you see it in the browser.

If you want to have your own format, you should go ahead and create a custom Print Format.

8

Hi @yefritavarez, is it possible to access custom html print format from external text editor (atom)?

9

Of course just copy the source code on the text editor, make the proper changes then paste it back on the custom html