Icons are boxes in the browser?

There are lots of possible reasons, but the most likely cause is a browser addon/extension blocking the site from which the icons are served. Try disabling your ad blocker, pop-up blocker, or any other kind of blocker you may have installed to see if that makes a difference.

As for what to do about it if it is one of your blocker addons? You can dig through their lists of blocked sites to see if you can figure out which entry is causing the problem and remove it.

Hi,

Most icons on the CG-COOKIE website originate from the FontAwesome-webfont.

BACKGROUND RESEARCH

The icon font (FontAwesome) is loaded via a CSS definition, which names the font-family and imports the font-data using SRC, as seen here:

@font-face {
  font-family: 'FontAwesome';
  src: url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot");
  src: url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot?#iefix") format("embedded-opentype"),url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2") format("woff2"),url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff") format("woff"),url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf") format("truetype"),url("//1976725556.rsc.cdn77.org/assets/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal
}

Icon elements then explicitly specify the FontAwesome-font, as part of the main ".fa" class definition:

.fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-style: normal; font-variant-ligatures:
    normal; font-variant-caps: normal; font-variant-numeric: normal; font-variant-east-asian: normal;
    font-weight: normal; font-stretch: normal; font-size: inherit; line-height: 1; font-family: FontAwesome;
    font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing:
    grayscale; }
    

The actual icon-code is then inserted using a "content" attribute, defined as part of an icon-name class, which will insert the Unicode index of the requested font icon. For example, this references the magnification-glass icon using it's index:

.fa-search:before {
  content: "\f002";
}

CONCLUSIONS

From the above, we will learn the following:

01 - We can rule out any possibility of problems with Operating System Unicode Emojis, because FontAwesome does not rely on any system fonts (it doesn't even use any standard Unicode indexes, it just defines it's own icon indexes as needed.)

02 - The font is loaded from "*.cdn77.org" -domain, so make sure your browser or any extensions, are not blocking it.

03 - The icons should not be affected at all if JavaScript is enabled or not, because they rely entirely on CSS3.

04 - Make sure you have updated your browser, so that it actually supports webfonts, as defined by @font-face rules, in CSS3.

05 - Make sure you do not have any global client-side font-overrides active, because such override rules would also override the FontAwesome icon-class font-family rules -- immediately making the icons look like empty rectangles (which mean that the system is unable to find the requested symbol in the specified typeface).

OUTRO

Now, maybe I could help you even further, if I knew which browser, and which version of that browser, you are using.

From the image that you posted, it looks like you might have a global font-override active. That would be my best guess at the moment, as to the reason why you're not seeing the icons.

Please note, that a global font-override might also be activated by one of your browser extensions! So if you need more help, a list of your active browser extensions might also be helpful, and you could try starting your browser with extensions disabled to confirm that they are not the reason.

Happy to help you more, if you provide more information and if you cannot solve the problem with this info.

Cheers!

Samuel Tekrenius (not affialiated with CG-COOKIE in any way, just another nerd)

This is the type of thing we (around here) call a Microsoft Mystery. :)

I had the same issue before. Its a bug in this site. It happens when we use https://www.cgcookie.com (with the www)instead of https://cgcookie.com (without www)  This happens because the server where the icons are stored allows only https://cgcookie.com to access them and not the one with 'www' in its address.