[SOLVED] order_conf.html template layout messed up!

mtm · December 18, 2013

Hi,
Suddenly, my order_conf.html email layout is all messed up when generated with content. The template itself seems ok but when the email is automatically sent after an order is placed, the email that the client receives have problems with tables layout.

I replaced the template with new ones from a fresh install but the problem remains. However, the new_order.html that is sent to the store with basically the same info is displaying fine. I tried to use that template in place of the order_conf.html but it won't work because it uses a diferent key for the product info: the order_conf.html uses {products} {discounts} and the new_order.html uses {items}. So, the layout displays ok but without the product information: it shows the {items} code element above the product row description - as we see on the template.

If i change the {items} in new_order.html with the {products} {discounts} from the order_conf.html, the product information is now displayed but the table layout becomes messed up - just like it does when using the order_conf.html.

So, i'm assuming that the problem is somehow related with the {products} {discounts} keys. One thing i would like to try is using the the {items} instead of {products} {discounts} but i guess i have to edit some other php files and i just don't know which one(s), or what to edit...

The ideal solution is to fix the problem and use the {products} {discounts} as it should be but if i can't solve it, i belive changing it to use {items} could be a workaround.

I attached some pics to show both cases: the messed up order_conf.html and new_order.html using the {products} {discounts}; the good new_order.html using the {items} and the order_conf.html using the non-working {items}.

Thanks.

Using P.S. 1.4.8.2

Edited December 23, 2013 by mtm (see edit history)

mtm · December 23, 2013

No one can help?

CartExpert.net · December 23, 2013

Hi.

Please post or upload the html file.

Regards.

Robin.

The CartExpert Team

mtm · December 23, 2013

Hi Robin,

As i told you, i even replaced it with an original conf.html, so the problem doesn't seem to be with the html template file. The same one was working ok.

Anyway, here's the html code from an original instalation template that is also giving me that messed up layout:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Message from {shop_name}</title>
</head>
<body>
<table
style="font-family: Verdana,sans-serif; font-size: 11px; color: rgb(55, 73, 83); width: 550px;">
<tbody>
<tr>
<td align="left"><a title="{shop_name}" href="%7Bshop_url%7D"><img
style="border: medium none ;" src="%7Bshop_logo%7D" alt="{shop_name}"></a></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td align="left">Hi <strong style="color: rgb(219, 52, 132);">{firstname}
{lastname}</strong>,<br>
<br>
Thank you for shopping with <strong>{shop_name}</strong>!</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td
style="padding: 0.5em 1em; background-color: rgb(219, 52, 132); color: rgb(255, 255, 255); font-size: 12px; font-weight: bold;"
align="left">Order details</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td align="left">Order: <strong><span
style="color: rgb(219, 52, 132);">{order_name}</span> placed on {date}</strong>
<br>
Payment: <strong>{payment}</strong></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td align="left">{products} {discounts}
<table
style="width: 100%; font-family: Verdana,sans-serif; font-size: 11px; color: rgb(55, 73, 83);">
<!-- Title --><tbody>
<tr
style="background-color: rgb(185, 186, 190); text-align: center;">
<th style="padding: 0.6em 0pt; width: 15%;">Reference</th>
<th style="padding: 0.6em 0pt; width: 35%;">Product</th>
<th style="padding: 0.6em 0pt; width: 15%;">Unit price</th>
<th style="padding: 0.6em 0pt; width: 15%;">Quantity</th>
<th style="padding: 0.6em 0pt; width: 20%;">Total price</th>
</tr>
<!-- Products --><!-- Footer: prices -->
<tr style="text-align: right;">
<td> </td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(185, 186, 190);"
colspan="3">Products</td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(185, 186, 190);">{total_products}</td>
</tr>
<tr style="text-align: right;">
<td> </td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(235, 236, 238);"
colspan="3">Discounts</td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(235, 236, 238);">{total_discounts}</td>
</tr>
<tr style="text-align: right;">
<td> </td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(235, 236, 238);"
colspan="3">Gift-wrapping</td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(235, 236, 238);">{total_wrapping}</td>
</tr>
<tr style="text-align: right;">
<td> </td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(221, 226, 230);"
colspan="3">Shipping</td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(221, 226, 230);">{total_shipping}</td>
</tr>
<tr style="text-align: right; font-weight: bold;">
<td> </td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(241, 174, 207);"
colspan="3">Total paid</td>
<td
style="padding: 0.6em 0.4em; background-color: rgb(241, 174, 207);">{total_paid}</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td
style="padding: 0.5em 1em; background-color: rgb(219, 52, 132); color: rgb(255, 255, 255); font-size: 12px; font-weight: bold;"
align="left">Shipping</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td align="left">Carrier: <strong>{carrier}</strong></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>
<table
style="width: 100%; font-family: Verdana,sans-serif; font-size: 11px; color: rgb(55, 73, 83);">
<tbody>
<tr
style="background-color: rgb(185, 186, 190); text-transform: uppercase;">
<th style="padding: 0.3em 1em; text-align: left;">Delivery
address</th>
<th style="padding: 0.3em 1em; text-align: left;">Billing
address</th>
</tr>
<tr>
<td
style="padding: 0.5em 0pt 0.5em 0.5em; background-color: rgb(235, 236, 238);">{delivery_block_html}</td>
<td
style="padding: 0.5em 0pt 0.5em 0.5em; background-color: rgb(235, 236, 238);">{invoice_block_html}</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td align="left">You can review your order and download your
invoice from the <a
style="color: rgb(219, 52, 132); font-weight: bold; text-decoration: none;"
href="%7Bshop_url%7Dhistory.php">"Order history"</a> section of your
customer account by clicking <a
style="color: rgb(219, 52, 132); font-weight: bold; text-decoration: none;"
href="%7Bshop_url%7Dmy-account.php">"My account"</a> on our shop.<br>
<br>
</td>
</tr>
<tr>
<td align="left">If you have guest account, you can follow your
order via the <a
style="color: rgb(219, 52, 132); font-weight: bold; text-decoration: none;"
href="%7Bshop_url%7Dguest-tracking.php">"Guest Tracking"</a> section
on our shop.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td
style="border-top: 1px solid rgb(217, 218, 222); font-size: 10px;"
align="center"><a
style="color: rgb(219, 52, 132); font-weight: bold; text-decoration: none;"
href="%7Bshop_url%7D">{shop_name}</a> powered by <a
style="text-decoration: none; color: rgb(55, 73, 83);"
href="http://www.prestashop.com/">PrestaShop™</a></td>
</tr>
</tbody>
</table>
</body>
</html>

