Integrating Jcarousel into wordpress to display related posts

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:

Read More
<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.

Related posts

Leave a Reply