New Screencast: Designing for WordPress: Part Two
We have WordPress installed, now let’s really get our hands dirty and start getting WordPress to do what we want it to do. We start by poking around the backend activating some plugins, changing some settings and creating posts/pages. Then we take a look at the Photoshop design and note some of the important aspects. Layout, color palette and font choices are all imporant things to consider as well as the overall feel. WordPress sites don’t need to scream “Blog!” unless you want them to. Then we take a look at the modular nature of a WordPress theme and start altering the markup of the files and writing CSS. In part three, we will continue touching up the design, adding details and content. We may get to the finishing touches of adding the “extra-content” stuff like the Twitter feed, or that might be a part four.
Special thanks to Volkan Görgülü who sparked the idea for this design and provided a nice sketch I used while Photoshopping the design.
Loading ...
1
I love you.
Thanks a lot for the latest tutorial - I’m about to watch it.
For sure this is very helpful and I’m very very very glad
that it followed part 1 so quickly.
THANKS AGAIN.
Comment by Patte — July 10, 2008 @ 6:42 am
2
Thanks for this excellent screencast! Will the mockup be available to download?
I’m wondering why you installed an extra Gravatar plugin because since Wordpress 2.5 Gravatars are supported out-of-the-box without installing any plugins.
Comment by Patrick — July 10, 2008 @ 10:23 am
3
I’ll release Part 3 of this next wednesday/thursday and then shortly afterwards I’ll make the whole theme available for download and I’ll include the Photoshop mockup. Just some stuff to clean up and bugs to fix and whatnot first.
Comment by Chris Coyier — July 10, 2008 @ 10:27 am
4
Hi Chris I’m watching now. You’re really good with making these videos. I plan to watch the Photoshop slicing technique videos next (which probably should be higher on my priority list over designing for wp!)
Thanks
Comment by Eric — July 10, 2008 @ 10:42 am
5
Any reasons why u don’t do the whole markup in normal html and than transporting it to WP when it done?
Comment by V1 — July 10, 2008 @ 11:46 am
6
thanks once again. i cant wait for the next one!
Comment by trs21219 — July 10, 2008 @ 11:52 am
7
Can you please post the running time of your screencasts so I can decide if I have the time to watch it or if I should schedule time later. Thanks.
Comment by Brian Lang — July 10, 2008 @ 2:11 pm
8
Hi Chirs,
Thanks for the screencast! I find learning easier when I have visual aid and this is THE BEST tutorial on WP. Easy to understand and get a grasp on WordPress.
Thanks again!
Comment by Jason — July 10, 2008 @ 4:45 pm
9
Chris–
Thanks again for this second WP screencast! You make developing in WP look easy–it hasn’t been as easy or smooth for me, but I’m inspired by the screencasts. Despite what you may consider as boring, I actually learn from watching you code live, one line at a time–no need to speed it up for me. Thanks for sharing your knowledge!
Jim
Comment by Jim — July 10, 2008 @ 8:11 pm
10
actually picked up something.. sticky footer! well at least it stops me and from applying “”
Comment by Esben Thomsen — July 11, 2008 @ 4:28 am
11
Another excellent screencast!! You rock!!
Just a small suggestion, I know that you plan to make the source available at the final screencast but I find that when you bring up good points or explanations, I want to jot down notes next to the css or markup so it would be useful to get the source ahead of time.
Comment by Donna — July 11, 2008 @ 9:47 am
12
Absolutely outstanding work here Chris. I’ve been going over most of your screencasts, and you and I seem to think a lot alike when it comes to coding practices, software choices, etc. Really digging this WordPress stuff. I’m a big “from scratch” guy, but sometimes I’m finding it easier to use some of these frameworks and do more design work on top.
Great tutorial. I’m working mine up. I’m afraid I’ve ripped off your theme pretty badly. Consider it a complement. http://kevinmpowell.com
Comment by Kevin — July 12, 2008 @ 7:21 pm
13
Thanks Chris for the time and effort you put into making these tutes. Very much appreciated, and please keep ‘em coming.
Comment by Jackie — July 12, 2008 @ 9:10 pm
14
First, Respect to you man.
This is something i wanted to do for a long time now.
What i would love to see is how to list the blog posts inside another page other than the home page while posting lets say the first 2 inside the homepage. “i hope i make sense”
this would help alot.
thx again.
Comment by Fouad Masoud — July 13, 2008 @ 3:08 am
15
Hi Buddy,
I love your tutorial btw.
I was just wondering if there is any problem with the video tutorial itself, because back at home and at work it stops the playback (or rather download or stream) it the middle of the video?
Would you or anyone else in here have any idea what could be causing the problem?
Thanks.
PS2. keep up the good work.
sgnwsk
Comment by Michael — July 13, 2008 @ 7:13 pm
16
Just the right kinda tutorial I was looking for. Thanks Chris
Comment by Yamaniac — July 17, 2008 @ 12:25 am
17
THX for this. Will the mockup be available to download?
Comment by Matthias — July 17, 2008 @ 2:09 am
18
Hi
first of all i just want to say how much your great casts are appreciated.
one thing i want to ask: in the video you talk about a form service that sound very promising. i hate writing so many forms.
what is this service? i could not understood the name.
ron
Comment by ron — July 17, 2008 @ 2:14 am
19
Nice work.
Just thought I’d mention that not all browsers allow custom submit buttons (e.g. Camino)… some need a hack (like the one on problogger.net for the comments). I don’t think it’s really a big deal since regular buttons usually look okay anyway - same principle as the moz round corners I guess.
Comment by kristarella — July 19, 2008 @ 10:52 pm
20
For months I wanted to make an own theme for my Wordpress blog. I found many tutorials and none of them could really help me, that I gave up in the end.
I found your side 3 days ago, watched your screencasts and I understood, what you where doing there.
This morning I tried to make my own design and I am happy to say 70% is already done. I wouldn’t have tried it again without your screencasts, so big big thanks and please go on with what you’re doing!
Comment by Ricarda — August 19, 2008 @ 12:02 pm