I am trying to use jcarousel to show related posts that can be scrolled through, the code I’m using to show related posts is:
$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag)
$tag_ids[] = $individual_tag->term_id;
$args = array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=>4, // Number of related posts that will be shown.
'caller_get_posts'=>1,
'post_type'=>'books'
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {
while( $my_query->have_posts() ) {
$my_query->the_post(); ?>
<ul id="mycarousel" class="jcarousel-skin-tango">
<li>
<div class="relatedthumb">
<a href="<? the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_post_thumbnail(); ?></a>
</div>
</li>
<? }
echo '</ul></div>';
}
} else {
echo 'No Related Posts Found';
}
$post = $orig_post;
wp_reset_query();
and the code to initialize jcarousel is:
<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
<!--
jCarousel library
-->
<script type="text/javascript" src="../lib/jquery.jcarousel.min.js"></script>
<!--
jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="../skins/tango/skin.css" />
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel();
});
</script>
This code works only when I have a static unordered list. But when I am calling the list items dynamically it doesn’t work. Please help me sort this out.
The link to the page I downloaded Jcarousel is http://sorgalla.com/jcarousel/ they have examples on how to load dynamic content but I don’t think any of their examples apply to my question, so I would greatly appreciate your help.
Edit:
Nevermind. I figured it out on my own. I had the
<ul id="mycarousel" class="jcarousel-skin-tango">
in the wrong place it should have been called right before the related post code.