Font Awesome not working, icons showing as squares

Question

You must have 2 classes, the fa class and the class that identifies the desired icon fa-twitter, fa-search, etc …

<!-- Wrong -->
<i class="fa-search"></i>    

<!-- Correct -->
<i class="fa fa-search"></i>

According to the documentation (step 3), you need to modify the supplied CSS file to point to the font location on your site.

Use this

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

I had similar issue with Amazon Cloudfront CDN but it got resolved after I started loading it from maxcdn

Check to ensure that you haven't inadvertently changed the font family on the icon. If you have changed the .fa item's font family from: FontAwesome the icon will not show. It's always something silly and small.