How to Change Favicon in Genesis WordPress Theme

I have noticed a plenty of blogger using Genesis Theme and did not changed favicon in Genesis. There are a number of methods which can be used to change favicon in Genesis WordPress theme. Here is genesis icon is looks like.

genesis default icon

And it is necessary to change default favicon in genesis with your custom favicon. It will increase your branding. Here I will show you three methods to change favicon in genesis WordPress theme.

Change Favicon in Genesis WordPress Theme Using FTP

This method is for those who know how to use FTP. First of all make your custom favicon and convert it to .ico file. It is recommended your favicon size could be 16×16.

Convert your logo or favicon online

After conversion give it name favicon.ico. Now access your FTP account and upload your favicon.ico file to public_html >> wp-content >> themes >> genesis >> images

Now repeat the same process to public_html >> wp-content >> themes >> YOUR CHILD THEME >> images

If you ask to overwrite the file then grant overwrite or replace old favicon file.

Change Favicon in Genesis WordPress Theme Manually

This method is for those who are not familiar with FTP. But this will require a little attention. Because you have to add some PHP codes in theme file.

See Also: Add Twitter Follow Widget

First of all upload your favicon.ico file to anywhere you want. In my case I have upload it in my upload folder. Now copy the code into a note pad and replace YOUR LINK with your favicon icon link.

 

/** Load custom favicon to header */

add_filter( ‘genesis_pre_load_favicon’, ‘custom_favicon_filter’ );

function custom_favicon_filter( $favicon_url ) {

return ‘YOUR LINK‘;

}

It will looks like below code after editing.

/** Load custom favicon to header */

add_filter( ‘genesis_pre_load_favicon’, ‘custom_favicon_filter’ );

function custom_favicon_filter( $favicon_url ) {

return ‘http://howtowords.com/wp-content/uploads/htw/favicon.ico‘;

}

 

Change Favicon in Genesis

 

Now after editing copy the entire edited code and paste it to your functions.php file of your child theme.

Follow the track path.

  • Login in to dashboard
  • Click on Appearance then click on Editor
  • Now open up functions.php file
  • Paste the code at the end.
  • Save the file that’s it.

Change Favicon in Genesis WordPress Theme Using Plugin

If you are unable to follow above methods to Change Favicon in Genesis WordPress Theme, then I recommend using a plugin to upload your favicon. But this will require your plugin always remains active. If you deactivate this plugin after upload then your default genesis favicon will reappear again.

Download Genesis Favicon Uploader Plugin

If you are facing any trouble to change favicon in genesis WordPress theme then feel free to ask in comments.

 

 

Join 8 other subscribers

About Mubashir

I am founder, designer and author of How To Words. I am SEO expert. My areas of interest are blogging, web designing, web development, online marketing, techology reviews and social media.

Comments

  1. Awesome Article Mubashir!
    The best part is you have given 3 methods of doing so :)
    I am going with the FTP method :D
    Thanks!
    Vishesh Kachheda recently posted…Giveaway – Win 1 Developer Account From Elegant Themes Worth $89!

  2. Still using Blogger Platform. Planning to change the platform and moves to WP. This post will be beneficial for me when I move to wordPress. I will bookmark this post. So that It will be easy for me to at that time.
    Pawan Paudel recently posted…Blogger Contact Form Widget-How to use in Separate Page?

  3. Hi Mubashir,
    I’m using the Genesis Favicon uploader plugin.
    But I should also try the functions.php method.
    Thanks for sharing bro.
    Sriram recently posted…Email Apps that Work Flawlessly for Small Businesses

  4. Hi
    Well to say frankly i have started my blog on wordpress just few days back want to add favicon image i will follow this tutorial Thanks Got this post at right time :)
    Srikanth recently posted…Sony Launches Water-resistant Xperia ZR – Full Specifications and Features

  5. Hi Mubashir,

    Thanks for sharing the methods buddy ;) Changing the favicon can be key in changing your brand, that is for sure.

    Ryan
    Ryan Biddulph recently posted…1 Reason Why You Run a Successful Home Internet Business

  6. Hello Mubashir! How are you today? I that great and awesome time, especially it is helpful for me. I plan to put the Favicon for my blog but I have not time to research about this. But now you gave it to me directly. Very thanks~
    Kimsea recently posted…Irfan Founder of Real Time Trick Interview | May 2013

  7. Most folks find it very difficult changing their Genesis theme favicon, thanks for sharing this post, though it would’ve made my life a bit easier if it had been written some years back all the same i will share them with anyone who is looking to change his Genesis theme favicon.
    Nwosu Desmond recently posted…7 Online Tools to Test a Website on Different Resolutions

  8. nice Post Mubashir,
    I have seen lots of blogs that are using the default genesis favicon and I often wonder if they are just lazy to change the favicon or they dont just know how to do it.
    For those that dont know how to do it, I know they will surely find this post helpfu;.
    Joseph Adediji recently posted…7 Reasons Why Women Gain Weight

  9. Great write-up, Mubashir. You made it look simple enough for a person like me as well. Though I wont need to use it because I dont use Genesis.
    Ambika Choudhary Mahajan recently posted…8 Best Rainmeter Themes/ Skins – How to Download Rainmeter Theme

  10. Hello Mubashir,
    You have indeed break it down for anybody to understand and i must say that i truly did understand what you just said.
    I am not using Genesis theme but i am sure it will be useful to all that uses genesis, so i’ll share it across. Thanks!
    Babanature recently posted…Top 20 WordPress Plugin I Just can’t Do without

  11. Hi Mubashir,

    I did not know Genesis uses Function to render favicons. Your post will help anybody having Genesis.

    In my case, I look for the file of default favicon and replace that file with my favicon file with same name. This simply does all the work for me. I’ll never need that default favicon file, so replacing it with my file is pretty safe! But with your explanation, I learned some more! Thanks.
    Suresh Khanal recently posted…Aggressive Blogging Case Study: What Happens When You Blog Twice a Day for 5 Straight Weeks?

  12. Nice sharing Mubashir bro thanks for that…

  13. O great.

    I have changed my favicon now. Yappi…
    Husnain recently posted…Make Money Online a Proven Strategy

  14. Hi Mubashir,
    I’m going to take the ftp method for now.Plugin for everything is not a good idea because loadtime. ;)
    Harsh recently posted…How To Install Extensions Outside From Chrome Web Store

  15. My site’s was favicon not updating I’ve search many things about this but nothing get worked. But this is really working thanks for great post man.
    Prince Ramgarhia recently posted…How To migrate from one domain to another

  16. Worked, thank you so much for the tutorial.

  17. I used the php method and placed the code that you gave (with the url for my favicon) and I got a server error. Help!

  18. EEEEK! I tried the edit the php method and my entire blog dissapeared! I’m pretty sure I followed the instructions exactly… as soon as I removed the code my blog came back. Help?

  19. Thanks for the tip! I altered the function that returns the favicon link to the following:

    return get_stylesheet_directory_uri() . ‘/images/favicon.ico';

    So this theme can be installed on any website without any hard-coded domains in the code.

  20. Help! I was just using your PHP method and it broke my site. I tried deleting the code, and keep getting the same error:

    Parse error: syntax error, unexpected ‘:’ in /home1/mwouters/public_html/wp-content/themes/blissful/functions.php on line 110

    There is no line 110 that I can see.

    I cant do anything now, except the back button to go back to the PHP. Please save me!

Leave Your Comment

*

CommentLuv badge