Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Winter Wordpress Theme

Winter Wordpress Theme


1. Create a new document (900*700).

2. Fill the background with #4399d1 and look at the guides I've created in the screenshot below. Also select a rectangle like shown below (height of 350px) using your rectangular marquee tool. We're going to create a wordpress theme (originally designed by FWPL). This is just for educational purpose and not to steal his work so don't claim this design as your own just because you can make it using this tutorial.

image 1

3. Now create a new layer (layer - new layer) and fill the previous selection with any color you like. Then adjust the blending options to add a gradient overlay with the settings like shown in the second screenshot in this step.

image 2

image 3

image 4

4. Create another new layer and select a rectangle for your content and text like shown! Fill it with white #ffffff so the whole design looks like this for now.

image 5
Click to enlarge

5. Now we're going to add a stroke with a special gradient instead of just a plain color (again go to layer - layer style - blending options and then stroke). Look at the screenshot below to find out what I did to achieve the special border...

image 6

image 7

6. Now create a new layer just above the header layer (the one with the gradient) and select your brush tool (change the foreground color to white #ffffff). Start brushing using this brush and this one until you have something looking like this! Looks cold and snowy, just what we wanted (i also changed the opacity of this layer to 75%)! You also might want to add these snowflakes on more than 1 layer like I did in step 7...

image 8
Click to enlarge

7. Use your horizontal type tool to type out a title and a subtitle... I used a font called microsoft sans serif with a size of 30px for the title and 10px for the description.

image 9
Click to enlarge

8. Like every wordpress template you also need a menu (on a new layer so create a new one)... So use your rectangular marquee tool to select a rectangle like this on the right of your screen. Then fill it with #fafafa. Of course this can also be done using css and divs, but for now we're just going to duplicate the looks of this design.

image 10
Click to enlarge

9. In this last step I've just added some demo text like always! I hope you liked this tutorial!

Winter Wordpress Theme
Click to enlarge


Author's URL: PhoNuts.org
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Winter Wordpress Theme"

Captcha