While our Greyzed theme was originally released a long time ago, it remains incredibly popular – with a huge number of downloads from WordPress.org, and countless WordPress.com bloggers using it as their template of choice.
Since so many of you love Greyzed so much, we thought we’d show you a little love in helping you customize some of the colours, making it feel a bit more your own.
Firstly, we’re using the up to date version of Greyzed, found here at eFrog – which apart from code updates, also gives includes the PSD, as well as support in our forums. And it’s only $5!
Open up the included psd. You will need a version of Adobe Photoshop to do this, although you could also use Adobe Fireworks in a pinch. Use the text tool then use it to select the text in the post heading.
Use the colour picker to change the red to something else. We’re going to use a cool blue/grey just to make a change.
Note the highlighted hex value #65b4c5. Select that value, and copy it.
Next, create a copy of your stylesheet (style.css in your theme folder) just in case you want to restore your changes. Then open up the original one with any plain text editor if don’t have a HTML or CSS editor. Search the file for all instances of the value #cc0000 (thats the red), and then replace those with your new colour (in this case #65b4c5).
We’re almost there!
We just have to add a slightly darker shade for two more elements. Those are the dropdown menus, and the “search this site” text. So using the colour picker in Photoshop again, I selected a slightly darker shade of the blue (which is #599caa), and replaced the #ad0000 in .menu-header ul ul li a:hover and the #990000 in input.search-field.
Save the style.css file, upload and replace, then check out your changes!