Hướng dẫn thiết kế Template Website

in Tutorials, Web layouts by Razvan on January 3rd, 201016 Comments In this tutorial I will create a new wordpress theme with a web 2.0 look. Sometimes the simplicity of the theme will bring you more readers. The light wordpress themes seams to keep your readers more on your blog. From my experience is very important to create a good place for your readers to find quality content on a well designed theme. Want to download this PSD layout ? Register for a VIP account and download our entire collection with 70.000 items. Create a new document with the following size: 1000×1400 pixels. After you create the document you need to add a color on the background layer. The easy way is to set your foreground color to #cccccc, and with Paint Bucket Tool you need to click one time inside your document. Now you have a background with the color you want. If you want to use another color you can change it later with the same method. I will select Rectangle Tool, and I will create a shape on the top of the Wordpress theme. This will be our header for this layout. 1 For this shape I will add the following layer styles 2 Please note that all gradients used in this tutorial you will find in one of the biggest pack of gradients you will 3 ease ote t at a g ad e ts used t s tuto a you w d o e o t e b ggest pac o g ad e ts you w find on internet. You can download here: 27.000 Photoshop gradients With Rectangle Tool I will create another shape right under the header. Here I will place the menu buttons. Of course I will add also some layer styles 4 5 I will place here some text, and this is my result so far. You can see that I have used different sizes for the font. Now I will create another shape with Rectangle Tool. I will create the search form In the middle of the Wordpress theme I will create a shape with Rectangle Tool. Here I will create a featured post, or you can create also a slideshow 6 I will add the following layer styles 7 This is my result so far 8 This is my result so far In the middle of the shape I will add a image. If you want to subscribe to our newsletter you can use this link: Under this featured post you can add another shape. I will use the same layer styles. 9 I will start adding different elements. For start I will create a spot where I will add the date when the post was written , and the number of comments. I will select Pen Tool and I will create a shape like this one. If you turn on the grid you will be able to create this shape very easy 10 I will add the following layer styles 11 This is my result so far With Pen Tool I will create a small triangle with a dark grey. I will place the layer under the big white layer Then with the same tool and color I will create another shape 12 With this last shape I will create a nice shadow right under the button. To create a smooth shadow you need to go to Filter > Blur > Gaussian blur. In the Gaussian blur window I will use the following settings Now I will add some images and text In the image from above you can see that I have placed also another button for the read more. I have used the same techniques, but for the button I have used a darker gradient. You can see also some lines. If you don’t know already there is a tool called Line Tool. If you set the weight to 1 pixel you can create the same lines like mine. While you draw the line hold down your Shift Key. In this way you will create a perfect horizontal line. My line is made from two lines with different colors. Always the top one will be darker the bottom one it will be white. I ill h d i h d hi 13 I will create the second post right under this one On the right side I will create a new shape with Rectangle Tool. I will use this shape for our sidebar. Here you can place advertisements, Google ads, or any other things you want. 14 You can see that I did not aligned the sidebar with the featured post. this is because I will place there some social bookmarking icons. If you search this blog you can find different icons for social bookmarking sites in vector format On the sidebar I will place some banners on the top 15 On the bottom of the post I will add some other details. for example you can add some of your best post You can see in my previous image that I have used one more time the thin lines On the bottom of the layout I will create a big shape with a dark gradient, and there I will place some text and images This is my final wordpress theme. I hope you like it 16 Want to download this layered PSD layout ? Register for a VIP account and download our entire collection of downloads: 70.000 Items Want to save almost 50% when you purchase a VIP account ? Register for one year and you will bring down the month-to-month cost to around 5$ 17