A WordPress theme usually looks great right out of the box. Whether it is a free or premium theme, you can pretty much go from the install stage to blogging within five minutes, and everything is more or less guaranteed to work and look good.
Using Theme Options or Theme Settings pages, a blogger can make often unlimited decisions about link colors, text blocks, slider speeds and more.
Using WordPress Theme Options, you might never need to look at a single line of code – ever.
The largest number of theme options – over 200 -can be found in the extremely customizable free theme, Atuhualpa.
So, why am I going to tell you how to edit a WordPress theme? Because sometimes you just have to.
As human beings, we are visual and tactile and love to manipulate the world around us. And there are times when something niggles at us so much we just can’t let go.
We really love the theme we’re using, but just can’t stand the distance between sidebar widgets. Or the way the featured image appears on the page. Or the statement in the footer that says “Powered by WordPress”.
If your theme has Theme Options, I say, exhaust the hell out of them. However if something cannot by changed in Theme Options it will have to be changed in the code.
Edit a WordPress theme
If you know absolutely nothing about computer code, you should call a professional to make any code changes. One false move can break a theme, and although your database is safe, you may lose access to it until the damage is reversed.
But, if you know some code and have the right stuff to edit, proceed to the Editor, found under Appearances. In Editor, you’ll see all the pages in your database, listed more or less alphabetically from accordian.php to style.css. Clicking on the title brings up a page’s code in the Edit Code box.
Be aware that WordPress incorporates a combination of coding languages – HTML, HTML5, XHTML, Php, Mysql, Javascript, as well as CSS. Most of what you’ll ever want to change is contained in the style.css file.
CSS
CSS stands for Cascading Style Sheets, the language used for all websites to describe the look and format of the content.
Because the code cascades, it give highest priority to rules added at the end. If the existing rule is set in the middle, the bottom rule will override it.
The best practice of altering your CSS is by adding pieces of code at the bottom of the file. So when you look at your stylesheet, you can easily see that the snippets of code at the bottom were placed there by you.
If you are lucky, your theme has a separate page called Edit CSS, a blank page that imports the theme’s styles, where you can just slap in styles of your own.
Child Theme
But, to make serious changes to any other file – like functions.php, header.php, or footer.php – you need to activate a child theme.
Using a child theme solves two problems:
- It saves your customizations from being wiped out when you update the WordPress theme.
- It makes hacking into your files impossible for anyone who doesn’thave access to the Cpanel of your site’s server, where your child theme lives.
Making a child theme is easy, using a plugin called One Click Child Theme.
Once the child theme is activated, you may need to reset the menu, but otherwise your site will look virtually the same.
Customizing your child theme is done at the server level, so you must get comfortable working there.
Cpanel File Manager
Log in to your Cpanel at the address given by your host. Scroll down and click on File Manager and go to your Public files. Find your wp-content folder and open it. Open Themes.
In Themes you will see all the themes loaded to your WordPress install, including your child theme. Inside the child folder you will only see style.css, rtl.css, and screenshot.png.
To edit the style.css, select it and click on Code Editor. This is where you paste the code that will override the rules in the parent stylesheet. Hit Save Changes and Reload on the File Manager page and watch your site change. Presto, customizo!
To change other files, open the parent folder and copy them to your child folder. In the child, open and make your changes. Repeat saving.
Warning: When changing your child theme files, test each change before preceeding. Make sure nothing has gone askew before skewing things more.
Next time: Code Sources
If you are wondering how to add code to your theme without writing it yourself, tune in next week when I’ll post about where to find code snippets.
Meantime, if you have any questions or suggestions about how to edit a WordPress theme, please shoot them to me.
And as always, please Like and Share this post.