Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have a custom post type that is just a paginated post and acts as a slideshow. How can I make it so that the reader can choose an option to have the slideshow advance automatically to the next page after some preset interval (like 10 seconds)?

share|improve this question
    
This is done with javascript so what slideshow are you using. –  Wyck Dec 18 '10 at 1:01
    
It's not a slideshow in the traditional sense. It's just a paginated custom post type. So its just paging through the different pages of the post. So the main permalink would be http://mysite.com/post-title/ then the second page (or slide) would be http://mysite.com/post-title/2/ –  matt Dec 18 '10 at 2:46
    
Hey @matt, just curious it my answer helped? –  MikeSchinkel Dec 22 '10 at 23:57
add comment

1 Answer

up vote 5 down vote accepted

Hi @matt:

To achieve what you are asking you need to add some code to queue up a Javascript file and then the Javascript file itself.

You can put the code that follows in your theme's functions.php file. You'll note it uses is_admin() to avoid loading the Javascript code in your /wp-admin/ console; you should also add a criteria to avoid loaded it except on the pages where you need (however I wasn't sure how to limit it since your question didn't explain enough specifics to do so):

add_action('init','action_init_page_auto_advance');
function action_init_page_auto_advance() {
  if (!is_admin()) { // Make this if() limited to just the pages you need.
    $ss_url = get_stylesheet_directory_uri();
    wp_enqueue_script('jquery');
    wp_enqueue_script('page-auto-advance', 
      "{$ss_url}/js/page-auto-advance.js",
      array("jquery")
    );
  }
}

The prior code loads a file called page-auto-advance.js that you'll place in a subdirectory of your theme named /js/ and here's that file. Note it assumes you have "next" links on your site in the format of <a rel="next" href="...">...</a>:

jQuery(document).ready(function($){
  var href = $("a[rel='next']").attr("href");
  if (href!=undefined)
    setTimeout('window.location.href = jQuery("a[rel=\'next\']").attr("href");',5000);
});

The prior Javascript will advance the page every five seconds (5000 = 5 x 1000 milliseconds) if it finds a link with a rel="next" on the page.

One thing to be aware of is you might find that it advances when you don't want it to but with this code hopefully you'll have a starting point that will let you fine-tune it.

share|improve this answer
    
Sorry about that I got behind with the holidays and then this got put on hold. I still haven't gotten it to work but your code looks good and should get me to where I need to be. –  matt Jan 17 '11 at 15:51
    
@matt - What's it not doing? –  MikeSchinkel Jan 18 '11 at 0:36
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.