Using css in a StringTemplate Email

Question

I'm currently using StringTemplate to create my emails on the fly and its proven very easy to use in creation of the email. However, I'm trying to apply some styling to my emails and dont seem able to do this in the normal manner.

I can style parts of the mail if I write it inline, eg.

<p style="color:red;">Hello again, $name$ !</p>

will print the message in a red text.

But if I express a class like the following in my template:

<html>
<head>
   <title>Notification</title>       
</head>
<style>
    .myClass {
        text-decoration:underline;
           color:blue;
    }
   </style>
<body>      
    <p style="color:red;">Hello again, $name$ !</p>
    <p class="myClass">Here is your daily update</p>



   </body>
</html>

The paragraph with the "myClass" class isn't outputted in blue with an underline. I've tried importing stylesheets also but this didn't work.

Any help much appreciated,

-gearoid.

UPDATE: Looks at though it could be a gmail issue. If I view the mail on my iPhone it displays as expected...looks as though it'll have to all be done inline :(

Useful for future reference: http://www.campaignmonitor.com/css/

Is the template rendered correctly? In this case it doesn't have anything to do with StringTemplate. — zedoo, Dec 09 '09 at 13:39

score 2 · Accepted Answer · answered Dec 09 '09 at 13:53

2

Please by wary of using stylesheets in your email templates as many email clients strip all content from the <HEAD> and simply display anything inside the <BODY> tags.

For this reason it is recommended that you use inline CSS only for complete cross-platform compliance.

answered Dec 09 '09 at 13:53

Corey Ballou

42,389
8
62
75

2

As a side note I know this is a pain in the a**. – Corey Ballou Dec 09 '09 at 13:54
It certainly is a pain - isn't there a better way? – Gerard Dec 09 '09 at 14:16
The best thing you could do is generate a bunch of variables containing strings of inline styles that you use often and use those for output. This would more or less mimic you creating a stylesheet and adding classes and ID tags to your HTML. – Corey Ballou Dec 09 '09 at 14:52

score 0 · Answer 2 · answered Dec 09 '09 at 13:39

0

Especially Firefox can be picky about content type. Try

<style type="text/css">

answered Dec 09 '09 at 13:39

Pekka

442,112
142
972
1,088

No joy with that solution I'm afraid :( – Gerard Dec 09 '09 at 14:17
Ah, I didn't see you were writing a mail. You'll probably have to do it inline then ... – Pekka Dec 09 '09 at 14:21

Using css in a StringTemplate Email

2 Answers2