WordPress for Designers: Day 17

Did someone call for an integrated back end slider? Well, if you did, we heard you! After much anticipation from our readers, today is the day we integrate our slider with the backend of WordPress. We will learn all about how to use the WordPress media manager to let users setup, add, and edit the slider, all from the convenient backend of WordPress. This is a day you don’t want to miss, so fire up your server and let’s do this!

Day 17: Slider

Resources you May Enjoy.

What’s Next?

It’s your call. Now that we have completely covered the slider, what section of the theme would you like to tackle next? The choice is yours!


  • Nelson Milian says:


  • Meshach says:

    What about the diving into php series??

  • Arvind says:


  • Domas says:

    Finally! I was waiting for this screencast, I was wondering witch method you will chose to make this slider, and you surprised me ;]

  • Great Series Drew, I really liked it.

    Your series taught me skills and now i am doing wordpress projects.

  • Kevin says:

    Thanks for this one! I have followed this exactly and still can’t seem to get the paper plane image to load or show up on the individual pages? Is there anyway for you to release the entire code for this tut please? It’s just killing me!
    Thanks – Kevin

  • Kevin,

    Really glad you are enjoying the series. I can’t give you all of the code due to copyright issues with the theme we are using, but if you email me with more of your issue and/or a link to your page I’ll work with you to try and tackle the problem :)

  • z0r says:

    Finally, the 17th day. “WooHoo” !

  • C.44 says:

    Personally, in absence of this part of the lesson you just posted, i created my own little backend part. However, i do agree this is easier to implement, BUT, if you’d want to include different pieces of text or remove images, that would be a bit harder i think.

    I do love the way you get make use of the images that are being attached to a post/page. I never knew WP actually assigned pictures to posts.

  • @ C-44

    Thanks for your comments. It is true that only one block of text will be able to show up on the right, but this is the way we have coded the theme all along. If you wanted to remove (or add) images from the slider you would just remove them from the attachment gallery :)

    I didn’t know much about the attachment information either, I had to do a lot of digging to find out about it!

  • C.44 says:

    But removing them from the attachment gallery is in fact removing them from the medialibrary completely right ? Wouldn’t it be easier to create a number of posts in a “slider” category with each one image in the attachment gallery and then use the_content() for.. well the content and the attachment code to get that single image ? Although i’m not entirely sure about how you’d get a total number of posts whitout using a simple $i++ line for every loop the wp loop would make putting the posts into different slides as a whole.

    I don’t quite remember seeing you prevent those posts in the category “slider” from showing up as regular posts. How did you do that ?

  • Jose Espinal says:

    Could you guys make a section where you list all the series with their respective posts? I’m getting kinda lost on the “Screencasts” category.

  • I was actually expecting something regarding the integration of jQuery, I’m not a programmer and I hell don’t know JS. Yeah, I’m a new reader :) . But this is really cool to remember.

    Offtopic: You should definetly move onto Windows or at least change your Mac :) )

  • @ C.44

    I personally think it is easier to have them on one post. You need more images, add them, you don’t remove them. Simple and works well for the task at hand.

    I don’t quite remember seeing you prevent those posts in the category “slider” from showing up as regular posts. How did you do that ?

    That is for day 18, it’s really just a simple modification the blog loop though :-)

  • Missed a comma. That should have read:

    I personally think it is easier to have them on one post. You need more images, add them, you don’t, remove them.

  • fuSi0N says:

    Hey Drew, great tutorial! ;)
    I have one question though, do you select only the images needed for the slider or the entire gallery?
    What if you have more images in the wordpress gallery used for different blog posts?

  • danc Chan says:

    Hey, it’s great to see you back. Been missing you so much. Though you have decided to stop the screen cast though. lol

    Hey, you know what, if I say Chris Coyer my CSS Master, then you should be my wordpress Master. Thanks for sharing the step by step tutorial on WP with us.

    For the next next WP 4 Designer screen cast… Aren’t you planned and going to continue finish up the entire site? :D

  • Shibi Kannan says:

    Finally Day 17 has arrived. I love the wp_get_attachment_link() template tag. I was just manipulating it for automatically pulling post images in a custom wp loop. Thanks for pointing out Chris’s new site.
    One thing I have trouble understanding in this tut – how is the ‘prev’ / ‘next’ button working with the href pointing at # – maybe I missed that part in the previous day in this series. Need to look it up.
    For Day 18 or maybe Day 19 I would like to see you get into comments styling, separating trackbacks from replies, special author comment styling within the new wp_list_comments() template tag that is being implemented since wordpress2.7. There are articles on the same topics in Nettuts but they are for older version of wordpress. Although the codex explains the new css styles available, I am still trying to tackle the truckload of html markup spewed by this template tag.
    Keep up the good work.

  • adai says:

    I wait that for long,Think you Drew Douglass.

  • Henry says:

    Hey Drew Thanks for this! I know it takes time just wanted you to know I really appreciate the hard work you put into this to teach us all about Wordpress. I have one suggestion. If you could adjust your resolution lower so that we could see the code, the quality of the video isn’t to great at least for me it isn’t. Hope that’s not too much to ask for the next video :) Thanks again!

  • adai says:

    thank you ,but the quality of the video isn’t to great , and I hope you can have some videos about how to post articles with images and how to style for the the unique post.

  • adai says:

    there is a vote in .net magzine come here http://www.thenetawards.com/index.php .Vote for tuts.thank every body..

  • Ste says:

    With the category hard coded into the php, does that mean that if a theme is used on different wordpress installations, the user would have to change the category number in the php depending on what order the categories were created for each wordpress installation?

  • Joffrey says:

    Hi Drew,
    just wanted to say that I really enjoy the Designing Wordpress series, keep up the good work!

  • Joffrey says:

    Oh by the way, I have a question about a wordpress code you use in episode 14.

    You mentioned the function “the_content_rss” which works fine when it comes to retrieving text from a post. At this moment it does not show the image within my post, does this function not include the image or is it just me doing something wrong?

    Neitherway, enjoying the series!

  • Dan says:

    I have to say this series is great and, Drew, you’re a great teacher but I lost interest in it a few episodes ago and here’s why:

    First of all you used a premium (paid for) theme to teach with. I appreciate it’s a nice simple theme with good features which makes for great learning material but the fact you have to buy it to properly follow the tutorial is just shady (I know you say that you don’t need to but seriously, to get the best out of it, you do). I know it’s not expensive but you could have quite easily used a free theme for this. It’s just cheeky.

    Secondly I appreciate that you guys must have very busy schedules, but there is just far too much of a gap between chapters. A week or so is fine but several weeks just means that a lot of users will have forgotten exactly where you got up to last time and it gets frustrating.

    Sadly I’ve found this happening with a few of these turorial series’. They start out frequent and at a nice pace but then they slacken off and get farther and farther apart.

  • Sean Smyth says:

    The styling of the comments would be pretty high up there for me or maybe your opinions on the alternatives to the default WP comments system like http://disqus.com/home/ or http://js-kit.com/. Or maybe even the styling of the alternatives.

    Just a thought and many thanks for the many hours spent on us all. :)

  • Ronn0 says:

    I want to thank you for this wordpress series! Now I could create a theme and post in to ThemeForest!

    Again, thanks a lot!

  • Roberto says:

    Hey! You’ve forgot to post this also in wordpress!

  • Ben Good says:

    awesome tutorial, thanks for sharing!

  • Drew,

    Your tutorials are awesome!
    I am just curious if there is a way to get the source files so we can check our code against yours? Apparently the screencast is a little fuzzy and it seems like every one you do, it’s very hard to read the code you are typing.

    Could you or anyone for that matter, help me out here? Thanks


  • Drew, great work once again.
    I am having a little trouble viewing the code, it’s a little blurry. Can someone send me a source file, preferably for the whole project so far?
    Thanks so much,
    Jacob M

  • jose says:

    great! .. thank

  • Straderade says:

    I’m having the same issue as Jacob, I really can’t see the actual code because it’s really, really blurry. I’m not complaining, cause Drew I really appreciate these tuts but If you could post the slider code or send it along that would be awesome.