Thanks.

CartExpert.net · December 23, 2013

If you didn't modify the PaymentModule.php file, your products are displayed in <tr></tr> rows, that should not be added simply into a <td></td> cell, which is what happening in your case.

{products} {discounts}

should go right after

Regards.

Robin.

The CartExpert Team

Edited December 23, 2013 by CartExpert.net (see edit history)

mtm · December 23, 2013

Hi Robin,

As far as i know, the PaymentModule.php filewasn't modified.

I don't understand what you mean... I uploaded in attachment the order_conf,html. Can you check it and see what's wrong with it? The tables get all misconfigured differently from different webmails. Check the pics. The orders where made with a couple of minutes from eachother and with different "clients".

How come the template displays like this? Again, the html template was copied from a Prestashop installation... I realy don't get it and i need that.

Thanks.

order_conf.html

CartExpert.net · December 23, 2013

{products} {discounts}

should go right after

In your case the {products} {discounts} is way before , so should be like:

{products} {discounts}

{products} {discounts} they display table rows and they are not valid if not displayed in a <table> or <tbody> tag.

Currently what you have is:

<td>
<tr><td>product name</td>[ETC]</tr>
<tr><td>product name</td>[ETC]</tr>
<tr><td>product name</td>[ETC]</tr>
</td>

which is incorrect

Correct is

<table>
<tr><td>product name</td>[ETC]</tr>
<tr><td>product name</td>[ETC]</tr>
<tr><td>product name</td>[ETC]</tr>
</table>

Regards.

Robin.

The CartExpert Team

Edited December 23, 2013 by CartExpert.net (see edit history)

mtm · December 23, 2013

Hi Robin,

Thanks a lot! I will inspect and compare; modify and hopefully understand what - and mostly why - this is happening.

Just out of curiosity: the html file that i attach was a copy from a PS download (1.4.7 i belive). Why is the template like that?

CartExpert.net · December 23, 2013

NO, the attached file is also wrong.

Attached is the corrected file.

Regards.

Robin.

The CartExpert Team

order_conf.html

Edited December 23, 2013 by CartExpert.net (see edit history)

mtm · December 23, 2013

Thanks Robin! It works now!

I just don't know what happened but mostly, why was the template that i copied from a clean PS download wrong?

CartExpert.net · December 23, 2013

I can't answer that. ))

Regards.

Robin.

The CartExpert Team

fercaldas · April 8, 2020

On 12/23/2013 at 3:40 PM, CartExpert.net said:

NO, the attached file is also wrong.

Attached is the corrected file.

Regards.

Robin.

The CartExpert Team

order_conf.html 4.6 kB · 67 downloads

Hi @CartExpert.net
Friend, I have the exact same issue !!!
The file is virgin.... I just rename it.

BUT, the source code is quite different (Theme Classic), I cannot find the error...😫

Could you PLEEEEEEAAAAAASE give me a hand here??

#STAYSAFE !!!

***************EDIT
I forgot mentioning that my instalation is 1.7.6.4... I'm reviewing here and there is another file: order_conf_product_list.tpl
Maybe that one has the problem!

thx

order_conf_BKP.html

order_conf_product_list.tpl

Edited April 8, 2020 by fercaldas (see edit history)

GoHuFlame · April 22

themes/yourtheme/mails/yourlanguage/order_conf.html

find this: {products} {discounts}
and move here:

<th bgcolor="#FDFDFD" style="font-family: Open sans, Arial, sans-serif; font-size: 12px; background-color: #fdfdfd; color: #353943; font-weight: 600; padding: 10px 5px; border: 1px solid #DFDFDF;">Total Price</th>
</tr>
{products} {discounts}  
<tr class="order_summary">
<td bgcolor="#FDFDFD" colspan="3" align="right" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; font-family: Open sans, Arial, sans-serif; background-color: #fdfdfd; color: #353943; font-weight: 600; font-size: 14px; padding: 10px; border: 1px solid #DFDFDF;">Products</td>

[SOLVED] order_conf.html template layout messed up!

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in