用矩形工具在红色的矩形前创建另一个矩形 （426，669） 。外形尺寸： 178x39px，颜色： #374140 。 并添加相应的文本 。
Then I will add an image and with type tool I will add some text
然后我将添加图像和用文字工具添加文本
At the bottom of the article with Rectangle Tool I will create a shape and with Pen Tool I will create again a nice 3d look. Over this button with Type Tool I will write “See more”
在该区域的底部中，创建一个矩形 （530，988，78，37），颜色： # dc3523 ，并使用钢笔工具绘制阴影， 颜色： # 9a231b ，达到好的3d外观。在此按钮上，用文字工具写"See more"
On the right side I will create a sidebar again. I will use the same steps used to create the sidebar on featured area. I will use again Rectangle Tool (to create the horizontal and vertical rectangles) and with Pen Tool I will create again a nice 3d look.
在右边将重新创建一个侧边栏。将使用和创建特色区域上的侧边栏相同的步骤。再次使用矩形工具 （以创建垂直矩形 （665，626，275，440），颜色： #d9b94c ，描边： #e4e041 ；和水平矩形 （650，654，283，45），颜色： #918d22 。） 并使用钢笔工具创建好的 3d 外观， 颜色： #5e5a1a 。
With some image and Type Tool I will add the content for the sidebar.
一些图像和文字将添加到内容区域的侧边栏。
In the same way I will create another post on our wordpress layout and at the bottom I will create a pagination
Here is my final result for the content area:
用相同的方式在布局上创建另一块内容区域和在底部创建分页 （分页的颜色： # d9b94c ， # 374140） 。 在右边的侧边栏的左侧添加三角形的阴影，颜色：# 737029 。
这里是我的内容区域的最终结果：
Step 4 – Creating the footer
Well to create the footer it’s quite easy. First I will add the logo (I have duplicated it) then on the right side, using Rectangle Tool I will create 2 shapes and using some icons from the free pack I will add a twitter and an rss icon.
Here is my final result for Footer
步骤 4 – 创建页脚
创建页脚很容易。首先我会添加的logo（之前在上方做的logo）、 在右侧使用矩形工具创建2个矩形 （直接复制logo区域的两个矩形，然后移到右侧的合适位置，修改宽度为原来的250%，后面的矩形颜色： # 3e5662 ；前面的矩形颜色： # 557989 。） 和从免费包使用一些图标，我添加一个 twitter 和 rss 图标。
这里是我最终页脚
最终的布局如下：
心得：
1、在PS中精确调整矩形的大小与位置。
这是一个容易让人困惑的地方。貌似PS中不能精确调整矩形的大小，在自由变形工具中，宽度和高度的调整都是以百分比的形式出现。其实，这是让它给唬住了，在宽度和高度的文本框里直接输入精确的值就可以了，只不过要带上单位px。如果只有数字，没有单位，默认的单位是百分比，这个就悲剧了。
例如：我要精确调整矩形（40，40，120，50），则如下显示调整即可。
2、该教程的logo的简化制作
在该教程中，logo的制作是两个矩形（在本教程中，类似的两个矩形还有好几个地方）。其实，只要一个矩形，然后添加投影就能达到同样的效果。
a、用矩形工具添加一个矩形， （74，38，231，77 ） ，颜色： #fed95d
b、对该矩形添加如下样式，投影的颜色： #d9b94c
完成后的成品如下：加上文字后是不是和教程里的logo一模一样。
3、三角阴影的制作
在教程里多次提到制作三角形的阴影，以达到好的3d效果。在教程里三角形阴影的制作，基本上都是利用钢笔工具。这是一个仁者见仁智者见智的问题。有些人钢笔工具用的很纯熟，丝毫不感觉困难。有些人（笔者也是）用不好钢笔工具，自己就再摸索了一个比较方便的三角形阴影的制作。
a、如下图，先用矩形工具建好两个矩形
b、点中前面红色的图层，CTRL+J，复制该图层
c、对复制好的图层自由变换，如下图所示：
d、对变换好的图层移到黑色的图层的后面，并修改成深红色。如下图所示：
和教程中的阴影效果不相上下吧。
更多PS网页设计教程I——在Photoshop中创建时尚多彩的wordpress布局 相关文章请关注PHP中文网！
查看更多关于PS网页设计教程I——在Photoshop中创建时尚多彩的wordpress布局的详细内容...