{"id":11473,"date":"2016-02-15T07:08:00","date_gmt":"2016-02-15T07:08:00","guid":{"rendered":"https:\/\/viewmyprojects.com\/winwirewp\/?p=11473"},"modified":"2023-11-06T03:42:21","modified_gmt":"2023-11-06T03:42:21","slug":"mso-conditional-statement-for-outlook-client","status":"publish","type":"post","link":"https:\/\/viewmyprojects.com\/winwirewp\/blog\/mso-conditional-statement-for-outlook-client\/","title":{"rendered":"MSO Conditional Statement for Outlook Client"},"content":{"rendered":"\n<p>While working with Emails, we might have a situation where we might have to show the email content differently for outlook and other clients. For example, show some text in outlook and on the other hand show some other content with buttons in another client instead of the text.<\/p>\n\n\n\n<p>This can be accomplished by using the conditional statements in the email content templates especially in the body of the message. These conditional statements work with the Microsoft Outlook 2003 and higher versions.<\/p>\n\n\n\n<p><strong>Syntax:<br><\/strong><br>\u2022 &lt;!\u2013[if mso]&gt;<br>Content to be displayed on outlook client<br>&lt;![endif]\u2013&gt;<\/p>\n\n\n\n<p>The IF MSO-END IF conditional statement when used in the email body, displays the content in the email intended to be shown when the email is opened in the Microsoft Outlook.<\/p>\n\n\n\n<p>\u2022 &lt;!\u2013[if !mso]&gt;&lt;!\u2013 \u2013&gt;<br>Content to be displayed in other clients<br>&lt;!\u2013&lt;![endif]\u2013&gt;<\/p>\n\n\n\n<p>The IF NOT MSO-END IF conditional statement when used in the email body, displays the content in the email intended to be shown when the email is opened in the other clients than Outlook i.e., Webmail, Mobile Browsers etc.<\/p>\n\n\n\n<p>In addition to the IF NOT MSO-END IF statement for non-Outlook clients, a specific style \u2018mso-hide: all\u2019 needs to be added to the container elements i.e. tables\/div elements in HTML to hide the content in Microsoft Outlook.<\/p>\n\n\n\n<p>Following is an example illustrating the MSO Conditional statements. The content provided for the email template includes the styling as well.<\/p>\n\n\n\n<p>Consider the following string as an email template body used to send in the email. This is hard coded in the code I used to send the email.<\/p>\n\n\n\n<p>\u201cTest the Email Content using MSO tag: &lt;!\u2013[if mso]&gt;Outlook Client Email Text&lt;![endif]\u2013&gt;&lt;!\u2013[if !mso]&gt;&lt;!\u2013 \u2013&gt;&lt;head&gt;&lt;style&gt; .btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: 400;line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; background-image: none; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;border: 1px solid transparent; border-radius: 4px; } .btn-primary{color:#fff;background-color:#5bc0de;border-color:#46b8da}&lt;\/style&gt;&lt;\/head&gt;&lt;table border=\u20190\u2032 cellpadding=\u20190\u2032 cellspacing=\u20190\u2032 width=\u2019100%\u2019 style=\u2019mso-hide:all\u2019&gt;&lt;tr&gt;&lt;td&gt;&lt;a href=\u2019http:\/\/google.com\u2019 class=\u2019btn btn-primary\u2019&gt;Click Me\u2026&lt;\/a&gt;&lt;\/td&gt;&lt;\/tr&gt;&lt;\/table&gt;&lt;!\u2013&lt;![endif]\u2013&gt;\u201d<\/p>\n\n\n\n<p>When I executed my code to send an email, I received the email and checked them in both the clients \u2013 Outlook and non-outlook.<\/p>\n\n\n\n<p><strong>Outlook Email:<\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"605\" height=\"221\" src=\"https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/screen1-1.jpg\" alt=\"\" class=\"wp-image-11474\" srcset=\"https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/screen1-1.jpg 605w, https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/screen1-1-300x110.jpg 300w\" sizes=\"auto, (max-width: 605px) 100vw, 605px\" \/><\/figure><\/div>\n\n\n<p><strong>Other Client Email (Webmail):<\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"784\" height=\"281\" src=\"https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/Screen.png\" alt=\"\" class=\"wp-image-11475\" srcset=\"https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/Screen.png 784w, https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/Screen-300x108.png 300w, https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2022\/05\/Screen-768x275.png 768w\" sizes=\"auto, (max-width: 784px) 100vw, 784px\" \/><\/figure><\/div>\n\n\n<p>If the above screenshots are observed, we can find that the content intended to be shown in the Microsoft Outlook Client is hidden in the Webmail and vice versa. The styling could also be observed for the buttons in the Webmail. The same content that is shown in the Webmail will be shown in any other device browsers except Microsoft Outlook.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>While working with Emails, we might have a situation where we might have to show the email content differently for outlook and other clients. For example, show some text in outlook and on the other hand show some other content with buttons in another client instead of the text. This can be accomplished by using&hellip; <a class=\"more-link\" href=\"https:\/\/viewmyprojects.com\/winwirewp\/blog\/mso-conditional-statement-for-outlook-client\/\">Continue reading <span class=\"screen-reader-text\">MSO Conditional Statement for Outlook Client<\/span><\/a><\/p>\n","protected":false},"author":31,"featured_media":16758,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_eb_attr":"","_uag_custom_page_level_css":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-11473","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","entry"],"acf":[],"featured_image_src":"https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp","author_info":{"display_name":"Sree Navya","author_link":"https:\/\/viewmyprojects.com\/winwirewp\/author\/sreenavya\/"},"views":4340,"uagb_featured_image_src":{"full":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp",800,440,false],"thumbnail":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso-150x150.webp",150,150,true],"medium":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso-300x165.webp",300,165,true],"medium_large":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso-768x422.webp",750,412,true],"large":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp",750,413,false],"1536x1536":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp",800,440,false],"2048x2048":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp",800,440,false],"post-thumbnail":["https:\/\/viewmyprojects.com\/winwirewp\/wp-content\/uploads\/2023\/11\/mso.webp",800,440,false]},"uagb_author_info":{"display_name":"Sree Navya","author_link":"https:\/\/viewmyprojects.com\/winwirewp\/author\/sreenavya\/"},"uagb_comment_info":0,"uagb_excerpt":"While working with Emails, we might have a situation where we might have to show the email content differently for outlook and other clients. For example, show some text in outlook and on the other hand show some other content with buttons in another client instead of the text. This can be accomplished by using&hellip;&hellip;","_links":{"self":[{"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/posts\/11473","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/users\/31"}],"replies":[{"embeddable":true,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/comments?post=11473"}],"version-history":[{"count":1,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/posts\/11473\/revisions"}],"predecessor-version":[{"id":16835,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/posts\/11473\/revisions\/16835"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/media\/16758"}],"wp:attachment":[{"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/media?parent=11473"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/categories?post=11473"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/viewmyprojects.com\/winwirewp\/wp-json\/wp\/v2\/tags?post=11473"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}