Last updated on August 1st, 2018 at 06:23 pm
You may have read my previous tutorial about creating a custom favicon. Well I thought I would come back and show you how to upload a custom favicon to Genesis without using a plugin.
*This page contains affiliate links to products I recommend. If you purchase something from this page, I may receive a small percentage of the sale at no extra cost to you
If you haven’t read that tutorial, then I suggest you stop reading this and go read it. I want to make sure that the favicon you’re getting ready to upload passes the favicon checker.
Sure you can use a plugin if you want, however, if you don’t mind getting a little techie, follow along as I show you how to upload your newly created favicon using an FTP client.
This won’t be a very long tutorial and before you know it, you will have an awesome looking favicon that you’re proud to show the world. Your favicon will show the world that you know exactly what your doing even though you may be a new blogger.
So let’s get busy.
[clickToTweet tweet=”Learn to manage your blog, skills to make money. #WordPress #freetraining at susanvelez.com ” quote=”Learn to manage your blog, skills to make money. #WordPress #freetraining at susanvelez.com ” theme=”style4"]
Step One: Access your WordPress files via Your FTP Client
Open up your favorite FTP client then browse to your directory of the WordPress blog you will be uploading your favicon to.
For example, I will be uploading my custom favicon to my demonstration site so I would browse to:
public_html >> demonstration
That will put me inside of the WordPress blog that I want to work with.
Step Two: Choose your path
A path is nothing more than where the favicon will be residing. Think of the file path like a tree branch. Every folder inside of your WordPress blog directory is a path that makes your blog function properly.
While the images folder we create for the favicon is NOT an important branch. If we delete it from our WordPress blog, our favicon will not display.
If you are followed my tutorial of when I created a favicon, you will notice that I created several different sizes of icons.
These icons will make my favicon look good on different browsers.
So I need to upload all the different sized icons to my designated path. I chose to put all my favicons inside of a folder called images.
Step Three: Create Your Path
This step is easy, all you want to do is create a folder called images. This is the folder were we will be dumping all those files that were created.
Once you have that folder open it up and drag all your favicon files that you created using the Favicon Generator.
Your images folder should now have all those files we created.
Step Four: Place the code inside of your Theme Settings
When you generated the favicon you were given some code that needs to be placed in the <head> section for your pages.
The great thing is that Genesis makes it easy to do this.
So login to your WordPress main dashboard and scroll down till you see the Genesis tab.
Go to theme settings.
Scroll down to the bottom of the settings page until you see this.
Just place your code directly in there. Don’t forget to save your changes.
Step Five: Test Your Site
Now it’s time to test our WordPress blog and make sure that everything is good.
Click on the “Check Your Favicon” and the checker will open up in a new tab.
Put the URL of your domain in the favicon checker and if everything is good, you will see an all green.
If not then you will need to keep playing around with the different settings on the Favicon Generator till your site passes the analysis.
In my previous post I shared the exact steps I took to create a favicon and pass the analysis. Be sure to read exactly what I did and the settings I used.
Genesis Quick Links
Once you become a Genesis user, it’s important to know how to find the help you need quickly. I’ve put together this list to help you find everything you need quickly.
Child Themes Take your time and browse all the available child themes you can choose from. If you’re buying an individual theme, you won’t get access to all their themes.
StudioPress Pro Plus All-Theme Package: You understand that your blog is your business. It’s important for you to have access to over 90 child themes you can use in your business without paying another penny.
Visual Hooks Guide: Visually see the hooks in your Genesis theme. (this is for the advanced users or people who want to get more indepth with Genesis)
StudioPress Sites: Use this to get free migration to their managed WordPress hosting.
StudioPress Forums: Need help with a specific child them? Don’t hesitate to ask for help in the forums. I’ve used the forums to get answers to several of my questions.
Become a StudioPress affiliate: Love Genesis so much, make money any time someone uses your link to purchase Genesis.
Final Take Away:
I use Genesis because it makes the process of adding code to my theme without having to dig into my WordPress files. If you’re using a different theme, then you won’t be able to follow this tutorial, completely.
Most of my tutorials will be based off of the Genesis Framework since that is what I am using. Unfortunately, there are so many different themes on the market that it would be impossible to create tutorials to help everyone who uses different themes.
Hand Picked Articles for You
- 3 Different Ways to Install WordPress
- How to Update the WordPress Core
- Style Your WordPress Footer Credits
Let me know if this tutorial helped you get your custom favicon installed on Genesis. Were you able to get an all green on the Favicon checker?