SLee and Topher

Two Guys on Gaming, Tech, and the World

WordPress: How to Change Your Favicon

May 29, 2011 By AvidNetizen Leave a Comment

That “W” is pretty cool, but it’s not very expressive of my site. Here’s how to change your favicon in WordPress.The favicon, the little icon that shows up next to your url in the browser’s address bar, is a great way to promote your website and increase your brand marketability. Most browsers display the favicon, and it’s a good way to make your site look more professional. Thankfully, it’s pretty simple to put up a custom favicon.

Your Favicon Image

First off, you’ll need to have an image for your favicon. You can design one for yourself in Photoshop or use a logo for your site that you might already have on hand. Once you have your image, you’ll need to convert it into a .ico file format. The easiest way to do this is to use a website that specializes in converting images to favicons. Here’s a good one that does it for free: favicon.co.uk. Just upload the image you want to convert, the site will display a preview of what it will look like, and then you can download the .ico version.

Insert your Favicon in Your WordPress Theme

Once you have your favicon image, it’s time to get it up on the site. If you are fortunate enough to be using a theme that supports it, you can go into the Theme Options for your theme and upload your favicon through the web interface. However, many themes do not have this built-in functionality.

Enter the Favicon through the WordPress Template Editor

If your theme doesn’t have a web interface for uploading a favicon, that’s okay. No need to go out and find a new theme. Simply go to the “Editor” in the Appearance menu and open up the template that controls the header (usually named “Header” or “header.php”). In this template file put in this line of code:

<link rel=”Shortcut Icon” href=”/favicon.ico” />

Where “/favicon.ico” is the path where your favicon can be found online.

Upload Your Favicon

To get your favicon online you’ll need to upload it to your web host by whatever means you normally upload things to your web host. Typically this is with a FTP client such as FileZilla. If you’re using the method I just described, you can put the favicon image file wherever you want to–just make sure you know the path (ex. http://www.yourwebsite.com/yourfilefolder/favicon.ico/, or where ever you put it).

Another option is to simply load the favicon image file directly into the root of the theme folder for the theme you are using (ex. http://www.yourwebsite.com/wp-content/themes/yourtheme/favicon.ico/). This should work automatically without having to make any changes in the theme templates. Sometimes it won’t update that way, though. Also, if you change your theme, then you’ll have to move your favicon again. To avoid these problems you can simply put the favicon image directly into the root folder of your website (ex. http://www.yourwebsite.com/favicon.ico/).

Enjoy Your Custom Favicon

And there you have it. A professional-looking website with a custom favicon. Thank you for reading “WordPress: How to Change Your Favicon.”

Did I forget anything? Do you have any questions? Leave a comment below.

Filed Under: Internet

Get More Stuff Like This In Your Inbox!

Sign up for more free content from SLee and Topher, delivered straight to your inbox.

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Get the Best Games

Looking for something new to play? Check out BestGamesList.com for the best games 2017 has to offer.

Connect with S&T

Get Free Updates

Enter your email address for free updates on video games and technology from SLee And Topher.

Support SLee & Topher and earn rewards using Ebates:
Ebates Coupons and Cash Back

Must See Stories

Netflix Download and Go

Downloading TV Shows and Movies on Netflix

Retrieve iPhone IMEI

Android Wear: Google’s Wearables Platform Is Here

Domo for NHK

9 Famous Tech Mascots and Their Colorful Backstories

Official ‘Batman: Arkham Knight’ Trailer Reveals Driveable Batmobile

Site Builder Banner for iPage – 250x250

Copyright © 2025 ·Magazine Pro Theme · Genesis Framework by StudioPress · WordPress · Log in