WordPress for Designers: Day 15

We’re back with our Wordpress for Designers series! Moving on with our ‘Paper Business’ theme, it’s time to bring in the slider. Today, we will build and implement a jQuery slider plugin into WordPress, style it properly, and discuss how we will pull out the information from the admin panel. Let’s get our slide on!

Day 15: The Slider

Resources You May Enjoy

Custom queries coming!

On day 16 of our series, we will take the slider we have created and learn how to pull out the information the user has entered. No need for the end user to hard code anything, stay tuned!



50

Comments
  • Frika says:

    Good things come to those who wait.
    Thank you very much!
    Regards

  • thanks for the update! been waiting for this part for so long!

  • Wazdesign says:

    Nice One.. keep sharing

  • OldH says:

    Excellent as always! Can’t wait for the next part – that’s when it gets interesting for me!!

  • ambrooks says:

    I was just talking to my mom about javascript sliders earlier today. Good timing, since I need to figure out how to make one now for her website :D Thanks!

  • creadionizor says:

    WOW TNX guys for the update I’ve been waiting for this one! TNX A LOT. Please keep up the series I really like them =).

  • Devin Rajaram says:

    I think that the image should be more over to the right so it looks centered between the text and the edge of the slider. But other than that a great tutorial.

  • Kevin says:

    Wow ! Can’t wait for day 17 !

  • john drach says:

    Can’t wait to check this out tonight. Thanks for this!

  • Marko Randjelovic says:

    Thanks, Drew. :)

  • Shibi Kannan says:

    Very nice – after a long time of waiting. I hope we dont have to wait for day 16 again.

  • CgBaran Tuts says:

    I was waiting for it thanks

  • Garrett says:

    I learn more from Drews screencasts than anywhere else. Thanks man, and can’t wait for teh next one.

  • ORiOn says:

    You should include links for the previous episodes. Like that new people don’t need to search for the previous ones.

  • said says:

    yami yamiiii
    the great day 15 is here , thank you very much didi

  • Matt P says:

    Great work Drew thanks! Looking forward to Day16 please don’t leave it so long :D

    Also anyone else still find this a little quiet? or is it time I chuck this laptop in the bin!

  • Matt says:

    @Matt P
    Yeah, it’s quiet.

  • is there any possibility where we can download the updated files without the images? having a hard time looking at the codes via my computer. the resolution of the screencast is kinda low i think.

    please let me know. if someone hard coded this. I tried to code it myself and i think i still got the previews error from the previews screen cast 14.

    anyway… thanks again drew! cant wait for day 16.

  • Yoosuf says:

    its a nice cast but till the end you did a Lazy pig work :)

    why you all the time used the wp-content/themes/themename/images/bla bla????, wp itself has a shot way of that na

    bloginfo(‘template_directory’);

  • johan says:

    is it possible to post the code for this day? i don’t need the GFX just the code.

  • CGLion says:

    Finally, thanx Drew, keep up… and don’t let us wait like that, some one could’ve died waiting :D

  • jermaine says:

    Another superb tutorial again, by the way can u include the code in you next screencast i cant see what ur typing very clearly.

  • Dave says:

    Gonna get my slide on when I get home from work. Looking forward to it.

  • DJ says:

    For all those that have trouble seeing the code through the player size. Create an empty HTML template and embed the movie file in the body tag, using the embed link through the player. Then change the video’s height and width so that it is double the original size you should be able to see the code. Funny, a tutorial about a tutorial.

  • 40 mins long and well worth it Drew, looking forward to Day 16.
    Reading the code that Drew’s typing up isn’t a problem, hit the ‘full screen’ button on the player, that’s why it’s there, if you can’t see clearly, go LARGE – no need to copy code into html file.
    Keep up the great work.

  • designbyjm says:

    Love day 15! Having some display issues, not sure if its CSS or actual XTHML coding.

    Could someone post the files for “feature_section.php” & “style.css” so that I could download them to double check my code? Thanks

  • Martyn says:

    Just wanted to show the love for the recent tutorials on wordpress and how much they have helped me understand it. I’m more of a monkey see monkey do kinda person so I can take the information in a lot better that way rather than reading on a particular subject.

    Keep up the great work and Ive subscribe to the rss feed. Thanks

  • John Doe says:

    Thanks again

  • Tom says:

    You should test that thing disabling JS.
    Must be usable and compatible

  • Fernando says:

    Good tutorial! good series! Keep it up! I’ve been learning a lot in a few weeks. Priceless!

  • John says:

    any news on when we can see day 16? I am willing, able and hungry!!

  • Parker says:

    same here man,can’t wait for day 16.

  • Mandy says:

    Fantasic series Drew, I can’t believe how much I’ve learnt in such a sort space of time. Thank you so much – can’t wait for Day 16! :)

  • Sean says:

    So is there no Day 16 yet?, or can I just not find it?

  • LennART says:

    fantastic series, in my opinion good sound quality, and with a trained eye it’s even possible to follow the code. Overall: satisfied! Except for the update time.. When I started following your screencasts, i thought new ‘days’ would be added soon after the last release. But it’s probably busy in the wood ;-)
    Thanks for the tuts! another person who cant wait for day 16…

  • Rossa says:

    Awesome TUTs man.

    Digg, Stumble etc etc

  • John says:

    any news at all on day 16?

  • David says:

    any way to download the code?

  • ben says:

    Where is day 16??? Come on!!!

  • When is this series going to pick up again? I have really learned a lot and have enjoyed it.

    Please come back or there’s gonna be a lot of us who will be very sad :(

  • ThomCurtis says:

    Hey.

    Firstly Drew, you’re a Prince among men.
    I’ve learnt more from you than from two years at University.
    And not only the Wordpress stuff – just your general use of syntax and styles – fantastic stuff.

    The text does get a little hard to read at times when you’re in Coda, even on full-screen I find myself sat right up against my 19″ monitor – a few of the special characters are hard to distinguish. Is there any way you could make it bigger? Coda’s choice of highlighting some things in a really light orange probably doesn’t help either!

    But finally, my slider isn’t looking quite right!
    Firstly it was a lot bigger than the featured section, but I’ve worked around this and now it fits. However the images it loads, don’t display entirely. For example, when it loads, I get half of image 1, and part of image 4.
    http://thomcurtis.co.uk/blog/
    Have a lookski if you don’t understand what I mean… :)

  • ThomCurtis says:

    Hi again!

    Okay, I fixed it myself.

    I did find, going through this tutorial, that a lot of your “top” and “left” values came out wrong on my screen.

    The fix for my slider error here was the “padding-left.” As soon as I got rid of that it works perfectly. As well as adjusting the size.

    So okay, no need to reply to that issue.
    But thanks again for a fabulous series, and I can’t wait for Day 16.

    Basically I’ve got a work-placement starting next week and they’ve asked me to learn some Wordpress, so let’s hope 16 turns up soon. ;)

  • Bob says:

    Is this series dead?

    It’s been almost a month since the last installment, and you haven’t replied to any of the comments left here.

    If you’ve lost interest in WordPress for Designers, fine, but how about letting us know?

  • C.44 says:

    It’s a sad thing it takes this long for day 16 to come. Should’ve called it week, or perhaps even month 16…

  • Alex says:

    Thank you Drew, your wordpress templates course is outstanding.

  • John Doe says:

    Where in the world is Carmen Sandiego?

  • ben says:

    You’d think after taking subscription costs and 60% on items in the marketplace that envato (or themeforest staff in particular) would take a minute out of their hectic routines to let the people who made this site what it is what exactly is happening with a 30 minute screencast that’s been pending for over a month.

    I subscribe, and I pay to on the other websites, but to be honest I’ve been nothing but disappointed with the amount of new public and members only screencasts, and the ONE series I actually use, that’s free is taking months and months to finish.

    Pull your finger out guys.

  • John Doe says:

    I concur

  • Cy says:

    Thanks for the tutorial, it’s helpful!

    If you want some feedback, it would be great to synthesize. 14 first minutes can be explained in one if you have the code already written (but explained later) and files prepared in advance.

    Longest doesn’t necessarily mean the better. You don’t have to make a 30 mins tutorial to make it more complete, you can explain the same concepts in less time.

    Cheers!
    Cynthia

  • Alan Neese says:

    Thanks Drew! A very interesting video.