Genesis Favicon – How to Change

When I talk about the Genesis Favicon, I of course mean the favicon for the child theme.

Genesis Framework is the parent or underlying base theme for WordPress.  Genesis themes are premium quality WordPress themes from StudioPress.

Genesis Framework must work with a Genesis Child theme of your choice.  If you need to know more about how the two interlink and why it is such a great system in terms of robustness, ease of upgrade, security, then have a read of Genesis Themes for WordPress.

So here we are talking about changing the favicon on your active Genesis child theme. For simplicity, I will just refer to this as Genesis Favicon.  There are 3 common ways of changing the Genesis Favicon on your child theme.

  1. FTP or
  2. plugin or
  3. php in child theme’s functions.php

 

How to Create a Favicon

Again, there are various ways of going about this.  You know I like simple.  So the easiest, simplest way I do it is by using the free online tool found at Favicon From Pics.

 

Method 1: Change Genesis Favicon via FTP

If you have a self-hosted WordPress site, I think using FTP is the easiest way of changing your Genesis favicon.

  1. create your favicon
  2. find out where the default favicon is located
  3. ftp up your new favicon
View page source to find favicon

View page source to find favicon

Where is the Default Genesis Favicon located?

Browse to your WP site.  Right-click anywhere on the pages >> View Page Source

Search for “favicon” till you find a line that looks like:

<link rel="Shortcut Icon" 
href="http://www.yourdomian.com/wp-content/themes/
yourChildTheme/images/favicon.ico" 
type="image/x-icon" />

This tells you that the (default) favicon.ico is located in the “images” folder within your child theme folder.

I assume you know how to use FTP.  Alternatively you can use the “File Manager” within your cPanel.

default Genesis favicon

Default Genesis Favicon

Just upload your new favicon.ico into that same folder.  This will replace the default Genesis favicon with yours.›


Method 2: Change Genesis Favicon using a Plugin

Since I prefer the FTP method, I have not used this.  But you can get a plugin “Genesis Favicon Uploader“.  Click the link for the details page and installation instructions. (From genesistutorials.com)


Method 3: Change Genesis Favicon using php

The php code you will need is provided by StudioPress (creators of Genesis) itself.  The code has to be placed in your child theme’s functions.php file. Click link “Code to display custom Genesis favicon” to get the php code.


That’s it!  Wasn’t that nice and simple.  Now you know how easy it is to change your Genesis favicon 🙂

 

 

 

Enjoyed this post?

Easily subscribe to keep get all new postings via email. No We Don't Serve Spam - Ever!

We respect your privacy

Comments

  1. changing the file from favicon.ico to favicon.png made it work for me. I guess saving as .ico didn’t actually convert it to .ico? I don’t know, a lot of people having trouble and I assume its all the same.

    • Helena Asmus Lim says

      Hi ya Jiim, not completely sure which method you used? You only need to use 1 of the 3 mentioned. Viewing page source of any of your site’s pages will let you find out 1) where the favicon is and 2) if it is a .ico or .png or other format.

      When you use the “favicon from pics” online tool, it allows you to save the favicon as a .ico format (if that is what you need).

      And you don’t need to change the favicon in the Genesis (parent) theme. In fact, don’t. You only ever work with your child theme so that all Genesis upgrades go smoothly. The Genesis theme is then always protected.

      I hope that helps. All the same, glad to see that you have made it work 🙂

  2. This didn’t work for Genesis 2.0?

    I changed it for the genesis files and child theme files, and then tried adding the code to function.php in child theme:
    remove_action('genesis_before', 'genesis_load_favicon');

    I’m stumped.

Your Comments? Tips to share?

%d bloggers like this: