• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.5 Style e-mail elements

RichardKYA

Well-known member
#1
Hello,

I've styled all the e-mail templates, but I can't find where to edit and style the e-mail elements, quotes, etc. They still display as the XF default style...
Screen Shot 2015-09-05 at 20.43.59.jpg

Where can I style these to match my custom style?

Thank you
 

RichardKYA

Well-known member
#2
Hi all,

Anyone have any input at all on this please? It's pretty much the last thing that needs customizing on my site and it's kind of annoying to receive an e-mail that doesn't fit the look and feel of the rest of the site.

Thanks :)
 

Freelancer

Well-known member
#3
I have the same problem like @RichardKYA

It seems like if there is a quoted text inside a thread reply eMail, that the eMail template placeholder "{xen:raw $reply.messageHtml}" (for example) does not use the current selected Style CSS from the frontend but the default style only. I was able to completely adapt the eMails via template mods to my design but this is the bottleneck.

Is there any chance to tweak this? And if yes, where do I have to look?
 
#4
This warrants a response... seems like an important and basic feature to let linger on for so long?

Alternatively, would it be possible to offload or send the XF E-mail content via API to a provider like Mandrill where we can create our own templates? We have Mandrill set up to process our e-mails but that's all it does... we have no way to edit the e-mail contents through Mandrill, only through XF admin.
 

Arty

Well-known member
#5
I've been using customized emails on my forum for about half a year. Several customers asked for possibility to change emails to match forum style, so currently (among few other things, so its going slowly) I'm working on add-on that makes email layout easy to customize.

No ETA yet.
 

Freelancer

Well-known member
#6
I'm working on add-on that makes email layout easy to customize.
Shut up, take my money... :D

change emails to match forum style
That would be the answer to all trouble... I think if eMails "just" draw their properties from the specific user's forum frontend style selected (the usual suspects "primaryContent", "secondaryContent", "discussionListItem" etc etc etc) plus an extra "email.css" to adjust and tweak for HTML responsive eMail if necessary, it would be genius.
 

Arty

Well-known member
#8
Add-on development is in progress.

I've just finished working on first part - automatically adjusting layout to selected style. Add-on retrieves style properties of selected style and changes email layout to match those style properties.

Few screenshots of topic reply notification email with different popular styles applied to it:

test_basic.png test_xenith.png test_fragzone.png test_uix.png test_quark.png test_latte.png test_uix_dark.png test_pulse.png test_elegance.png test_graphite.png

Due to vast difference between what's available in style properties and code in email templates for default style, emails don't perfectly match selected style. That's where second part of development comes in - ability to customize email layout in admin panel.
 

Freelancer

Well-known member
#9
Oh wow.... that is impressive. :)(y) Cant wait to have it. Solves all eMail styling problems.

Great you add possibilities to tweak it in Admin CP. That would be like having an "EXTRA.CSS" for eMails. Then even add-ons from third parties should not be a problem.
 

Arty

Well-known member
#11
Thanks!
Great you add possibilities to tweak it in Admin CP. That would be like having an "EXTRA.CSS" for eMails. Then even add-ons from third parties should not be a problem.
It won't be like that, more like style properties. Each element has style: wrapper around all email, header, link in header, etc. That style is simple list of CSS rules.

Customizer will show you list of possible elements, split into sections for better readability. You can tweak CSS rules for each element.

In addition to customizing CSS you will also be able to customize HTML code in header and footer. You can put your logo there, add some text or something like that.
 

RichardKYA

Well-known member
#16
Is there any chance to tweak this? And if yes, where do I have to look?
If you're still interested, I've just found where to style the quoted text :D

I was looking for something else and stumbled upon it in here...

library/Xenforo/BBCode/Formatter/HtmlEmail.php

Code:
if ($name)
     {
       $name = '<tr><td style="
         background-color: #F9D9B0;
         border: 1px solid #F9D9B0;
         border-bottom-color: #F9BC6D;
         border-radius: 4px;
         font-size: 11px;
         font-family: \'Trebuchet MS\', Helvetica, Arial, sans-serif;
         line-height: 1.4;
         padding: 3px 8px;
         margin: 0;
         color: #141414">' . $name . '</td></tr>';
     }

     return '<table cellpadding="0" cellspacing="0" border="0" width="100%" style="<rtlcss>
       background-color: #FFF4E5;
       border: 1px solid #F9D9B0;
       border-radius: 5px;
       margin: 1em 86px 1em 0</rtlcss>">' . $name . '<tr>
       <td style="
         font-size: 9pt;
         font-style: italic;
         font-family: Georgia, \'Times New Roman\', Times, serif;
         line-height: 1.4;
         padding: 10px;
         margin: 0">' . $content . '</td></tr></table>';
Obviously if you do edit this, be sure to make a backup first and keep a record of your edits