For emails I use conditional comments in order to make UI adjustments for Outlook '07+. When saving in TinyMCE it adds a space changing
this
<!--[if gte mso 9]>
to this
<!-- [if gte mso 9]> (with space before the [)
which doesn't get interpreted by Outlook anymore.
Any idea if there is a setting in TinyMCE to prevent this change?
--
Secondary: In case this is easy to add, I'd ideally would like comments to also not be moved to the previous line, but couldn't find a setting for this either.
Example:
Some text
<!-- Outlook hack here -->
<!--[if gte mso 9]>
<tag>
should not become
Some text <!-- Outlook hack here --> <!-- [if gte mso 9]>
<tag>
We had this problem and solved it by adding
allow_conditional_comments: true
Example below taken directly from the documentation: https://www.tiny.cloud/docs/configure/content-filtering/
tinymce.init({
selector: 'textarea', // change this value according to your HTML
allow_conditional_comments: true
});
I'm not sure how to best solve the second question.
Related
I'm trying to get a circular image to appear in an HTML email. So far it's working in all clients except for Outlook 2013 and Outlook 2016 (Windows 7).
I found some VML tutorial that says this should do the trick:
<v:oval style="width:100;height:100">
<v:fill src="https://www.placebear.com/100/100.jpg" type="frame">
<v:/fill>
</v:oval>
However I tried it with conditional comments
<!--[if !mso]><!-- -->
<v:oval style="width:100;height:100">
<v:fill src="https://www.placebear.com/100/100.jpg" type="frame">
<v:/fill>
</v:oval>
<!--<![endif]-->
and nothing appeared.
Anybody have a working solution? Border-radius is doing the trick for every othe client but Outlook, because of course...
I'd suggest changing your Outlook conditionals to this.
<!--[if (gte mso 9)|(IE)]>
<![endif]-->
Currently, you are hiding it from Outlook. If the VML proves too troublesome I'd recommend using a rounded image asset on a transparent background.
I have a HTML text with <!--[if gte mso 9]> and <![endif]--> tags. I want to remove everything that there is between those two tags.
I'm using the ruby function gsub with a Regex expression, but it won't work.
This is what I've tried:
text = "<!--[if gte mso 9]><xml>\n <w:WordDocument>\n [...] \n</style>\n<![endif]-->"
text2 = text.gsub /(?=<!\-\-\[if gte mso 9\]>)(.*?)(?<=<!\[endif\]\-\->)/, ""
What I want as an answer is:
text2 = "<!--[if gte mso 9]><![endif]-->"
Or even:
text2 = ""
I tried this based on this article
I've tried this online Regex tester and, it seems to be the right way to do it, but it won't work on my program!
Please help!
Thanks in advance!
Try this regex /(?<=<!--\[if gte mso 9\]>).*?(?=<!\[endif\]-->)/m, and do a gsub on the string. You will get <!--[if gte mso 9]><![endif]-->
(?<=<!--\[if gte mso 9\]>) is a positive look behind, which matches the <!--\[if gte mso 9\]> string, but doesn't include it in the result.
.* matches any characters 0 or more times.
(?=<!\[endif\]-->) is a positive look forward, which matches the <!\[endif\]--> but doesn't include it in the result.
the m identifier at the end means the match multiline strings. Since you declared your string with "", the \n will be interpreted as a new line.
Essentially, you are matching everything in between the two tags.
In your regex, /(?=<!\-\-\[if gte mso 9\]>)(.*?)(?<=<!\[endif\]\-\->)/, you used the positive look forward for the first tag, and positive look behind for the second tag, you need to flip them.
Positive look forward matches a group after the main expression without including it in the result.
Positive look behind matches a group before the main expression without including it in the result.
I have an outlook specific conditional statement that I can't seem to get to render in XSL. I've tried saving them as variables and printing them, putting them in tags... All with no luck.
Below is the code:
<!--[if gte mso 9]>
... code ...
<![endif]-->
Any ideas?
I have an outlook specific conditional statement that I can't seem to get to render in XSL.
What you are showing is an XML comment (<!-- comment -->) . Therefor you may try:
<xsl:comment>[if gte mso 9]>
... code ...
<![endif]</xsl:comment>
As an alternative you can use disable-output-escaping="yes" with <![CDATA[. Try:
<xsl:text disable-output-escaping="yes">
<![CDATA[ <!--[if gte mso 9]>
... code ...
<![endif]--> ]]>
</xsl:text>
I have this html line
I am trying to make it so that when IE reads that line, it changes the "listHr" id to "listhrIE".
I have tried this, in an attempt to switch out the line altogeather, but no luck:
<hr id="listHr"></hr> <!--[if IE]><id="listHrIE"></hr><![endif]-->
I am sure I am doing this wrong. What is the correct way of doing this?
Thanks.
IE tags have a "not IE" component.
<!--[if IE]>
<hr id="listHrIE"></hr>
<![endif]-->
<![if !IE]>
<hr id="listHr"></hr>
<![endif]>
However I'd offer a better way to do it would be to just override the style of listHr when IE is detected
As #Paulie_D pointed out: conditional tags are deprecated and won't work for IE 10 and above. You can use a special meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
to force them to work however this is not recommended. See here: http://msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx
try these:
<!--[if !IE]><hr id="listHr"></hr><!-->
<!--[if IE]><hr id="listHrIE"></hr><!-->
if you want set this id for some version of IE, you can do this:
greater and equal IE8:
<!--[if gte IE 8]><!-->
less and equal IE8:
<!--[if lte IE 8]><!-->
equal IE8:
<!--[if IE 8]><!-->
You can use IE only conditional tags to detect IE.
Just like:
<!--[if IE ]>
<p>Welcome to Internet Explorer 8.</p>
<![endif]-->
So, In your case you need two things to change ID.
1) Display IE only ID
2) Hide non-IE ID
To apply IE only ID you need following conditional tag code
<!--[if IE ]>
<div id="listHrIE"></hr>
<![endif]-->
To hide non-IE ID you need to add display:none
<!--[if IE ]>
<div id="listHrIE"></div>
<div id="listHr" style="display:none"></div>
<![endif]-->
Now you can style your IE Only ID in way you want and it will only replace listHr when IE detects.
Update: To target IE 10 Use following jQuery: Before using add jQuery Migrate
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script> This line
to your page<head>
Then add
if ($.browser.msie && $.browser.version == 10) {
$("html").addClass("ie10");
}
I hope this helps :)
I need some particular css for an html email, but only in outlook.
I'm looking for the outlook equivalent of
<!--[if IE]>body {background-color:red} <![endif]-->
<!--[if gte mso 9]
// This CSS will only be seen in Outlook 2007
![endif]-->