I want use a webfont in a odoo email template.
My code was:
<link href="https://fonts.googleapis.com/css?family=Molle:400italic" rel="stylesheet" type="text/css">
<p style="font-family: 'Molle', cursive; font-size: 24px;">test text in schreibschrift</p>
I believe odoo filter the email code before sending and removes some html tags.
The link tag is not in the received email, as shown in Thunderbird.
How can i bypass this?
Related
I'm creating a HTML email newsletter. I'm using webfonts served by Typekit. It is well documented that versions of Outlook using Microsoft Word to render the email don't use the specified fallback font, but Times New Roman (see https://litmus.com/blog/the-ultimate-guide-to-web-fonts).
The work around is to target Outlook and use a different font stack:
<!--[if mso]>
<style type=”text/css”>
h1 {
font-family: Arial, sans-serif;
}
</style>
<![endif]-->
My question is: where does this code go?
In the <head>?
In the <body>?
I'm guessing it goes in the <head>, but below the main CSS hence below the </style>?
But I've noticed that when I import the code into my Email Service provider (Direct Mail for Mac) strips out this "invisible code". Why is the code between <!-- --> surely this makes the code invisible/not work?
It may be a little confusing, but email clients read if/else statements even if they are hidden by <!-- -->.
Email clients interpret this as please do: <!--[if !mso]><!-- --> and Outlook interprets it as please ignore. This does just the opposite: <!--[if (gte mso 9)|(IE)]><!-- -->
Example:
https://jsfiddle.net/wallyglenn/5hruzos5/
Outlook Desktop client does not work with most webfonts like Google fonts. Instead of using a fallback font, Outlook will use it's own fallback font, Times New Roman. This is great if you're using a serif font, but if you're not, it can seriously affect the look of your email.
Using if/else, you can target Outlook specifically to use a websafe fallback font by creating a custom style sheet. The preferred location is after the style sheet you use to target all email clients, since the last style listed is the one that gets used. If your email calls for a webfont like Gotham or Lato, this style sheet will direct Outlook to use Arial or a sans-serif font:
<head>
<style type="text/css>
css for email clients
</style>
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
body, table, td, a, h1, p {font-family: Arial, sans-serif !important;}
</style>
<![endif]-->
</head>
The reason for the gte mso9 is that Outlook 2007 (mso version 9 and above) started using Microsoft Word as a formatting engine. This caused compatibility issues with web standards, but helped ensure that a document designed in Word looks appropriate in Outlook email. You can target specific versions of Outlook by using the mso number.
An example of if/else in email body:
<!--[if (gte mso 9)|(IE)]><!-- -->
starting code for Outlook specific thingy
<![endif]-->
[fallback goes here]
<!--[if (gte mso 9)|(IE)]>ending code if needed<![endif]-->
I hope that helps.
Good luck with Outlook.
There is a domain address and from this domain we send emails to users. The problem is that Gmail users don't receive any email, not even to spam (except a case, when an email arrived to spam). The users who have Yahoo email addresses receive emails into inbox.
So I suppose that Gmail has put the domain in blacklist for some reason.
I tried to find out the cause of the problem. So I have tried MXtoolbox. Here is a screenshot:
So I saw that the domain is on 2 blacklists, and dmarc Missing or Invalid Record.
The error:
AES128-SHA:128 CV=yes DN="/C=US/ST=California/L=Mountain View/O=Google
Inc/CN=mx.google.com": SMTP error from remote mail server after end of
data: 550-5.7.1 [Server Ip address] The IP address sending this
message does not have a\n550-5.7.1 P...
This is a generic template used for any emails:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title><!--{$domain_name}--></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body marginheight="0" marginwidth="0" leftmargin="0" topmargin="0" bgcolor="#ffffff" style="background-color: #FFFFFF; text-align: center;">
<div style="width: 701px;margin-left: auto;margin-right: auto;text-align:left;">
<img style="margin:0;" src="<!--{$main_site_address}-->/images/email/<!--{$domain_name}-->.png" alt=""><div style="border-left: 2px solid #8fd5fe;border-right: 2px solid #8fd5fe;color:#044269;font:15px 'Times New Roman', Times, serif;">
<div style="padding: 6px;">
<!--{$messageBody}-->
</div>
</div>
<img src="<!--{$main_site_address}-->/images/email/bottom-img.gif" alt="" width="701" height="23">
</div>
</body>
</html>
$messageBody is filled with some custom templates. These are:
register:
Thank you for registering at <!--{$domain_name}-->,
<br/>
<br/>
In order to finish the registration process, please click on the following link
<br/>
<!--{$domain_name}-->/activate.php to validate your email.
<br/>
<br/>
If you have questions please do not reply to this email, please send your questions to <!--{$help_email}-->
Forgot password:
Hello, <!--{$firstName}--> <!--{$lastName}-->. <br/>
<br/>
A new password request has been made for your account, if this is your request, use the following link to get a new password:
<br>
<!--{$site_address}-->register.php?a=reset_password&code=<!--{$code}--><br/><br/>
Thank you for using <!--{$domain_name}-->, <br/><br/>
If you ever need support or have comments for us contact our Customer Service Team <!--{$domain_name}-->
New Password:
Hello <!--{$firstName}--> <!--{$lastName}-->, <br/>
<br/>
here is your new password: <!--{$password}-->
<br>
Thank you for using <!--{$domain_name}-->, <br/><br/>
If you ever need support or have comments for us contact our Customer Service Team <a href="#" style="color:#119fd7;"><!--{$domain_name}--></a
Ad:
<!--{$label.ad_posted_email_text_part1}--> '<!--{$ad_title}-->' <!--{$label.ad_posted_email_text_part2}--> <!--{$address}-->ad_view.php?id=<!--{$ad_id}-->
What is common approach leading to the solution?
Guluke,
You have to discover the reason why you are blacklisted and google uses it's own private blacklists. Even if you get removed from the public ones in your screenshot. It most likely won't solve your issue with gmail, which can be totally un-related. Also you would want to use a more complete: Blacklist checker
I think it checks over a 100 more than the one you are using. Next you'll want to test your email for everything, try using this Mail Tester it's the best one available.
You just have to peel back the different layers and start ruling things out one by one. I don't see anything wrong with the content you are sending out.
I'd like to send both text and html versions of emails, but have Outlook users always only see the text version. Is this possible?
Trying to target a client through MIME is impossible as far as I can tell. You can however wrap everything inside your HTML <body> (including your style tag if you have one) in:
<body>
<!--[if !mso]><!-->
HTML CONTENT GOES HERE
<!--<![endif]-->
and then right before your closing </body> put the plain text version you want Outlook users to see inside this:
<!--[if gte mso 9]>
PLAIN TEXT GOES HERE
<![endif]-->
</body>
I've been trying to incorporate google webfonts in MailChimp and can't get any solutions to work.
I've tried the approach listed on Campaign Monitor's site using #import:
http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email
but I get this error when trying to preview:
An error occurred parsing your template CSS:
Cannot find a CSS file at: http://fonts.googleapis.com/css?family=Montserrat
Has anyone been able to use custom fonts within MailChimp?
It turns out it's not possible through the #import syntax. It does work using tag:
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
I use custom fonts in all of my emails but not through google. If your having trouble using Google's webfonts I recommend you host the file on your own server and try to use that instead.
For me, I import my webfonts stylesheet like so:
#import url('https://www.mydomain.com/en/img/cms/mail/_a/fonts/fonts.css');
I also add a conditional-comments below my style declarations to enhance webfont fallbacks in outlook. Without this, Outlook will likely substitute your webfont for whatever it feels like, and not respect your fallback font. But if you declare this conditional comment and then wrap your text with an additional span with the class, Outlook will respect your fallback and use the font you decide.
<!--[if gte mso 9]>
<style>
.flowerpwr { font-family:Arial,sans-serif; }
.proxima { font-family:Arial,sans-serif;font-weight:normal; }
.proxima_novasemibold { font-family:Arial,sans-serif;font-weight:normal; }
</style>
<![endif]-->
The html markup looks like this:
<td align="center" style="font-family:'proxima_novaregular',Arial,sans-serif;font-size:16px;letter-spacing:0.04em;color:#333333;">
<span class="proxima">Text here</span>
</td>
This even works for styling image alt text like so:
<td>
<a href="https://www.mylink.com/" target="_blank" style="display:block;font-family:'proxima_novaregular',Arial,sans-serif;color:#666666;font-size:16px;text-align:center;letter-spacing:0.04em;text-decoration:none;outline:none;">
<span class="proxima">
<img src="a3.jpg" alt="STYLED ALT TEXT WITH WEBFONT AND OUTLOOK MAINTAINED FALLBACK" border="0" style="display:block;">
</span>
</a>
</td>
I have been building emails a lot using mailchimp recently and I had been scratching my head over this for a while. These are my findings:
works for google fonts.
#import works for fonts hosted through other sites then google (for ex. your personal site)
using something like:
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
using #import for google fonts gives you an error in mailchimp (like the one horizens posted).
base64 works as well. But the code can get way to long and cause other problems.
Firefox blocks the fonts in Mailchimp preview (because it's https).
PS: different but related topic: Making responsive emails is not as terrible as the people of the internet claim.
this is the first time I work with email forms for Lotus Notes - should the answer be too simple, please forgive me.
What I do is sending an HTML mail with a FORM. Usually Notes opens URLs in such emails in a new browser window - but the email form (or rather the server's response) is opened in a new tab.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
<title>Title</title>
</head>
<body style="width: 600px; padding: 20px; margin: 0px; font-family: Verdana, Arial, sans-serif; font-size: 12px">
...
<form action="http://server/url/" method="post" target="_blank">
...
<div style="margin-top: 30px; text-align: right; padding-bottom: 30px; border-bottom: 2px solid #CCCCCC">
<input type="submit" value="Send" />
</div>
</form>
</body>
</html>
PS: Lotus seems to ignore whether a target="_blank" is set or not.
Any suggestions? I know that you can modify the program's behavior when it is your Notes - but as the tab sometimes has other connections settings (e.g. proxy) than the local browser I'd like to change the behavior "by mail".
Thanks for suggestions!
BurninLeo
Unfortunately browser behavior can't be controlled by the content and needs to be set on the client side. The target attribute is the only thing you can change.
Check your browser settings and what happens when you click on a link in the browser. If it normally opens in a new tab, then setting your target doesn't make a difference, as the new tab is the target.
Before tabbed browsing was introduced, it would always open a new window, but now it just opens a new tab.