{"id":356,"date":"2019-04-03T12:49:30","date_gmt":"2019-04-03T17:49:30","guid":{"rendered":"http:\/\/itblog.ldlnet.net\/?p=356"},"modified":"2019-04-03T12:49:30","modified_gmt":"2019-04-03T17:49:30","slug":"customize-your-outlook-web-app-logon-page","status":"publish","type":"post","link":"https:\/\/itblog.ldlnet.net\/index.php\/2019\/04\/03\/customize-your-outlook-web-app-logon-page\/","title":{"rendered":"Customize your Outlook Web App Logon Page"},"content":{"rendered":"\n<p>As many of you are aware, Microsoft provides a default logon page for OWA, the Outlook Web App. Most companies, like myself want to be able to customize that page so that it suites your organization. Here is what my company OWA page looks like:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"497\" src=\"http:\/\/itblog.ldlnet.net\/wp-content\/uploads\/2019\/04\/image-1024x497.png\" alt=\"\" class=\"wp-image-357\" srcset=\"https:\/\/itblog.ldlnet.net\/wp-content\/uploads\/2019\/04\/image-1024x497.png 1024w, https:\/\/itblog.ldlnet.net\/wp-content\/uploads\/2019\/04\/image-300x146.png 300w, https:\/\/itblog.ldlnet.net\/wp-content\/uploads\/2019\/04\/image-768x373.png 768w, https:\/\/itblog.ldlnet.net\/wp-content\/uploads\/2019\/04\/image.png 1351w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Customized OWA Logon Page<\/figcaption><\/figure>\n\n\n\n<p>I have changed the color on the left to match my scheme, replaced the Outlook Logo with my company logo, and added a disclaimer to notify users. Below is the process to do that effectively for your organization.<\/p>\n\n\n\n<p class=\"has-text-color has-small-font-size has-medium-pink-color\"><strong>NOTE: Every time you install an Exchange Cumulative Update (CU) or new version of Exchange Server these modified files will be replaced. Remember to backup your original and changed files to another folder so that you can replace them when you Update or Upgrade or if something goes wrong with the changes. <\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"customize-the-color-of-the-outlook-on-the-web-sign-in-page\">Customize the color of the Outlook on the web sign-in page<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Use Notepad to open the file:<\/li><\/ul>\n\n\n\n<p class=\"has-small-font-size\"><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\&lt;ExchangeVersion>\\themes\\resources\\logon.css<\/code><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>In the <code>logon.css<\/code> file, replace the default blue hexidecimal color value #0072c6 with the HTML RGB value that you want to use. You can use the following <strong><em><a rel=\"noreferrer noopener\" aria-label=\"LINK (opens in a new tab)\" href=\"https:\/\/htmlcolorcodes.com\/color-picker\/\" target=\"_blank\">LINK<\/a><\/em><\/strong> to choose the color you wish to use.<\/li><\/ul>\n\n\n\n<ul class=\"wp-block-list\"><li>When you&#8217;re finished, save and close the file.<\/li><\/ul>\n\n\n\n<p>Here are the different graphics that can be changed on the OWA logon page and their associated files:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/docs.microsoft.com\/en-us\/exchange\/exchangeserver\/media\/04da354c-d1fd-43fb-9fd3-6114cdb64314.png?view=exchserver-2019\" alt=\"Outlook on the Web sign-in page with element call-outs\"\/><\/figure><\/div>\n\n\n\n<table class=\"wp-block-table has-fixed-layout is-style-regular\"><thead><tr><th><strong class=\"\">Image<\/strong><\/th><th><strong>File name<\/strong><\/th><th><strong>Location<\/strong><\/th><th><strong>Dimensions (width x height in pixels)<\/strong><\/th><th><strong>Bit depth<\/strong><\/th><\/tr><\/thead><tbody><tr><td>1&nbsp;<br><\/td><td>favicon.ico&nbsp;<br><\/td><td><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\&lt;ExchangeVersion&gt;\\themes\\resources<\/code><br><\/td><td>16 x 16&nbsp;<br><\/td><td>32&nbsp;<br><\/td><\/tr><tr><td>2&nbsp;<br><\/td><td>olk_logo_white.png&nbsp;<br><\/td><td><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\&lt;ExchangeVersion&gt;\\themes\\resources<\/code><br><\/td><td>128 x 108&nbsp;<br><\/td><td>32&nbsp;<br><\/td><\/tr><tr><td>3&nbsp;<br><\/td><td>owa_text_blue.png&nbsp;<br><\/td><td><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\&lt;ExchangeVersion&gt;\\themes\\resources<\/code><br><\/td><td>300 x 76&nbsp;<br><\/td><td>32&nbsp;<br><\/td><\/tr><tr><td>4&nbsp;<br><\/td><td>Sign_in_arrow.png (for left-to-right languages)&nbsp;<br>Sign_in_arrow_rtl.png (for right-to-left languages)&nbsp;<br><\/td><td><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\&lt;ExchangeVersion&gt;\\themes\\resources<\/code><br><\/td><td>22 x 22&nbsp;<br><\/td><td>32&nbsp;<\/td><\/tr><\/tbody><\/table>\n\n\n\n<ul class=\"wp-block-list\"><li>Just resize your images to the given dimensions in the table, rename them to the file name, and replace the files in the directory.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Change the disclaimer text for your OWA logon page<\/h2>\n\n\n\n<p>Next, we want to add a disclaimer to our logon page. To do that, we need to modify the logon.aspx document in the following directory:<\/p>\n\n\n\n<p class=\"has-small-font-size\"><code>%ExchangeInstallPath%FrontEnd\\HttpProxy\\owa\\auth\\logon.aspx<\/code><\/p>\n\n\n\n<p>Open the file in Notepad or your favorite HTML editor and search for the text &#8216;hidden-submit&#8217;. When you find the text, you can add your disclaimer text under the <em>div class=&#8221;disclaimer&#8221;<\/em> tag as I did in the following example:<\/p>\n\n\n<pre class=\"lang:HTML nums:False\" title=\"Disclaimer Text for OWA Logon\"><div class=\"hidden-submit\"><input type=\"submit\" tabindex=\"-1\"\/><\/div>\n<div class=\"disclaimer\"><p><b>Warning<\/b>: The website you are about to use is owned by Company Name and is intended to be used for official company business. As such, Company Name reserves the right to monitor all activity on all Company Name provided equipment and services. Use of Company Name provided information systems and networks in violation of company guidelines will result in disciplinary action, up to and including prosecution.<\/p>\n            <p>\n\n            <b>Violators<\/b>: They Will Be Prosecuted!\n\n            <\/p> \n\t<\/div>\n    <\/div><\/pre>\n\n\n\n<p>Save your logon.aspx file and give your OWA server an IISRESET for good measure. You should be good to logon with the new page from that point on.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" style=\"text-align:center\">HAPPY CONFIGURING!<br>PLEASE COMMENT!<br>THANKS FOR YOUR SUPPORT!<\/h2>\n\n\n\n<p class=\"has-small-font-size\"><em>References:<\/em><br><strong><em><a rel=\"noreferrer noopener\" aria-label=\"Customize the Outlook on the web sign-in, language selection, and error pages in Exchange Server (opens in a new tab)\" href=\"https:\/\/docs.microsoft.com\/en-us\/exchange\/clients\/outlook-on-the-web\/customize-outlook-on-the-web?view=exchserver-2019\" target=\"_blank\">Customize the Outlook on the web sign-in, language selection, and error pages in Exchange Server<\/a><\/em><\/strong><br><strong><em><a rel=\"noreferrer noopener\" aria-label=\"CUSTOMIZE EXCHANGE 2016 OUTLOOK ON THE WEB SIGN IN PAGE (opens in a new tab)\" href=\"https:\/\/msexperttalk.com\/customize-exchange-2016-outlook-on-the-web-sign-in-page\/\" target=\"_blank\">CUSTOMIZE EXCHANGE 2016 OUTLOOK ON THE WEB SIGN IN PAGE<\/a><\/em><\/strong><br><strong><em><a href=\"https:\/\/pdhewaju.com.np\/2018\/03\/18\/customizing-exchange-2016-owa\/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Customizing Exchange 2016 OWA (opens in a new tab)\">Customizing Exchange 2016 OWA<\/a><\/em><\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>As many of you are aware, Microsoft provides a default logon page for OWA, the Outlook Web App. Most companies, like myself<\/p>\n<p class=\"link-more\"><a class=\"myButt \" href=\"https:\/\/itblog.ldlnet.net\/index.php\/2019\/04\/03\/customize-your-outlook-web-app-logon-page\/\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":161,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,2,16],"tags":[169,9,149,151,147,119,168,167],"class_list":["post-356","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-exchange","category-general","category-windows","tag-asp","tag-exchange","tag-exchange-2016","tag-exchange-2019","tag-exchange-setup","tag-html","tag-outlook-web-app","tag-owa","odd"],"_links":{"self":[{"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/posts\/356","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/comments?post=356"}],"version-history":[{"count":3,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/posts\/356\/revisions"}],"predecessor-version":[{"id":360,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/posts\/356\/revisions\/360"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/media\/161"}],"wp:attachment":[{"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/media?parent=356"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/categories?post=356"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itblog.ldlnet.net\/index.php\/wp-json\/wp\/v2\/tags?post=356"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}