Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community!

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

General Discussion

Posted by qasimalbaqali
qasimalbaqali
17,839 Points

PSD to Wordpress

I wish if you guys would put a series of how to code a PSD (website template) and to make it to HTML and CSS and then from that to a wordpress theme! I really want that. I am having a really hard time to find a good video on the internet and tutorials to do that, but I can't. I have been wanting to know how to do that since ages! Have you guys ever thought of that?

8 Answers

Ernest Grzybowski
Ernest Grzybowski
Treehouse Project Reviewer
Ernest Grzybowski
Ernest Grzybowski
Treehouse Project Reviewer

I guess they could make a tutorial, but there's so many different variables involved. Taking the design courses on here, the html/css, and the wordpress courses seems like the best solution. There's no "easy" way to get a PSD to HTML or Wordpress or anything else you can think of.

Martin Rheaume
Martin Rheaume
4,831 Points
Martin Rheaume
Martin Rheaume
4,831 Points

Have you checked out this series of tutorials from wptuts http://wp.tutsplus.com/sessions/adaptive-blog-theme-from-photoshop-to-wordpress/ (Adaptive blog theme from Photoshop to Wordpress)?

Kevin Korte
Kevin Korte
28,147 Points
Kevin Korte
Kevin Korte
28,147 Points

I agree with Ernest Grzybowski. There is no easy solution, and the various types of web applications you could create in PSD and than try to build a site from would be difficult to cover in one video.

I always look at it this way. I use ILL, FW, and PSD all to create my web assets. By web assets I mean my color palette, my images, my design styles, font-types/sizes, general layout, buttons, etc.

Than I just use my HTML, CSS, and PHP skill to take those assets, one by one, and implement them into a working site. I can get my hexadecimal colors from PSD, my rough shadow or highlight settings that I translate into CSS. When I have all of my assets in a PSD file, reconstructing them as a website goes pretty fast.

Ben Russell
Ben Russell
3,667 Points
Ben Russell
Ben Russell
3,667 Points

Check out videos by Chris Coyier. He's great at showing how he goes from psd to build. Also Chris Spooner has some great tutorials on psd to WordPress builds (amongst other things).

qasimalbaqali
qasimalbaqali
17,839 Points
qasimalbaqali
qasimalbaqali
17,839 Points

Thank you all for your comments :) I am now watching the tutorials from wptuts and they are really great. As for Ben can you please link me for Chris's videos and where I can find them? Would really appreciate it.

Martin Rheaume
Martin Rheaume
4,831 Points
Martin Rheaume
Martin Rheaume
4,831 Points

I don't know where Coyier's psd to wordpress tutorials are, but this is his wordpress website http://digwp.com/ You'll find a lot of great stuff there.

Chad Shores
PLUS
Chad Shores
Courses Plus Student 8,868 Points
Chad Shores
Chad Shores
Courses Plus Student 8,868 Points

Watch this whole Chris Coyier video before you watch anything else. It will clear a lot up and give you tons of tips. He uses Wordpress so this is very relevant to you.

Chris Coyier: A Modern Web Designer's Workflow http://www.youtube.com/watch?v=vsTrAfJFLXI

qasimalbaqali
qasimalbaqali
17,839 Points
qasimalbaqali
qasimalbaqali
17,839 Points

Thank you I am watching it right now :)