Hi, I’m Alvaro Guzman and this is the second part of the premium wordpress theme tutorial continued from Part 1. This time you’ll learn how to slice the design and convert it into XHTML + CSS, then I’ll show you how to use the css files to mock-up a Wordpress template. This isn’t a basic tutorial, if you’re a newbie, maybe you should read some basic HTML+CSS tutorials, and undestand the basics of CSS tags and Wordpress features and structure.
If you’re a programmer, you must have some basic knowledge about phothoshop, layers, slicing and obviously Wordpress. Anyway, if you’re an intermediate – advanced level webdesigner, I’m sure you’ll find this useful.
Step 1 – Let’s begin
Open the .psd file.
First, hide all the layers containing text, links or content images. Leave the design as clean as possible, just show the containers. As you can see below, I’m showing the background, the header