• Skip to content
  • Skip to footer

WebDevRobert

Father, Husband, Brother, Son; Sinner, Christian, Republican; Designer, Developer, Lover of Fun; Fisher, Hunter, Owner of Guns.

  • Home
  • About
  • Blog
  • Contact
  • Code Snippets
  • Guides
  • Curriculum Vitae / Resume
  • Portfolio
  • Patriotic

WebDevRobert / November 4, 2010

How to add a Favicon to a WordPress Website

I have recently been asked How to add a favicon to a WordPress Website and the topic continues to pop up. So, I thought I’d post a little about it.

A favicon (short for “favorite icon”) is an icon associated with a website or webpage intended to be used when you bookmark the web page. Web browsers use them in the URL bar, on tabs, and elsewhere to help identify a website visually. Also, it is used as application icon of mobile device. – WordPress Codex Creating a Favicon

The WordPress.org Codex already has an article called Creating a Favicon.

In this codex, we are told to add:

<link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" />

…to the theme’s header.php file, below the <head> HTML tag.

If your favicon needs a transparent background, save it as a .PNG file, using favicon.png instead of favicon.ico, like so:

<link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/favicon.png" />

I usually add at least five lines of code when adding a favicon, to include icons for the various Apple Touch systems.

<link rel="shortcut icon" type="image/x-icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" /><!-- favorites icon - favicon.ico -->
<link rel="icon" type="image/x-icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" /><!-- desktop icon - favicon.ico -->
<link rel="apple-touch-icon" href="<?php bloginfo('template_directory'); ?>/apple-touch-icon-57x57.png" /><!--  Other iPhone, iPod Touch, and Android devices -->
<link rel="apple-touch-icon" sizes="72x72" href="<?php bloginfo('template_directory'); ?>/apple-touch-icon-72x72.png" /><!-- First generation iPad: -->
<link rel="apple-touch-icon" sizes="114x114" href="<?php bloginfo('template_directory'); ?>/apple-touch-icon-114x114.png" /><!-- iPhone 4 -->

…just below the <head> HTML tag.

If your website is powered by WordPress, I definately suggest doing things the way the WordPress codex recommends it to be done.

If writing even a little php code, modifying WordPress template files or following WordPress Codex is outside your comfort level, contact me over on https://bamajr.com/; my business’ website.

Share this:

  • Email
  • Facebook
  • LinkedIn
  • Twitter
  • Google
  • Tumblr
  • Pinterest

Similar Posts

Filed Under: Technology Tagged With: Favicon, Guides, Imported Post Archive, WordPress

God gifted me an aptitude for creativity and technology. I am currently using those gifts to deploy web servers and websites.

I believe the combination of those gifts and a little Godly inspiration lead to the creation of the GLEEMPLE Deployment Process.

Most of the technology articles I write are a result of working with web servers and websites deployed using the GLEEMPLE Deployment Process.

Father, Husband, Brother, Son; Sinner, Christian, Republican; Designer, Developer, Lover of Fun; Fisher, Hunter, Owner of Guns. #NotAPoet #RollTide

Footer

WebDevRobert

Thanks for visiting!

[ SUBSCRIBE ]
[ READ MORE ]

Fresh from Instagram

Fresh from Twitter

I said I wouldn’t do it, but I’m back on LinkedIn: linkedin.com/in/webdevrobert feel free to say #IToldYouSo or comment about why. #AndGo pic.twitter.com/IXH0z4XZX2

About 2 weeks ago from Robert Cory Martin's Twitter · reply · retweet · favorite

#Santa did not bring me a new/working #iPhone. #adulting @ BAMAJR instagram.com/p/Br2syIVnrxE/…

About 2 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

Was drinking my tea @DrinkMilos and this guy showed up. He won’t let go! @ Cherryvale, Kansas instagram.com/p/BrrKluIn86X/…

About 2 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

Cool Christmas Wreath @ Tyro Christian Church instagram.com/p/BrrICQjnoVp/…

About 2 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

Do not buy anything especially car batteries from @oreillyauto Their Warranty Is Useless! @ O'Reilly Auto Parts instagram.com/p/BqbJKFVnTJb/…

About 3 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

I am sick and tired of the lack of service in retail. @oreillyauto has got my last dollar and I’m going to make sure everyone I know hears about it. @ O'Reilly Auto Parts instagram.com/p/BqbI4SknyPS/…

About 3 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

Thanks for the #swag visiblemobile! Always nice to get a surprise #swagbag or box as it was. @ Coffeyville, Kansas instagram.com/p/BqRFPyXHa5q/…

About 3 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

How To Fix Error code: NS_ERROR_NET_INADEQUATE_SECURITY webdevrobert.com/2018/11/13/h… pic.twitter.com/QGv8RuS5VO

About 3 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

How To Enable the Hidden Windows Administrator Account webdevrobert.com/2018/11/02/h… pic.twitter.com/SyMWX42H6Z

About 4 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

How To Fix a libssl-dev Dependency Error in Linux? webdevrobert.com/2018/11/02/h… pic.twitter.com/LsS3zwXx9Z

About 4 months ago from Robert Cory Martin's Twitter · reply · retweet · favorite

Follow @WebDevRobert

Copyright © 2019 WebDevRobert · All Rights Reserved · Web Mgmt Co. · Log in

loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.