WordPress.org

1. douglerner
   Member
   Posted 11 months ago #
   

   Subscribe2 functionally works, but the HTML notifications really look... blah. Like something out of 1995.

   With the default twenty eleven theme it looks like this:

   http://www.flickr.com/photos/43033891@N03/7384752672/in/set-72157630156360370/

   I tried some other themes, and it's not any better.

   I know the method for customizing is to add your own CSS to a theme. Do any examples of nice looking email notifications CSS exist which we can just plug in to our themes?

   Thanks,

   doug

2. mattyrob
   Member
   Posted 11 months ago #
   

   @Doug,

   CSS is only half of the story. HTML is the other half and it tells the CSS where it is needed. This is usually done by using DIV tags with an appropriately named class or id.

   So, what does all this mean? It means you need to select the theme you want for your site and then apply DIV tags with classes or id to the Subscribe2 templates so that the CSS from your theme is pulled into the HTML emails. As an example my Subscribe2 notification template looks like this:

   <div id="main"><div id="content"><img src="http://www.mysite.com/wp-content/uploads/mail_header.png" />
   {BLOGNAME} has posted a new item, '{TITLE}'

   <div class="post">{POST}</div>

   You may view the latest post at
   {PERMALINK}

   You received this e-mail because you asked to be notified when new updates are posted. To change your settings or unsubscribe visit {BLOGLINK}/subscriptions/.

   Best regards,
   {MYNAME}
   {EMAIL}</div></div>

3. douglerner
   Member
   Posted 11 months ago #
   

   Matty,

   When "use CSS from theme" is selected it appears to be doing something like that. The problem is none of the themes look nice as email notifications. They weren't designed for that. You either end up with the really poor looking email notification you get for twenty eleven, or a nightmarish illegible mishmosh, depending on the theme. The blog themes just weren't designed for email notifications.

   Compare with, say, the one-size-fits-all email notifications from Jetpack, which looks like the standard wordpress.com notifications (which ignore the current theme). At least those email notifications look very nice.

   You would admit the idea of just "use the CSS from the current theme" results in bad looking notifications, right?

   I'm just wondering if there are any samples of nice looking notification CSS that we can add to our current theme and then surround the email templates with appropriate divs so they make use of the added CSS. Even if it doesn't match the theme.

   Thanks,

   doug

4. mattyrob
   Member
   Posted 11 months ago #
   

   @Doug,

   I use the template I pasted above to theme my emails to look like my site. I have a distinctive look to my site that is replicated in my emails so any user reading the HTML email should instantly know where it came from.

   That said, I personally dislike HTML emails and always opt to get plain text emails myself when subscribing to notifications.

   So, in answer to your specific question. No, there are no off-the-shelf CSS notification templates.

5. douglerner
   Member
   Posted 11 months ago #
   

   Matty, what's the difference between using that template and checking the use theme CSS box?

   Thanks,

   doug

6. douglerner
   Member
   Posted 11 months ago #
   

   I see if I turn off the theme css and just do it all with inline styles that works.

   I'm definitely not a CSS designer, but I think this one I came up with looks decent enough.

   http://www.flickr.com/photos/43033891@N03/7391293320/in/photostream

   Thanks,

   doug

Reply

You must log in to post.