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

Fresh Blog Interface


With the help of this tutorial, you will be able to create a professional and trendy blog interface as seen on popular blog sites, such as wordpress layouts.

Step One

Make a new document 800x600 and fill it with a light gray background (#F0F0F0).

image 1

Step Two

Take the rounded rectangle tool and select white as your shape color (#FFFFFF).  Create a rounded rectangle shape by dragging a small box  to create a new shape layer.  This will be the base layer for our blog interface.

image 2

Step Three

Right click this shape layer, and click blending options.  Set up the outer glow as follows:

Blending mode: Normal
Opacity: 10%
Color: Black

image 3

Step Four

Take the rounded rectangle tool and using a light blue (#0098F6)  create a banner for your interface as shown below.  Go to the blending mode panel, select gradient overlay with these settings:

Blending mode: Normal
Opacity: 17%
Colors: Black and white

image 4

Step Five

Repeat Step Four for the footer.

image 5

Step Six

Add your logo + blog name (#FFFFFF Century Gothic is what I have used in the example below) in the header and put the opacity of both at 50%.

image 6

Final Step

Now, you can use your interface for blog script like DotClear or Wordpress! 

Fresh Blog Interface
Click to enlarge

Good Luck!

Editor's Note! Tired of creating you own WordPress theme? Check out WordPress themes from Template Monster then. Affordable and eye-catching blog designs for your WordPress powered blog.



Author's URL: GreyCobra.com
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 "Fresh Blog Interface"

Captcha