Hi
After migrating to v5 I have this annoying problem with email templates where the text is always aligned in the center.
I looked into the css and I found thys styling, but I don’t understand where can i make the change to align text left.
div style=“border: 1px solid #c2c2c2 ; border-top: none; border-bottom: none; padding: 20px; text-align: left” id=“content”
david
June 24, 2022, 9:54am
3
@fxdamian
Within the template you can override the alignment by wrapping the content in a div, for example the invoice template looks like this:
<div style="text-align:left;">
<p>$client<br>
<br>Reminder for invoice $number for $balance</p>
</div>
<div class="center">$view_button</div>
This is very buggy, unless I am being very stupid, which is quite possible.
Where should I be editing the template?
Settings - Templates & reminders.
Then select template on the right side with the pulldown menu.
How do I align the button left?
hillel
July 30, 2023, 5:23pm
7
Try this
<div style="text-align:left;">
<p>$client<br>
<br>Reminder for invoice $number for $balance</p>
<div>$view_button</div>
</div>
hillel
July 31, 2023, 3:38am
9
Another option to try is to reset the template to the default on Settings > Templates & Reminders and then set the “Email alignment” option to “Left” on Settings > Email Settings.
I couldn’t find the option in the react app but in the flutter app it is set already:
The problem is the table align attribute on the table around the a tag:
<table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation">
<tbody><tr>
<td align="center" class="new_button" style="border-radius: 2px; background-color: #0398FC">
<a href="XXX" target="_blank" class="new_button" style="text-decoration: none; border: 1px solid #0398FC; display: inline-block; border-radius: 2px; padding-top: 15px; padding-bottom: 15px; padding-left: 25px; padding-right: 25px; font-size: 20px; color: #fff">
<singleline label="cta button">Jetzt bezahlen</singleline>
</a>
</td>
</tr>
</tbody>
</table>
hillel
July 31, 2023, 7:05am
11
@david do you have any suggestions?
david
August 4, 2023, 11:15pm
13
Hi there,
the $view_button place holder defaults the content to the center, if you prefer to left align, simply remove the $view_button placeholder, cut and paste the next you have above, and set the left alignment on the td… more info here
In this Loom video, I will show you how to align buttons in a template. By default, the template variable view button will center everything for you. However, if you want to align the button to the left, you can remove the template holder and paste...
Duration: 33.496
1 Like
@david too simple, but I didn’t manage to think out of the box thanks a lot