Let's start this tutorial with a new document with the following sizes: 960 x 900 pixels. Normally the height of this layout is not important, because you will set how many posts are visible on your page from your wordpress admin area.
I will use a dark background for this layout: #222222
I will create a new layer (press on CTRL+SHIFT+ALT+N) and on the left side I will add a simple brush drawing, with a smooth brush.
I will grab Rounded Rectangle Tool, and I will create 2 shapes. On the top layer I will place the navigation bar, and on the bottom one will be the content
With the same tool I will place another shapes. Please click on the following image to see the full size wordpress theme
For the yellow shape I will add a simple stroke
This is my result
Make sure you have this layer selected in your layer palette, then press on CTRL+J to duplicate this layer. Select Move Tool, and press on the down arrow key from your keyboard. Place the shape like in the following image
You can see that I have changed the color for the second layer to #eeece2
Right click on this layer in your layer palette, and choose Rasterize Layer
Select Rectangular Marquee Tool, and make a selection on the top of the shape
Be sure you have the proper layer selected, then press on Delete key from your keyboard, and then press on CTRL+D to deselect. Click on the next image to see the full size layout
Select Line Tool, and set your line weight to 1 pixel
I have used the following colors to create some lines: # c2bead and #ffffff. Here I want to create a nice slideshow.
The following image is zoomed to 200 %
This is the real size
I will select Polygon Tool, and I will set the sides to 3
I will create a triangle, and I will place it on the top thumbnail
For this shape I have used the following layer styles
Now I will duplicate this layer (select the layer in your layer palette, and press on CTRL+J)
Select both layers in your layer palette, and press CTRL+E to merge the
layers into a single one. The result is the same but this step is
required in order to achieve the following effect
Select Eraser Tool, and choose a smooth brush with a size of 30 pixels, and delete the left part of the triangle
To create a nice arrow, I will use the following layer style
This is my result
I will place some images on this slideshow with one of my previous tutorials:
Design a stylish Chevrolet Icon in Photoshop
Draw a surreal dragon
Draw a cartoon girl
On the right side, in the wordpress side bar I will place some
banners. I know this is an easy step, but ads should be inside a
wordpress theme, because for some bloggers is the only way to generate
revenue. If you create wordpress themes for your clients, please take
care of this feature, and incorporate spots for ads from the first time.
On the left side of this wordpress theme I will add some text. This will be transformed into actual posts
On the slideshow I will create another shape with Rounded Rectangle Tool, and then I will delete the top part of the shape
On the top part of the layout, I will place some bookmark icons. A few days ago I have released a set of scratched vector icons: Download icons
Add some icons on the right side and let your users interact with you through social bookmarking sites
This is my final wordpress layout.
