<!--on sale area srart-->
<div class="on-sale-area">
<div class="shop-shadow2">
<div class="col-lg-12">
<div class="catagory-title mb-20">
<h3>
On Sale
</h3>
</div>
</div>
<div class="total-onsale-product carsoule-btn cb-3 cb-3-small">
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/01-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/02-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Wuisque Ringilla</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $196 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/04-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/05-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Kewrmaquer Balkeri</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $165 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/06-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/07-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Melkderfse Nalkeri</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$295</del> </div>
<div class="new-price"> $134 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/08-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/09-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Wuisque Ringilla</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $196 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/10-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/11-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Kewrmaquer Balkeri</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $165 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/12-350x437.jpg"
class="primary-image"> <img alt="" src="images/product/shop/13-350x437.jpg"
class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Melkderfse Nalkeri</a>
</div>
<div class="prodcut-price">
<div class="old-price"> <del>$295</del> </div>
<div class="new-price"> $134 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a>
<a href="#"><i class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star"></i></a> <a href="#"><i
class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
</div>
</div>
</div>
<!--on sale area end-->
$('.total-onsale-product').slick({
slidesToShow: 4,
slidesToScroll: 1,
autoplay: false,
autoplaySpeed: 5000,
dots: false,
arrows: true,
prevArrow: '',
nextArrow: '',
responsive: [
{ breakpoint: 1169, settings: { slidesToShow: 4, } },
{ breakpoint: 969, settings: { slidesToShow: 3, } },
{ breakpoint: 767, settings: { slidesToShow: 2, } },
{ breakpoint: 479, settings: { slidesToShow: 1, } },
]
});
<!--on sale area srart-->
<div class="on-sale-area mb-30">
<div class="shop-shadow2">
<div class="col-lg-12">
<div class="catagory-title mb-20">
<h3>
On Sale
</h3>
</div>
</div>
<div class="clearfix"></div>
<div class="total-onsale-product carsoule-btn cb-3 cb-3-small">
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/01-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/02-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Wuisque Ringilla</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $196 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/04-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/05-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Kewrmaquer Balkeri</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $165 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/06-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/07-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Melkderfse Nalkeri</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$295</del> </div>
<div class="new-price"> $134 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/08-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/09-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Wuisque Ringilla</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $196 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/10-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/11-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Kewrmaquer Balkeri</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$250</del> </div>
<div class="new-price"> $165 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
<div class="col-12">
<!-- single product start-->
<div class="single-product single-product-2">
<div class="product-label">
<div class="new">Sale</div>
</div>
<div class="product-img">
<div class="single-product-img">
<a href="#"> <img alt="" src="images/product/shop/12-350x437.jpg" class="primary-image"> <img alt="" src="images/product/shop/13-350x437.jpg" class="secondary-image"> </a>
</div>
</div>
<div class="product-text">
<div class="prodcut-name"> <a href="#">Melkderfse Nalkeri</a> </div>
<div class="prodcut-price">
<div class="old-price"> <del>$295</del> </div>
<div class="new-price"> $134 </div>
</div>
<div class="prodcut-ratting-price">
<div class="prodcut-ratting"> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star"></i></a> <a href="#"><i class="fa fa-star-o"></i></a> </div>
</div>
</div>
</div>
<!-- single product end-->
</div>
</div>
</div>
</div>
<!--on sale area end-->
$('.total-onsale-product-2').slick({
slidesToShow: 4,
slidesToScroll: 1,
autoplay: false,
autoplaySpeed: 5000,
dots: true,
arrows: false,
responsive: [
{ breakpoint: 1169, settings: { slidesToShow: 4, } },
{ breakpoint: 969, settings: { slidesToShow: 3, } },
{ breakpoint: 767, settings: { slidesToShow: 2, } },
{ breakpoint: 479, settings: { slidesToShow: 1, } },
]
});
Business | Multipurpose Business Agency HTML Template
Bachas Responsive WordPress Theme for your online store here, purchase now goo.gl/wl9zDA pic.twitter.com/kS7BSkiOUS