opencart jcarousel在最新产品上

Question

Right now I'm learning Opencart, and I'm trying to make my latest product display with jCarousel. I'm using Opencart 1.5.4.

This is what I've already tried, but still failed: http://www.packtpub.com/article/opencart-themes-using-jCarousel-plugin

I'm editing the latest.tpl file step-by-step as in the tutorial, but I'm getting stuck on the eight step.

When I open Firefox and hit refresh nothing happens, no error or message. This is my latest.tpl file:

<script type="text/javascript" src="catalog/view/javascript/jquery/jCarousel/js/jquery.jcarousel.min.js"></script>

<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/jCarousel/skins/tango/skin.css" />

<script type="text/javascript">
jQuery(document).ready(function() {
   jQuery('#latestcarousel').jcarouseljcarousel();
});

</script>

<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content">
    <div id="latestcarousel" class="box-product">
      <?php foreach ($products as $product) { ?>
      <div class="jCarousel-skin-tango">
        <?php if ($product['thumb']) { ?>
        <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>
        <?php } ?>
        <div class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
        <?php if ($product['price']) { ?>
        <div class="price">
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
          <?php } ?>
        </div>
        <?php } ?>
        <?php if ($product['rating']) { ?>
        <div class="rating"><img src="catalog/view/theme/default/image/stars-<?php echo $product['rating']; ?>.png" alt="<?php echo $product['reviews']; ?>" /></div>
        <?php } ?>
        <div class="cart"><input type="button" value="<?php echo $button_cart; ?>" onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button" /></div>
      </div>
      <?php } ?>  
    </div>
  </div>
</div>

Any suggestion?

Answer 1

Please follow the step by step tutorial. You are not following it :). You have to write <ul> , <li> tags, but you are using <div> , please rewrite the code as suggested by the book. Thanks for choosing the book. The book uses properly running code examples, So, if there is any error, then we are not following the steps as mentioned in the opencart book .

Answer 2

This is what I do with latest.tpl file. It works now.

<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/jCarousel/skins/tango/skin.css" />

<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#latestcarousel').jcarousel({
scroll: 1,
visible: 3,
auto: 3,
rtl: true,
wrap: 'circular'
});
});

</script>

<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content">
    <div class="box-product">
        <ul id="latestcarousel" class="jcarousel-skin-tango">
        <?php foreach ($products as $product) { ?>
        <li class="carousel-latest">
            <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>
            <div class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
            <?php if ($product['price']) { ?>
            <div class="price">
                <?php if (!$product['special']) { ?>
            <?php echo $product['price']; ?>
            <?php } else { ?>
            <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
            <?php } ?>
         </div>
         <?php } ?>
        </li>
        <?php } ?>
        </ul>
    </div>
  </div>
</div>

Thanks for anything.