When I started looking around for free WordPress themes, I realized two things –
1) There are about a gazillion free WordPress themes, and
2) Most of them look very similar to each other.
Sure there are ones with one column, two columns, or three columns, but it was difficult to get excited over any of them. Customization was almost always limited to the header image of the theme, and everything else was set.
Using any one of these WordPress themes will make my blog look like just any other WordPress blog. I wanted to create something different, without having to do a lot of HTML, CSS, PHP, or Javascript coding.
Here are three simple steps to create a unique WordPress blog that is based on compelling visual components rather than just text and columns.
1. Download Custom Theme
To get started on designing your own image-based blog, first download and save the Genesis Skins Theme.
1. Activate this theme by going into your WordPress blog administration panel. Click the Appearance menu on your left sidebar.
2. Click on the Install Themes tab at the top.
3. Once you are in the Install Themes screen, click the Upload menu option at the top of the screen. This will let you download and install the Genesis Skins Theme you just saved.
Once the theme is activated, there should be a new tab to the left of your WordPress Dashboard called Genesis Skins (under the Appearance tab).
2. WordPress Theme Colors
The next step in creating your WordPress theme is to set the colors of your blog. Click on the Genesis Skins tab, and select the Add New button at the top of the screen.
Type in a title for your new skin. Then, you are ready to set the theme colors.
There are five different colors that you can define in your WordPress theme –
- Header text – This is the color of your blog title and article titles.
- Linke text – This is the color of links within your blog.
- Body text – This is the color of the regular text in the body of your blog.
- Blog color – This is the color of your blog page.
- Background color – This is the color of your blog background.
- Widget color – This is the color of your blog widgets.
The Edit Skins screen gives you a color selector for each setting.
- Click on the color drop-down menu.
- This will display the color-wheel for the particular setting.
- As you select different colors, the text and background colors of the preview area to the right will change. This gives you an idea of how your blog colors will look together.
Once you are happy with your color choices, click on the Save & Publish button at the top left of the screen. This will save your skin color choices.
After you have saved your skin, go back to the Genesis Skins screen and click on the View button right under the title to get a preview of your skin.
In general, you want to stick to a color family, for example, blues, greens, purples, or browns.
Once you have decided on a color family, consider adding one accent color. It is usually best to pick an opposing accent color. For example, if your theme palette consists of a cool colors (blues or greens) then you want to pick a hot accent color (reds, yellows). The opposite is also true. The accent color will give your WordPress theme some kick, and make it stand out to the eye of your readers.
If you are looking for blog color ideas check out this Color Scheme Designer.
Be careful not to use too many opposing colors, however, as that will create a busy visual landscape of colors and make your blog difficult to read.
The Edit Skin screen also allows you to change the position of your blog title in your header image. Place your blog title where it is most visible based on your chosen background header image and your chosen header text color.
To do this, simply drag and drop your header text in the interface. Once you are satisfied with the results, click on the Save button at the top-left corner of the screen.
3. WordPress Theme Images
The final step in creating a unique WordPress theme is to find the proper images to use.
- In general, you want to find images that are centered around a consistent idea, or concept.
- Make sure that the images are both compelling and complement the textual content of your WordPress blog.
- In addition, make sure that the coloring, mood, and tone set by your images are all consistent.
To customize the images on your blog, click on Genesis Skins tab and edit the skin of your choice. Click on the Skin Images tab to the left to insert and remove images. You can upload images from your computer or use existing images in your WordPress Media Library.
You may place your own images in five key areas – header, footer, body, widget, and background.
To upload an image from your computer, click on the Upload New tab, then click on ‘select a file’. This opens up a pop-up window that allows you to select an image from your local computer.
To use an image from your WordPress Media Library, click on the Media Library tab. Next, click on the Open Library button. This opens up a pop-up window that allows you to select images from your blog media library.
Select the image of your choice and click on the Insert into Skin button. This process is exactly the same as inserting images into your blog posts, except here the images will be inserted into your blog-skin. You can get the best results by first constructing the images to-size in a separate photo or image manipulation program, and then just loading in the finished product.
Some tweaking may be necessary to make sure that your images will fit well together and merge organically into your website design.
You can obtain free images and photos from a variety of websites. However, you may need to alter the images you collect to make them visually consistent.
You can also create your own images. There are a variety of methods to create 2D images including drawing your own designs, taking photographs, and using 3D models. Rendering images from 3D models can be especially fun, and can produce some high quality images in a fairly short amount of time, even with limited artistic skills.
For example, the themes on this website are created with Carrara, Photoshop, and 3D-models from Daz 3D.
This Is It!
Once you are done, apply your new theme to your entire blog –
- Go into Genesis Skins >> Skin Settings in your WordPress Dashboard.
- Select the new skin you just created from the Default Skin drop-down menu.
- Click on the Save Settings button at the bottom of the screen.
You are all done. Enjoy your new image-based WordPress theme!
If you encounter any errors or have any suggestions, please let me know by leaving a comment below.
shibashake says
Glad you liked it P&O. I had a lot of fun with it, and will be creating more images and themes for it as well π
Plants and Oils says
That’s wonderful, thank you very much.
shibashake says
@dohn – Still waiting on that dim sum π
@Nancy – Thanks Nancy.
@quicksand – In that case, I must write some themes for Blogger as well π
@FD – We can help each other. We can alternate being fick π It will be fun.
@RCold – Good to see you again π Btw, welcome to HubPages!
RCold says
This is another great Hub!
frogdropping says
Shiba – my gorgeous I wasn’t asking for help (though help is good) I was meaning I’m fick π
quicksand says
I use blogger and I am quite happy with it. π
Nancy's Niche says
Very impressive information on theme buildingβthanks for sharing.
dohn121 says
This is really awesome. I really am impressed by all the information I get from you, shibashake. I feel like dining for free over hear and feel guilty about it. I’m definitely bookmarking this! Thanks a million.
shibashake says
Yay my favorite green friend! I will help you with whatever you need. Just give me a dog cookie π
frogdropping says
Shiba – I’m woefully pants with such things. I can’t even seem to remember half of what I read, even though I’m taking it in when I’m reading it.
I’ve even been known to sit with instrutions (and follow them) and still muck wordpress and the like up.
You’re fab! I need a little piece of you π
Happy to see you and hope you are well!!! (And your pooches)