Web Design & Development Blog

How to remove the favicon code from the Thesis 2 header

One day I discovered in one of my blogger’s iThemes security logs that there were a number of daily requests for variously sized “apple-icons” returning a 404 error. After some research, I decided to customize the site’s favicon code.

Thus, you may come across a situation, like I did, where you need to remove the Thesis 2.1+ favicon reference from your the <head> of your website in lieu of your own custom favicon embed codes. While you can certainly edit your html head in the Thesis HTML Head Editor, and you can even edit the favicon image, you can’t actually remove the reference to the favicon without editing thesis core library. Below you will find how to comment out the reference in the code so that you can include your own favicon head code.

With the advent of extended favicon generators, which give you more control over what your icon looks like across multiple operating systems and platforms (like Windows 8 tiles, OS X apps, etc.), websites like realfavicongenerator.net will recommend that you actually do not include a declaration to favicon.ico in the HTML code of your website.

Having a favicon on your website is important for legitimacy and branding consistency, however, including an actual reference to the favicon, while certainly is not “harmful”, you may get a warning on favicon checker websites that you don’t need to include an actual reference to it:

“Looking for some sample favicon code, you’ve probably encountered:

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

When your favicon is located in the root directory, RealFaviconGenerator does not generate this code [in its personalized head code] . This is because it somehow disrupts some other browsers like Chrome. And since IE looks for a file named favicon.ico anyway, the best solution is to not even talk about it. This is described by Jonathan T. Neal and Mathias Bynens.”

The Real Favicon Generator website will give you a high level of control in customizing your favicon which is why I recommend it as a helpful tool for cultivating your favicon across all devices. An example of the code they would give you is here:

favicon-html-head-code-example

They provide a full package of all the sizes you will need to match all of these references which makes it a snap.

However, if you would prefer to remove the reference as they recommend, and you need to remove the automatically generated Thesis 2 favicon code, you will need to edit the following file:

…/wp-content/themes/thesis/lib/core/api/boxes.php  (line 68)

Once you comment out this line, the favicon will not be included in your website’s front-end head code like so:

comment-out-favicon-code

And now you won’t be using the Thesis 2 favicon and will have complete control over the favicon in your html head, and won’t get any warnings on the favicon generator websites.

websymphonies-favicon

 

Contact Us

Web Symphonies