title: Icons missing on Azure Wordpress site
body: <p>I created a WordPress Azure Website through the Azure Websites Gallery. I installed a theme called <em><a href="http://azure.microsoft.com/en-us/documentation/articles/web-sites-php-web-site-gallery/" rel="nofollow noreferrer">Bridge</a></em>. </p>
  
  <p>Everything is working quite fine...Except, I have <strong>no icons</strong> appearing on the desktop version of my site (through Chrome, Firefox and IE). I am seeing icons on my Windows phone. I am not seeing icons on the desktop site when I squeeze the window down to mobile phone size.</p>
  
  <p>To give you some background to where this problem is potentially coming from…
  I have used a custom domain. To make the WordPress site work with a custom domain, I have added this code to the wp-config.php file:</p>
  
  <pre><code>/*Emma added the below to fix permalink to be custom domain*/
  define('WP_HOME','http://examplesite.com');
  define('WP_SITEURL','http://examplesite.com);
  </code></pre>
  
  <p>The code above meant that once you clicked on a post or page and moved away from the homepage, the url was still examplesite.com/pagename instead of examplesite.azurewebsites.net/pagename.</p>
  
  <p><em>So back to the icon issue…</em></p>
  
  <p>The icons are displayed through using a font (<a href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow noreferrer">font-awesome</a> to be exact). I have the latest updates of the theme and the latest 4.2.0 version of the font is in the font files. The font files can be found here in my site:</p>
  
  <blockquote>
    <p>wp-content > themes > bridge > css > font-awesome > fonts</p>
  </blockquote>
  
  <p><img src="https://i.stack.imgur.com/MFBaH.jpg" alt="enter image description here"></p>
  
  <p>I asked the Bridge theme team why the icons were not displaying. They replied:</p>
  
  <blockquote>
    <p><em>This is happening because of <strong>cross-origin access is denied for your site</strong>. You should paste this code to htaccess file that is located in
    WP installation directory:</em></p>
    
    <blockquote>
  <pre><code>&lt;ifModule mod_headers.c&gt;
  Header set Access-Control-Allow-Origin: http://examplesite.com
  &lt;/ifModule&gt;
  </code></pre>
    </blockquote>
  </blockquote>
  
  <p>I do not have an .htaccess file because my site is running on Azure. From what I understand .htaccess files are linked to Apache. Instead of a .htaccess file, I have a web.config file and a web-config.php file because I installed this from Azure.</p>
  
  <p>I created a .htaccess file in the root of my website and pasted the above code. Of course that didn’t work. I also looked up how to write the web.config version of the code and pasted that into the web.config file and that did not work (although with my little knowledge of this area, the syntax is probably wrong) and that didn’t work. See the code below:</p>
  
  <blockquote>
  <pre><code>&lt;httpProtocol&gt;
    &lt;customHeaders&gt;
      &lt;add name="Access-Control-Allow-Origin" value="http://examplesite.com" /&gt;
    &lt;/customHeaders&gt;
  &lt;/httpProtocol&gt;
  </code></pre>
  </blockquote>
  
  <p>I also added this to the web.config file and that hasn't worked:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;remove fileExtension=".svg" /&gt;
      &lt;remove fileExtension=".eot" /&gt;
      &lt;remove fileExtension=".woff" /&gt;
      &lt;mimeMap fileExtension=".svg" mimeType="image/svg+xml"  /&gt;
      &lt;mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" /&gt;
      &lt;mimeMap fileExtension=".woff" mimeType="application/x-woff" /&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I have read that I need to also change the buildAction to "content", but not sure how to do that as when you click properties of files such as .woff, you don't seem to get that option.</p>
  
  <p>I also played around with adding something to the web.config.php file under the custom code I wrote to get my domain to work, but that didn’t work either. Once again, not sure my code was correct.</p>
  
  <p>I went back to the support team at the Bridge theme and they said that I should <em>contact my hosting provider to do this for me because .htaccess can’t work on this type of server.</em></p>
  
  <p>So, now I am not quite sure what to do.</p>
  
  <p>Does anyone know the correct code I should put into my web.config, web-config.php or other file? Or, is there another issue here I am not understanding? Perhaps something as simple as adding something to the custom css to call to the font? </p>
  
  <p>I wonder if there is a clue in the statement I made above... 
   "Everything is working quite fine...Except, I have no icons appearing on the desktop version of my site (through Chrome, Firefox and IE). I am seeing icons on my Windows phone. I am not seeing icons on the desktop site when I squeeze the window down to mobile phone size." </p>
  
  <p>If I can see them on my phone, then surely that means at some point the icons are being rendered correctly? </p>
  
  <p>I have had a look through my css files for a change in a way the site is rendered through media queries, but didn't find anything there either. </p>