Custom Quote Template Beta

StoneCurators
Participant

Format Product List

Two questions ....

I have been trying to get help for from the HS support channel with getting the code for the “Standard: Modern” template below so I can see how you accomplish the format of the product list (with descriptions under the names).  This template does not show in the Design Manager. They were unable to help me.  Can anyone help?

 

StoneCurators_0-1621957137871.png

 

 

Also, in my old proposal> template I am using the line below to access deal and include properties.  Can you tell me if I need to also use this when using the new quote> template.

 

StoneCurators_1-1621957137951.png

 

Thank you in advance,

Mark

4 Replies 4
jmclaren
HubSpot Employee
HubSpot Employee

Format Product List

Regarding deals - we note in the documentation https://developers.hubspot.com/docs/cms/hubl/variables/quotes that all of the data available is visible at the top of the HubSpot provided example custom quote templates. 

See in there the

DEAL

variable.

Jon McLaren

Sr. CMS Developer Advocate

Get started developing on the HubSpot CMS Developer Changelog
How to optimize your CMS Hub site for speed

If my reply answered your question, please mark it as a solution, to make it easier for others to find.

0 Upvotes
jmclaren
HubSpot Employee
HubSpot Employee

Format Product List


@StoneCurators wrote:

Two questions ....

I have been trying to get help for from the HS support channel with getting the code for the “Standard: Modern” template below so I can see how you accomplish the format of the product list (with descriptions under the names).  This template does not show in the Design Manager. They were unable to help me.  Can anyone help?


The "Standard" templates are not built with the new custom quote functionality, they are default templates provided before this functionality existed. Because of that they do not exist in the developer file system(the file system you see in the design manager). Because these templates were not built with the same back-end technology there may be some situations where they do not have equivalent functionality in custom quote templates. The goal is definitely to make Custom Quote templates more powerful and flexible than those standard templates.

That said it is possible to add the description.
You will need to edit the line_items_table module in your quote theme. 


I added in the thead, a new th, with the word Description (you can add a module text field if you want the word description to be editable/translatable).

Then in the tbody, I added a td for item.description.

 

<table class="line-items__table">
<thead>
<tr>
<th scope="col">{{ module.products_services_title }}</th>
<th scope="col">{{ module.sku_title }}</th>
<th scope="col">Description</th>
<th scope="col">{{ module.quantity_title }}</th>
<th scope="col">{{ module.billing_frequency_title }}</th>
<th scope="col">{{ module.price_title }}</th>
</tr>
</thead>
<tbody id="line-items__table-body">
{% for item in LINE_ITEMS|sort(False, False, 'hs_position_on_quote') %}
<tr>
<td>{{ item.name }}</td>
<td>{{ item.hs_sku }}</td>
<td>{{ item.description }}</td>
<td>{{ item.quantity }}</td>
<td>{{ item.recurringbillingfrequency }}</td>
<td>
{{ item.amount|format_currency(LOCALE, CURRENCY, true) }}
{% if item.discount > 0 %}
<br>
after {{ item.discount|format_currency(LOCALE, CURRENCY, true) }} discount
{% elif item.hs_discount_percentage > 0 %}
<br>
after {{ item.hs_discount_percentage }}% discount
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>

 


I'll get back to you shortly on the deal question.

Jon McLaren

Sr. CMS Developer Advocate

Get started developing on the HubSpot CMS Developer Changelog
How to optimize your CMS Hub site for speed

If my reply answered your question, please mark it as a solution, to make it easier for others to find.

0 Upvotes
StoneCurators
Participant

Format Product List

Thank you Jon.  What you describe above I was able to figure out myself.  What I needed help with was how to get the description property to display in a seperate line as it does in the referenced template.  Are you able to help with that?

0 Upvotes
natsumimori
Community Manager
Community Manager

Format Product List

@jmclaren and @ethankopit , could you look into this?

0 Upvotes