Feature Content Slider for WordPress

Hi,

I'm trying to implement a feature content slider for my WordPress blog (link below).

I found two great tutorials:

Creating a Slick Auto-Playing Featured Content Slider
Create Featured Content Slider Using jQuery UI

Both tutorials are pretty comprehensive, but for a non-coder like me they are still complicated... I just need to clarify a few basic things. For example, from what I understand, there are three part: the library (Javascript), the content feature and the CSS files. Well, I'm not clear where to put these...!

Do you know any similar tutorials for beginners like me?

 

You need to upload the supplied javascript and css files to your server. You would probably want to create folders for each off the root - like js and css. You then need to to put the css in a file called mycss.css (name "mycss" anything you want).

You then reference the file in the head of your html page. Just look at the source code of the demo page. That should give you a good idea of what you need to do.

 

Thank you so much for the quick reply!

(and for not laughing at me )

I'm studying the second tutorial for now: http://webdeveloperplus.com/jquery/featured-content-slider-using-jquery-ui/

Uploading javascript and the CSS file supplied, this is clear now. Thanks!

And for the part the tutorial author called the "The Featured Content Structure". He says: "Now create a div with its contents as the tabs structured as a list and content corresponding to each tab within a separate div." Should I put that in the header.php of my WordPress file? I'm not clear on that.

Finally, at the end, a code is supplied:

I assume this is the final code to call the slider, right?

Sorry again for the basic questions!

 

The featured content goes wherever you want it to display. If you want it in the header, try adding it there (it really depends on the template you are using).

The end code is the javascript call and it goes in the head.

<script type='text/javascript'>
$(document).ready(function(){
$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
</script>

 

Nice. I really needed this for wordpress. I had been searching everywhere from something like this, but now I use a wordpress theme that comes with a slider,but it seems that these two sliders are a bit better.

 

Thank you for your help. I think I get it now...!

Sleepy now but will try to implement tomorrow.