WordPress for Designers: Day 5
Continuing with our WordPress theme development series, today we will learn how to split and call our seperate theme files and include them in our theme. Splitting theme code into different and organized files is a vital part of WordPress development. We will also look at some very helpful php functions and useful WordPress template tags to create our widgetized sidebar.
Day 5: The Sidebar
Be sure to click on the “Full Screen Toggle” to move to full screen.
Resources You Might Enjoy
Help Us!
We put a great deal of effort into bringing you these videos free of charge. If they have helped, we would greatly appreciate a submission to your favorite social networking site. Even a retweet will help! It allows us to continue providing you with top quality content. Thanks again.
- Subscribe to the Theme Forest RSS Feed.

















Nice one! I’m really loving this series.
Hope you feel better soon.
Great, keep it up!
Great job. Really enjoying this!
Great work Drew! Looking forward to day 6
I’m loving this serie, and learning a lot. Thanks…
It´s nice! Thank´s for this video…
Absolutely love the series. Was wondering why the 5th screencast wasn’t being done.
Thanks a bunch!
**runs off to build the first bit of his new theme**
Great work Drew! Looking forward to day 6
I’m loving this , and I’m learning a lot from the videos. Thanks
Great work Drew!
I really enjoy this series, it’s very helpful. Hope you’ll feel better soon.
Best wishes,
Gustaf.
Drew, thank you!
I really enjoy in this series!
Thanks Drew, for accepting my lil request, its rocks, but taking bit long time to procss video, hope by next week’s 3rd day there will be annother one,
V for u man, keepit up!
Yoosuf
Awesome series. I love this because I have been looking for wordpress tutorials for a long time. I get lost in the codex and have no idea where to start, I love this. Thanks for this!
It’s a great tutorial.
Thanks for share. :3
I love that tutorial, cuz I’m trying to use wordpress to be my blog.
But I didn’t understand php language, so..this tutorial can help me learn more. :3
I was hoping you’d include a login link.
Nice though, nice,
Kevin
Thanks for these tutorials – I’m sad now that I’ve caught up and have to wait now for the next one
You make it so easy to follow, well done!
Figured out the login link Just place this in your index file where ever you want your login/logout to appear.
Cheers,
Kevin
Hey, it didn’t take my code…
@Kevin-Try wrapping your code in html code tags with your code snippert, see if that helps. Glad you figured it out, I can include a login link in the next screencast also if you wish
@Everyone-Thanks for all the great comments, they keep us motivated!
I’m loving the Muppet references in this one.
To be honest this tutorial set has been an amazing start for me, but it was moving a little too slow for my learning tastes, so I delved into the codex and messed around with a site that I had been working on, and now I have site set up for a client with WP as a CMS.
Between this and the Diving into PHP on Nettuts, I now feel like I was designing and developing sites with just nouns. You both have taught me verbs.
So thanks so much for giving me the motivation and information to get into WordPress, I have been coming back to your new tuts since I am sure in my wild exploration that I missed out on some key elements.
Nice, but the video stops at the middle and I can’t watch the ending.
Great tutorial Drew! I’m learning more from you than I have from the thousands of dollars I’ve spent at school to learn web design. Keep up the great work!
I’ve do have a problem with my CSS is not working for the sidebar nor the nav. I’ve tried everything to move these things but nothing works. Can you post or link your CSS file so I can see if I’m doing something wrong? Thanks
Great series! It would be nice to see the css to make the sidebar on the side, instead of in the middle.
I got it from the source – thanks.
I was going along nicely validating with a strict 1.0 XHTML DOCTYPE until reaching this lesson. As with most server-side HTML generation processes, WordPress produces invalid markup which I thought would have been fixed by now.
For example, get_search_form() generates invalid markup.
This is obviously nothing to do with you Doug and your great tutorials, I was just wondering if you have any views on this?
For those interested in fixing the code in the sidebar to validate striuct XHTML (after some tweaking and research) I produced this code (might have to post again if markup needs escaping):
<form id="searchform" method="get" action="">
Search
<input type="submit" value="" />
Pages
Archives
Categories
Keep up the good work, I’m learning a lot.
Hmmm! code tags don’t escape the markup as Doug suggested in a previous comment so let’s try again …
<form id="searchform" method="get" action="<?php bloginfo(‘home’); ?>">
<fieldset>
<legend>Search</legend>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" value="<?php _e(‘Search’); ?>" />
</fieldset>
</form>
<h3>Pages</h3>
<ul><?php wp_list_pages(‘title_li=’);?></ul>
<h3>Archives</h3>
<ul><?php wp_get_archives();?></ul>
<h3>Categories</h3>
<ul><?php wp_list_categories(‘title_li=’);?></ul>
really nice videos , i started to work with wordpress now !
Great videos, im learning heaps! And i rofl everytime i see your new wallpaper haha!
You forgot to tag this post as Wordpress
Excellent post thank you!!
lol in this video you sound’s like that guy in “You suck in photoshop series”.
http://www.youtube.com/watch?v=U_X5uR7VC4M
Ps. I really enjoy your video cast
Great video tut! This is helping immensely!
There’s also another way to list your navigation as of wordpress 2.7. It uses the function
wp_page_menu()
This function allows you to add a “home” link by using the parameter
show_home=1
i.e. wp_page_menu(’show_home=1′)
Once again, thank you so much for your videos! I’m looking forward to going through the entire series
Hi, great video but iget some troubles with the nav, in fact i get some dots in front of each pages and the unordered list seems to be not inline like on the vid. Did i do something wrong ?
here a capture of my trouble…
http://www.picdo.net/fichiers/2009/9/19/0e96312b-13cd-46e3-beef-c6cd7a3a8ea2_capture.tiff