I have a problem with a custom template, as after i add a product to the cart, no confirmation is displayed.In detail, after adding a product nothing happens and for example the cart information in the header stays empty. (See picture one)
http://de.tinypic.com/r/2hozei0/8
After clicking on the empty cart suddenly the product appears. (See picture two)
So its seems that the success message and the cart refresh is missing after adding a product.
http://i58.tinypic.com/20zcl6g.png
Figured it out that the needed handling appears in catalog/view/javascript/common.js
Functions like "addToWishList" or "addToCompare" are working but the "addToCart" is NOT working.
function addToCart(product_id, quantity) {
quantity = typeof(quantity) != 'undefined' ? quantity : 1;
$.ajax({
url: 'index.php?route=checkout/cart/add',
type: 'post',
data: 'product_id=' + product_id + '&quantity=' + quantity,
dataType: 'json',
success: function(json) {
$('.success, .warning, .attention, .information, .error').remove();
if (json['redirect']) {
location = json['redirect'];
}
if (json['success']) {
$('#notification').html('<div class="success" style="display: none;">' + json['success'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>');
$('.success').fadeIn('slow');
$('#cart-total').html(json['total']);
$('html, body').animate({ scrollTop: 0 }, 'slow');
}
}
});}
Any help appreciated! I am using OC 1.5.6
Regards!
see my /template/common/header.tpl
<!DOCTYPE html>
<html dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>">
<head>
<meta charset="UTF-8" />
<title><?php echo $title; ?></title>
<base href="<?php echo $base; ?>" />
<?php if ($description) { ?>
<meta name="description" content="<?php echo $description; ?>" />
<?php } ?>
<?php if ($keywords) { ?>
<meta name="keywords" content="<?php echo $keywords; ?>" />
<?php } ?>
<?php if ($icon) { ?>
<link href="<?php echo $icon; ?>" rel="icon" />
<?php } ?>
<?php foreach ($links as $link) { ?>
<link href="<?php echo $link['href']; ?>" rel="<?php echo $link['rel']; ?>" />
<?php } ?>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/stylesheet.css" />
<link href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/cloud-zoom.css" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/superfish.css" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/slideshow.css" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/jquery.prettyPhoto.css" rel="stylesheet" type="text/css" />
<?php foreach ($styles as $style) { ?>
<link rel="<?php echo $style['rel']; ?>" type="text/css" href="<?php echo $style['href']; ?>" media="<?php echo $style['media']; ?>" />
<?php } ?>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/ui/themes/ui-lightness/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="catalog/view/javascript/jquery/ui/external/jquery.cookie.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript" src="catalog/view/javascript/jquery/colorbox/jquery.colorbox.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery.cycle.js"></script>
<link href="catalog/view/theme/<?php echo $this->config->get('config_template'); ?>/stylesheet/skin.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/colorbox/colorbox.css" media="screen" />
<link href='//fonts.googleapis.com/css?family=Krona+One' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
<!--[if IE]>
<script type="text/javascript" src="catalog/view/javascript/jquery/fancybox/jquery.fancybox-1.3.4-iefix.js"></script>
<![endif]-->
<!--[if lt IE 8]><div style='clear:both;height:59px;padding:0 15px 0 15px;position:relative;z-index:10000;text-align:center;'><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." /></div><![endif]-->
<script type="text/javascript" src="catalog/view/javascript/jquery/tabs.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/easyTooltip.js"></script>
<script type="text/javascript" src="catalog/view/javascript/common.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jQuery.equalHeights.js"></script>
<script type="text/JavaScript" src="catalog/view/javascript/cloud-zoom.1.0.2.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jscript_zjquery.anythingslider.js"></script>
<script type="text/javascript" src="catalog/view/javascript/superfish.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery.bxSlider.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/script.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/nivo-slider/jquery.nivo.slider.pack.js"></script>
<?php foreach ($scripts as $script) { ?>
<script type="text/javascript" src="<?php echo $script; ?>"></script>
<?php } ?>
<!--[if IE 8]>
<style>
.success, #header #cart .content { border:1px solid #e7e7e7;}
</style>
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/ie7.css" />
<![endif]-->
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/ie6.css" />
<script type="text/javascript" src="catalog/view/javascript/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('#logo img');
</script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="catalog/view/theme/<?php echo $this->config->get('config_template');?>/stylesheet/livesearch.css"/>
<?php if ($stores) { ?>
<script type="text/javascript"><!--
$(document).ready(function() {
<?php foreach ($stores as $store) { ?>
$('body').prepend('<iframe src="<?php echo $store; ?>" style="display: none;"></iframe>');
<?php } ?>
});
//--></script>
<?php } ?>
<?php echo $google_analytics; ?>
</head>
<body class="<?php echo empty($this->request->get['route']) ? 'common-home' : str_replace('/', '-', $this->request->get['route']); ?>">
<div class="bg-1">
<div class="main-shining">
<div class="row-1">
<div id="header">
<div class="toprow">
<div class="outer1">
<?php echo $currency; ?>
<div id="welcome">
<?php if (!$logged) { ?>
<?php echo $text_welcome; ?>
<?php } else { ?>
<?php echo $text_logged; ?>
<?php } ?>
</div>
<div class="phone">
<?php echo $telephone; ?>
</div>
<?php echo $language; ?>
<div class="clear"></div>
</div>
</div>
<div class="outer1">
<?php if ($logo) { ?>
<div id="logo"><img src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" /></div>
<?php } ?>
<div class="header-top1">
<div id="search">
<div class="button-search"></div>
<input type="text" name="search" placeholder="<?php echo $text_search; ?>" value="<?php echo $search; ?>" />
</div>
<div class="clear"></div>
<div class="cart-position">
<div class="cart-inner"><?php echo $cart; ?></div>
</div>
<div class="clear"></div>
<div class="topmenu">
<ul class="links">
<?php if (!isset($this->request->get['route'])) { $route='active'; } else {$route='';}?> <li class="first"><a class="<?php echo $route; if (isset($this->request->get['route']) && $this->request->get['route']=="common/home") {echo "active";} ?>" href="<?php echo $home; ?>"><?php echo $text_home; ?></a></li>
<li><a class="<?php if (isset($this->request->get['route']) && $this->request->get['route']=="account/wishlist") {echo "active";} ?>" href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?></a></li>
<li><a class="<?php if (isset($this->request->get['route']) && $this->request->get['route']=="account/account") {echo "active";} ?>" href="<?php echo $account; ?>"><?php echo $text_account; ?></a></li>
<li><a class="<?php if (isset($this->request->get['route']) && $this->request->get['route']=="checkout/cart") {echo "active";} ?>" href="<?php echo $shopping_cart; ?>"><?php echo $text_shopcart; ?></a></li>
<li><a class="<?php if (isset($this->request->get['route']) && $this->request->get['route']=="checkout/checkout") {echo "active";} ?>" href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></li>
</ul>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div id="menu">
<script type="text/javascript">
$(document).ready(function(){
$('.menu ul li').last().addClass('last');
$('.menu ul li li').last().addClass('last');
});
</script>
<?php if ($categories) { ?>
<ul class="menu">
<?php $cv=0;?>
<?php foreach ($categories as $category) { $cv++; ?>
<?php if ($category['category_id'] == $category_id) { ?>
<li class="active cat_<?php echo $cv ?>">
<?php } else { ?>
<li class="cat_<?php echo $cv ?>">
<?php } ?>
<?php echo $category['name']; ?>
<?php if ($category['children']) { ?>
<?php for ($i = 0; $i < count($category['children']);) { ?>
<ul>
<?php $j = $i + ceil(count($category['children']) / $category['column']); ?>
<?php for (; $i < $j; $i++) { ?>
<?php if (isset($category['children'][$i])) { ?>
<?php $id=$category['children'][$i]['category_id'];?>
<?php if ( $id == $child_id) { ?>
<li class="active">
<?php } else { ?>
<li>
<?php } ?>
<?php if ($category['children'][$i]['children3']) {?>
<a class="screenshot1" href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name'];?></a>
<ul>
<?php foreach ($category['children'][$i]['children3'] as $ch3) { ?>
<li>
<?php if ($ch3['category_id'] == $ch3_id) { ?>
<?php echo $ch3['name']; ?>
<?php } else { ?>
<?php echo $ch3['name']; ?>
<?php } ?>
</li>
<?php } ?>
</ul>
<?php } else {?>
<a class="screenshot1" href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name'];?></a>
<?php }?>
</li>
<?php } ?>
<?php } ?>
</ul>
<?php } ?>
<?php } ?>
</li>
<?php } ?>
</ul>
<?php } ?>
<div class="clear"></div>
</div>
</div>
<?php if ($modules) {?>
<div class="header-modules">
<?php foreach ($modules as $module) { ?>
<?php echo $module; ?>
<?php } ?>
<div class="clear"></div>
</div>
<?php }?>
<div class="main-container">
<p id="back-top"> <span></span> </p>
<div id="container">
<div id="notification"> </div>
I think it should be ok, any clue why the functions $('.success').fadeIn('slow'); / $('#cart-total').html(json['total']); are not working?
I tried to change to the default template and the same problem appears, so maybe its no problem with the template?
You have to add , and this portion in the header template.
Related
I want to use jQuery Mobile to make a persistent tab. But when I apply this to my view, it will destroy my page. I'm using CodeIgniter.
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
It will make my search column become like this:
When I open the side bar or click the link from the persistent bar to open another page, the page that I open will look like this:
This is how i implement the jQuery Mobile in my view:
<!DOCTYPE html>
<html>
<head>
<title>home</title>
<link href="<?php echo base_url();?>css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="<?php echo base_url();?>js/jquery.min.js"></script>
<script src="<?php echo base_url();?>js/bootstrap.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="<?php echo base_url();?>css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Food shop Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.googleapis.com/css?family=Rokkitt:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lobster+Two:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<!--//fonts-->
<script type="text/javascript" src="<?php echo base_url();?>js/move-top.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>js/easing.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
});
});
</script>
<link href="<?php echo base_url();?>css/index.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="<?php echo base_url();?>css/imgslider.css" type="text/css" media="screen" />
<script src="<?php echo base_url();?>js/slideout.min.js"></script>
<script src="<?php echo base_url();?>js/jquery.wmuSlider.js"></script>
<script src="<?php echo base_url();?>js/jquery.wmuGallery.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
</head>
<body>
<nav id="menu">
<h1 style="color:white">Menu</h1>
<hr style="color:white;">
<ul>
<?php if($tipeUser=="user"){?>
<li><h4 style="color:white">Welcome <?php echo $nama;?></h4></li>
<li><h4>Home</h4></li>
<li><h4>My Voucher</h4></li>
<li><h4>Profile</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<li><h4>Logout</h4></li>
<?php } else if($tipeUser=="restoran"){ ?>
<li><h4 style="color:white">Welcome <?php echo $nama;?></h4></li>
<li><h4>Home</h4></li>
<li><h4>Dashboard</h4></li>
<li><h4>Voucher Management</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<!-- <li><h4>Reedem Voucher</h4></li> -->
<li><h4>Logout</h4></li>
<?php } else if($tipeUser==""){ ?>
<li><h4>Home</h4></li>
<li><h4>Login / Register</h4></li>
<li><h4>Voucher</h4></li>
<li><h4>Restaurants</h4></li>
<?php
if($data_kategori->num_rows()>0)
{
foreach ($data_kategori->result() as $rows)
{ ?>
<li><h4><?php echo $rows->nama_jenis_makanan;?></h4></li>
<?php } } ?>
<li><h4>Faq</h4></li>
<li><h4>Blog</h4></li>
<?php } ?>
</ul>
</nav>
<main id="panel">
<header><!--header-->
<div class="header-in" >
<div class="container">
<!---->
<div class="header-bottom" >
<div class="col-xs-1">
<button class="toggle-button"></button>
</div>
<div class="col-xs-11">
<?php echo form_open('home_controller/search_bar',array('method' => 'get'));?>
<div class="search">
<form>
<input type="text" id= "input-keyword" name="input-keyword" placeholder="Search ..." value="<?php echo set_value('input-keyword')?>" >
<input type="submit" value="">
</form><?php echo form_close(); ?>
</div>
</div>
<div class="clearfix"> </div>
</div>
<!---->
</div>
</div>
<!---->
<div id="myCarousel" class="carousel slide" data-ride="carousel" data-role="content">
<?php
if($dataSliderVoucher->num_rows()>0)
{ ?>
<div class="carousel-inner" role="listbox">
<?php
$i = 1;
foreach ($dataSliderVoucher->result() as $rowsSliderVoucher)
{
if($i==1)
{
?>
<div class="item active">
<center><img src="<?php echo $url_image;?>restaurant/<?php echo $rowsSliderVoucher->id_restoran?>/deals/<?php echo $rowsSliderVoucher->gambar_voucher?>" height="200em" class="img-responsive" alt=""></center>
</br>
</br>
</br>
<div class="carousel-caption">
<h2><b><?php echo $rowsSliderVoucher->nama_voucher?></b></h2>
</div>
</div>
<?php }
else
{ ?>
<div class="item">
<center><img src="<?php echo $url_image;?>restaurant/<?php echo $rowsSliderVoucher->id_restoran?>/deals/<?php echo $rowsSliderVoucher->gambar_voucher?>" height="200em" class="img-responsive" alt=""></center>
</br>
</br>
</br>
<div class="carousel-caption">
<h2><b><?php echo $rowsSliderVoucher->nama_voucher?></b></h2>
</div>
</div>
<?php }
$i++;} ?>
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<?php } ?>
<!---->
<div id="loader"></div>
<div id="scroll-container" class="row">
<div class="container">
<div class="specials">
<?php if($dataLastDeals->num_rows()>0)
{
foreach ($dataLastDeals->result() as $rowsLastDeals)
{ ?>
<div class="col-xs-12" style="border:1px solid black;">
</br>
</br>
<?php if($tipeUser=="user" || $tipeUser==""){ ?>
<div class="actions">
<?php
if($rowsLastDeals->sisa_voucher > 0) {
?>
<center>
<a href="<?php echo base_url();?>home_controller/GetVoucher/<?php echo $rowsLastDeals->id_voucher;?>">
<img src="<?php echo base_url();?>.././img/restaurant/<?php echo $rowsLastDeals->id_restoran;?>/deals/<?php echo $rowsLastDeals->gambar_voucher;?>" class="img-responsive-search" alt="" style="object-fit: fill;height: 250px; ">
</a></center>
<div class="col-xs-6">
<h3 style="font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"><b><?php echo $rowsLastDeals->nama_restoran?></b></h3>
</div>
<div class="col-xs-6">
<h3 style="font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;" align="center">Available <?php echo $rowsLastDeals->sisa_voucher. ' Voucher'?> </h3>
</div>
<?php
}
else{ ?>
<img src="<?php echo base_url();?>.././img/restaurant/<?php echo $rowsLastDeals->id_restoran;?>/deals/<?php echo $rowsLastDeals->gambar_voucher;?>" class="img-responsive-search" alt="" style="object-fit: fill;height: 250px; ">
<div class="col-xs-6">
<h4 align="center" style="color:red; font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;"><?php echo $rowsLastDeals->nama_restoran?> <br></h4>
</div>
<div class="col-xs-6">
<h4 align="center" style="color:red; font-size: 3vw;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">NOT AVAILABLE <br></h4>
</div>
<?php }
?>
</div>
<?php } ?>
<!-- End Product -->
</div>
<?php }} ?>
</div>
</div>
</div>
</header>
</main>
<?php $j=0; ?>
<div id="pages">
<?php
for($i=0; $i< $total_data; $i++)
{
?>
<?php $j=$j+8;
} ?>
</div>
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<div data-role="navbar">
<ul>
<li>Home</li>
<li>Account</li>
<li>Voucher</li>
<li>Faq</li>
<li>Blog</li>
</ul>
</div>
</div> <!-- /footer -->
<?php if($this->session->flashdata('message')) :
echo "<script>alert('". $this->session->flashdata('message')."')</script>";
endif; ?>
<script src="<?php echo base_url();?>js/jquery-1.10.0.min.js"></script>
<script src="<?php echo base_url();?>js/script.js"></script>
</body>
<script>
var slideout = new Slideout({
'panel': document.getElementById('panel'),
'menu': document.getElementById('menu'),
'padding': 190,
'tolerance': 70
});
// Toggle button
document.querySelector('.toggle-button').addEventListener('click', function() {
slideout.toggle();
});
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
if( userAgent.match( /iPad/i ) || userAgent.match( /iPhone/i ) || userAgent.match( /iPod/i ) )
{
slideout.disableTouch();
}
// auto close
slideout.on('open', function() {
$( "#panel" ).click(function() {
return false;
});
$( "#panel" ).click(function() {
slideout.close();
});
});
slideout.on('close', function() {
$( "#panel" ).unbind('click');
});
</script>
<script>
$('.gallery').wmuSlider();
</script>
<script>
$(function() {
$( "[data-role='navbar']" ).navbar();
$( "[data-role='header'], [data-role='footer']" ).toolbar();
});
// Update the contents of the toolbars
$( document ).on( "pagecontainershow", function() {
// Each of the four pages in this demo has a data-title attribute
// which value is equal to the text of the nav button
// For example, on first page: <div data-role="page" data-title="Info">
var current = $( ".ui-page-active" ).jqmData( "title" );
// Change the heading
$( "[data-role='header'] h1" ).text( current );
// Remove active class from nav buttons
$( "[data-role='navbar'] a.ui-btn-active" ).removeClass( "ui-btn-active" );
// Add active class to current nav button
$( "[data-role='navbar'] a" ).each(function() {
if ( $( this ).text() === current ) {
$( this ).addClass( "ui-btn-active" );
}
});
});
</script>
</html>
Please help me to solve this problem. I had already searched for a solution. But I couldn't find anything. I had been struggling with this problem for weeks.
I'm trying to center a image on a joomla site I'm building. It's a logo that's been placed in the header. Here is a link to the site http://www.gothamtattoos.com/mmp_upgrade/index.php (logo.png at the top is one I'm talking about). I've tried a few different things but my attempts either didn't do anything or they messed with the display of the top menu. I read on here about setting margin to auto and position to relative, etc. but it didn't work or perhaps I'm adding it to the wrong place.
Here is the section of the index.php file that pertains to the logo. I'm not much a coder at all and only slightly know what I'm doing, so descriptive replies will be greatly appreciated. Thanks in advance for the help.
$logopath = $this->baseurl . '/templates/' . $this->template . '/images/logo.png';
$logo = $this->params->get('logo', $logopath);
$logoimage = $this->params->get('logoimage');
$sitetitle = $this->params->get('sitetitle');
$sitedescription = $this->params->get('sitedescription');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type="text/css" />
<link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/sfhover.js"></script>
</head>
<body>
<div id="wrapper">
<!-- TopNav -->
<?php if($this->countModules('position-13')): ?>
<div id="topnav_wrap">
<div id="topnav">
<jdoc:include type="modules" name="position-13" style="xhtml" />
</div>
</div>
<?php endif; ?>
<div id="header_wrap">
<div id="header">
<!-- Logo -->
<div id="logo">
<?php if ($logo && $logoimage == 1): ?>
<img src="<?php echo htmlspecialchars($logo); ?>" alt="<?php echo $sitename; ?>" />
<?php endif; ?>
<?php if (!$logo || $logoimage == 0): ?>
<?php if ($sitetitle): ?>
<?php echo htmlspecialchars($sitetitle); ?><br/>
<?php endif; ?>
<?php if ($sitedescription): ?>
<div class="sitedescription"><?php echo htmlspecialchars($sitedescription); ?></div>
<?php endif; ?>
<?php endif; ?>
</div>
<!-- Topmenu -->
<div id="topmenu">
<jdoc:include type="modules" name="position-1" />
</div>
</div>
</div>
Here is the css
http://www.gothamtattoos.com/mmp_upgrade/templates/jaxstorm-black/css/template.css
To centre the image, you only need to adjust some CSS.
#logo {
float:none;
}
#logo img {
display:block;
margin:0 auto;
}
You Set your Logo as a Background, Try to set it as a img
<div id="leftcol">
<div class="leftpadding">
<div class="logo_container">
<h1 class="logo"> <a href="/index.php" title="">
<span>
<img src="your_logo_url" alt="logo" />
</span>
</a> </h1>
</div>
<div class="moduletable">
</div>
</div>
I got problem error after minify my code, in developer tools it's notice Uncaught TypeError: $.totalStorage is not a function line = view = $.totalStorage('display');.
The function for change display product from list to grid. and there are 2 page (search and product) using this function.
As well i know the function is fine (because i not touch it), the problem is the library.
This the function js :
function display(view) {
if (view == 'list') {
$('.product-grid').attr('class', 'product-list');
$('.product-list > div').each(function(index, element) {
html = '<div class="right">';
html += '<div class="cart">' + $(element).find('.cart').html() + '</div>';
//html += ' <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '<div class="compare">' + $(element).find('.compare').html() + '</div>';
html += '</div>';
html += '<div class="left">';
var image = $(element).find('.image').html();
if (image != null) {
html += '<div class="image">' + image + '</div>';
}
var price = $(element).find('.price').html();
if (price != null) {
html += '<div class="price">' + price + '</div>';
}
html += '<div class="name">' + $(element).find('.name').html() + '</div>';
html += '<div class="description">' + $(element).find('.description').html() + '</div>';
var rating = $(element).find('.rating').html();
if (rating != null) {
html += '<div class="rating">' + rating + '</div>';
}
html += '</div>';
$(element).html(html);
});
$('.display').html('<b><?php echo $text_display; ?></b> <span
class="showlist"><span class="glyphicon glyphicon-list"></span></span> | <span class="showgrid"><a onclick="display(\'grid\');"><span class="glyphicon glyphicon-th"> </span></a></span>');
$.totalStorage('display', 'list');
} else {
$('.product-list').attr('class', 'product-grid');
$('.product-grid > div').each(function(index, element) {
html = '';
var image = $(element).find('.image').html();
if (image != null) {
html += '<div class="image">' + image + '</div>';
}
html += '<div class="name">' + $(element).find('.name').html() + '</div>';
html += '<div class="description">' + $(element).find('.description').html() + '</div>';
var price = $(element).find('.price').html();
if (price != null) {
html += '<div class="price">' + price + '</div>';
}
var rating = $(element).find('.rating').html();
if (rating != null) {
html += '<div class="rating" align=center>' + rating + '</div>';
}
html += '<div class="cart">' + $(element).find('.cart').html() + '</div>';
//html += '<div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '<div class="compare">' + $(element).find('.compare').html() + '</div>';
$(element).html(html);
});
$('.display').html('<b><?php echo $text_display; ?></b> <span class="showlist"><a onclick="display(\'list\');"><span class="glyphicon glyphicon glyphicon-th-list"> </span><?php /*echo $text_list; */?></a></span> | <span class="showgrid"><span class="glyphicon glyphicon-th"> </span> <?php /* echo $text_grid; */ ?></span>');
$.totalStorage('display', 'grid');
}
}
view = $.totalStorage('display');
if (view) {
display(view);
} else {
display('list');
}
I using opencart version 1.5.5.1
This is header : (where library call) js in bottom
<!DOCTYPE html>
<html dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8" />
<meta name="google-site-verification" content="" />
<title><?php echo $title; ?></title>
<meta name="alexaVerifyID" content="" />
<base href="<?php echo $base; ?>" />
<?php if ($description) { ?>
<meta name="description" content="<?php echo $description; ?>" />
<?php }else{?>
<meta name="description" content="" />
<?php } ?>
<?php if ($keywords) { ?>
<meta name="keywords" content="<?php echo $keywords; ?>" />
<?php }else{?>
<meta name="keywords" content="">
<?php } ?>
<?php if ($icon) { ?>
<link href="<?php echo $icon; ?>" rel="icon" />
<?php } ?>
<?php foreach ($links as $link) { ?>
<link href="<?php echo $link['href']; ?>" rel="<?php echo $link['rel']; ?>" />
<?php } ?>
<!-- =================== Stylesheet =================== -->
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/combine-style.min.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/style.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/responsive.css" />
<!-- COMBINE = combine-style.min.css
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/stylesheet.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/mobile-style.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/jquery-ui-1.10.4.custom.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/owl.carousel.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/owl.theme.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/owl.transitions.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/slicknav.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/popup.css" />
<link rel="stylesheet" type="text/css" href="catalog/view/theme/stylesheet/responsive.css" />
-->
<?php foreach ($styles as $style) { ?>
<link rel="<?php echo $style['rel']; ?>" type="text/css" href="<?php echo $style['href']; ?>" media="<?php echo $style['media']; ?>" />
<?php } ?>
<!-- =================== Javascript =================== -->
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.9.1.min.js"></script>
<?php foreach ($scripts as $script) { ?>
<script type="text/javascript" src="<?php echo $script; ?>"></script>
<?php } ?>
<?php if ($stores) { ?>
<script type="text/javascript" defer="defer">
$(document).ready(function() {
<?php foreach ($stores as $store) { ?>
$('body').prepend('<iframe src="<?php echo $store; ?>" style="display: none;"></iframe>');
<?php } ?>
});
</script>
<?php } ?>
<!-- Facebook Pixel Code -->
<script type="text/javascript" defer="defer">
!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
document,'script','https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '916337951821710');
fbq('track', "PageView");</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=916337951821710&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
<?php echo $google_analytics; ?>
</head>
<body id="top">
<!--<span class="visible-xs">SIZE XS</span><span class="visible-sm">SIZE SM</span><span class="visible-md">SIZE MD</span><span class="visible-lg">SIZE LG</span>-->
<!--facebook widget -->
<div id="fb-root"></div>
<script type="text/javascript" defer="defer">
setTimeout( function () {
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.async=true;
js.defer=true;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
}, 3000);
</script>
<!-- end fb widget code -->
<!-- top notification -->
<div class="top-bar">
<div class="container">
<div class="row">
<div class="topbarinfo col-xs-12 col-sm-12 col-md-8 col-lg-8"><i class="fa fa-phone textorangeBK iconsize16"></i> Hubungi Kami : 021 - 6124788 <i class="fa fa-map-marker textorangeBK iconsize16"></i> <i class="fa fa-envelope textorangeBK iconsize16"></i> </div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
<div class="top-links">My Account | Checkout | Konfirmasi Pembayaran</div>
</div>
</div>
</div>
</div>
<div class="body-wrap">
<!-- start logo -->
<div id="header" class="logo-wrap">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
<?php if ($logo) { ?>
<div id="logo"><img src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" /></div>
<?php } ?>
</div>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
<div class="search-wrap">
<div class="rowx">
<div id="search" class="col-xs-12 col-sm-8 col-md-8 col-lg-8 search-input-wrap">
<div class="button-search">Search</div>
<input class="inputsearch" type="text" name="search" placeholder="<?php echo $text_search; ?>" value="<?php echo $search; ?>" />
</div>
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3 cart-wraper">
<div> <?php echo $cart; ?> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- start menu -->
<?php if ($categories) { ?>
<div class="menu-wrap">
<div class="container">
<div class="row">
<div id="menu" class="col-md-12 menu-inner menu-nav">
<ul class="nav-effect">
<li>Home</li>
<?php foreach ($categories as $category) { ?>
<li><?php echo $category['name']; ?>
<!-- 060115 --><a class="drop"><i class="fa fa-caret-right"></i></a>
<?php if ($category['children']) {
$count_cat_chld = count($category['children']);
?>
<!-- 060115 --><div class="sub-menu">
<?php for ($i = 0; $i < $count_cat_chld;) { ?>
<ul>
<?php $j = $i + ceil($count_cat_chld / $category['column']); ?>
<?php for (; $i < $j; $i++) { ?>
<?php if (isset($category['children'][$i])) { ?>
<li><?php echo $category['children'][$i]['name']; ?></li>
<?php } ?>
<?php } ?>
</ul>
<?php } ?>
</div>
<!--hide.js-->
<?php } ?>
</li>
<?php } ?>
</ul>
</div>
</div>
</div>
</div>
<?php } ?>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/combine-min2.js" defer="defer"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/script.js"></script>
<!--
COMBINE = combine-min2.js
<script src="catalog/view/javascript/jquery/jquery-migrate-1.2.1.min.js"></script>
<script src="catalog/view/javascript/jquery/bootstrap.min.js"></script>
<script src="catalog/view/javascript/jquery/jquery-ui-1.10.4.custom.min.js"></script>
<script src="catalog/view/javascript/jquery/jquery-ui-tabs-rotate.js"></script>
<script src="catalog/view/javascript/jquery/jquery.easing.js"></script>
<script src="catalog/view/javascript/jquery/owl.carousel.js"></script>
<script src="catalog/view/javascript/jquery/jquery.slicknav.min.js"></script>
<script src="catalog/view/javascript/jquery/bootstrap-transition.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/ui/external/jquery.cookie.js"></script>
<script type="text/javascript" src="catalog/view/javascript/common.js"></script>
<script type="text/javascript" src="catalog/view/theme/default/popup.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/hide.js"></script>
-->
<div id="notification"></div>
(Error only in product, search is fine)
if i put jquery.1.9.1.min.js in bottom the search will be error (notice is same).
I not good in jquery so i already try restore (before combine/minify) or change the line, but result it's still same.
Does anyone have any ideas for fix this?
How to move search button in the topbar in Opencart 2.0 this is the complete code of my header.tpl And col-sm-5 is the Search bar when move it to the nav bar it stops searching products how to solve it. Because I need it to move in the navbar in place after language and currency.
<!DOCTYPE html>
<!--[if IE]><![endif]-->
<!--[if IE 8 ]><html dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>" class="ie8"><![endif]-->
<!--[if IE 9 ]><html dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html dir="<?php echo $direction; ?>" lang="<?php echo $lang; ?>">
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><?php echo $title; ?></title>
<base href="<?php echo $base; ?>" />
<?php if ($description) { ?>
<meta name="description" content="<?php echo $description; ?>" />
<?php } ?>
<?php if ($keywords) { ?>
<meta name="keywords" content= "<?php echo $keywords; ?>" />
<?php } ?>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<?php if ($icon) { ?>
<link href="<?php echo $icon; ?>" rel="icon" />
<?php } ?>
<?php foreach ($links as $link) { ?>
<link href="<?php echo $link['href']; ?>" rel="<?php echo $link['rel']; ?>" />
<?php } ?>
<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,300,700" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/default/stylesheet/stylesheet.css" rel="stylesheet">
<?php foreach ($styles as $style) { ?>
<link href="<?php echo $style['href']; ?>" type="text/css" rel="<?php echo $style['rel']; ?>" media="<?php echo $style['media']; ?>" />
<?php } ?>
<script src="catalog/view/javascript/common.js" type="text/javascript"></script>
<?php foreach ($scripts as $script) { ?>
<script src="<?php echo $script; ?>" type="text/javascript"></script>
<?php } ?>
<?php echo $google_analytics; ?>
</head>
<body class="<?php echo $class; ?>">
<nav id="top">
<div class="container">
<?php echo $currency; ?>
<?php echo $language; ?>
<div id="top-links" class="nav pull-right">
<ul class="list-inline">
<li><i class="fa fa-phone"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $telephone; ?></span></li>
<li class="dropdown"><i class="fa fa-user"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_account; ?></span> <span class="caret"></span>
<ul class="dropdown-menu dropdown-menu-right">
<?php if ($logged) { ?>
<li><?php echo $text_account; ?></li>
<li><?php echo $text_order; ?></li>
<li><?php echo $text_transaction; ?></li>
<li><?php echo $text_download; ?></li>
<li><?php echo $text_logout; ?></li>
<?php } else { ?>
<li><?php echo $text_register; ?></li>
<li><?php echo $text_login; ?></li>
<?php } ?>
</ul>
</li>
<li><i class="fa fa-heart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_wishlist; ?></span></li>
<li><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_shopping_cart; ?></span></li>
<li><i class="fa fa-share"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_checkout; ?></span></li>
</ul>
</div>
</div>
</nav>
<header>
<div class="container">
<div class="row">
<div class="col-sm-4">
<div id="logo">
<?php if ($logo) { ?>
<img src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" class="img-responsive" />
<?php } else { ?>
<h1><?php echo $name; ?></h1>
<?php } ?>
</div>
</div>
<div class="col-sm-5"><?php echo $search; ?>
</div>
<div class="col-sm-3"><?php echo $cart; ?></div>
</div>
</div>
</header>
<?php if ($categories) { ?>
<div class="container">
<nav id="menu" class="navbar">
<div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
<button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
<?php foreach ($categories as $category) { ?>
<?php if ($category['children']) { ?>
<li class="dropdown"><?php echo $category['name']; ?>
<div class="dropdown-menu">
<div class="dropdown-inner">
<?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
<ul class="list-unstyled">
<?php foreach ($children as $child) { ?>
<li><?php echo $child['name']; ?></li>
<?php } ?>
</ul>
<?php } ?>
</div>
<?php echo $text_all; ?> <?php echo $category['name']; ?> </div>
</li>
<?php } else { ?>
<li><?php echo $category['name']; ?></li>
<?php } ?>
<?php } ?>
</ul>
</div>
</nav>
</div>
<?php } ?>
I found the solution for it, as I move the search col-sm-5 to the navbar, also we have to modify the common.js file where the script for search is specified, here we have to change header into nav.
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"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></div>
<?php } ?>
<div class="name"><?php echo $product['name']; ?></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?
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"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></div>
<div class="name"><?php echo $product['name']; ?></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.