Wooslider: A video tutorial

—

by

Jamie Marsland
in
[twitter style=”horizontal” float=”left”] [fblike style=”standard” float=”left” showfaces=”false” width=”450″ verb=”like” font=”arial”] [pinterest count=”horizontal” float=”left”][google_plusone size=”standard” float=”left” annotation=”none” language=”English (UK)”][divider_flat]

Wooslider is a great new slider plugin from Woothemes. WooSlider is powered by FlexSlider, a fully responsive jQuery slider plugin.

With Wooslider there are 3 ways to add slideshows to your WordPress websites.

  1. Posts – Great for visually highlighting important stories and posts from your website
  2. Slides – Great for showing video and picture content.
  3. Attached images – Great for creating great looking photo galleries

In the following video tutorials I walk you through ‘step by step’ how to create great looking slideshows with Wooslider. Also check out the Pootlepress Academy for more Woothemes tutorials.

[box]Video tutorial 1: Creating slideshows with Posts[/box]

Note: If you want to target the text colour of your post excerpt then here is the css code you will need

.slide-excerpt p {
color: #fff !important;
}

[hr]

[box]Video tutorial 2: Creating slideshows with Slides[/box]

[hr]

[box]Video tutorial 3: Creating slideshows with Attached images[/box]

[hr][box]Video tutorial 4: Wooslider settings[/box]

Comments

14 responses to “Wooslider: A video tutorial”

  1. KC Avatar
    KC

    What about template tags? Can those be inserted into the template directly? If so how do you do that? Whats the code snippet?

  2. Frank Avatar
    Frank

    How to add woo slider in the header of home page??

  3. Jim Avatar
    Jim

    I have tried to explain how to write template tags for Wooslider on my blog. I hope it helps 😀

    http://www.supercreatives.co.uk/2012/09/wooslider-template-tags-explained/

  4. PFP Avatar
    PFP

    Is the Wooslider just a more convenient way of installing Flexslider?

    I want to install one or the other on Genesis, and display images (not from post or pages) on a page.

    Thanks

    P

  5. dcannam Avatar
    dcannam

    very surprised there isn’t a straight forward way to customize the size of the slider.

  6. Jeanlouis Avatar
    Jeanlouis

    Hi Jamie,

    Thanks for your tutorials (and your new canvas menu pack).

    I have a question: I can see you resizing the slide image by drag & drop in wooslider tutorial 2 > how do you do that ? Are you using a plugin ?

    Thanks, cheers

    Jean-Louis

  7. Jonathan Avatar
    Jonathan

    How come I’m only seeing the same video for the Posts slider, in all four of the videos above?

  8. Jamie Marsland Avatar
    Jamie Marsland

    Hi Jeanlouis,

    I actually just resized the images outside of WordPress.

    Jamie

  9. Adrian Beckett Avatar
    Adrian Beckett

    Jamie,

    This is very useful. Thanks for adding this to the Canvas pack. Just in time – I had a week to go before completing a site for my client.

    A

  10. Vincent Avatar
    Vincent

    hi,
    Can you tell me is it possible to make the wooslider smaller as the images are taking up so much of the page?
    Thank you
    Kind regards
    Vincent

  11. hope meyers Avatar
    hope meyers

    hi jamie, love your site, been spending quite a bit of time here 🙂

    i have the wooslider installed but the images keep spreading to the full width of the page. i have spent hours googling the issue and can not seem to find a resolution. i have played with the image size and nothing works. is this controlled via css? is woo slider the same as flexslider, if so, why is one free and one not?

    1. Jamie Marsland Avatar
      Jamie Marsland

      Hi Hope,

      Thanks for the feedback.

      Yes wooslider was built upon Flexslider, and has been forked with new developments. It’s designed to fit the width of the space it contains, so it depends whether you want to fit within columns or sidebar. But it should fit both 🙂

      Jamie

  12. Robin Avatar
    Robin

    Jamie,

    Thanks for your contributions here.

    Is there a way to insert a slider on the homepage via wooslider?

    I am trying to get a full page width slider below the header and above the page content/sidebar. It doesn’t seem that the business or magazine templates offer this functionality.

    Thanks for any help you can offer.

  13. Mandy Avatar
    Mandy

    I am looking to command wooslider like the article below describes commanding the slidedeck plugin. I would prefer to continue using wooslider than using slidedeck but I am not finding forums that answer how to perform these commands.

    I am looking to command a slider from links within the page without the page refreshing and re-opening each time, as I am using the business slider as the main content of the page.

    I like this website and am considering joining the yearly membership if this is a place where questions like this can be answered. I use your blogs all of the time to answer questions yet have not found an answer to this.

    Here is the article I was referring to: http://www.slidedeck.com/blog/extending-slidedeck-controlling-the-slide-deck/

    Thank you ahead of time and I will check back! Thanks again for all of your amazing contributions for those of us using canvas and I look forward to growing my own skills in your community!

    Pura Vida!
    Mandy