Добавление Блока Распродажа На Главной

Для того, чтобы отобразить блок "Распродажа", зайдите в раздел Сайт---Редактор шаблонов---HTML и найдите код:

		{%ENDIF%}<!-- END IFNOT index_page_goods_empty-->
	<div class="mainPageGoods">

		
			{% IFNOT index_page_favorites_goods_empty %}	  
			 <div class="iphwrp"><h2 class="indexPageHeader"><span>Хиты продаж</span></h2></div>
			   <div class="customNavigation">
			  <a class="btn prev3"><span class="icon-arrow-left"></span></a>
			  <a class="btn next3"><span class="icon-arrow-right"></span></a>
			</div>
			<div id="owl-demo3" class="owl-carousel owl-theme">   
				{% FOR index_page_favorites_goods %}				 
				 <div class="item">
					<div class="mainnewitem proditem">
					   <div class="textc image goods-cat-image-medium-square mainpage"><a title="{index_page_favorites_goods.NAME}" href="{index_page_favorites_goods.URL_MIN_PRICE_NOW | url_amp}"><img class="goods-cat-image-medium" src="{% IF index_page_favorites_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=caramel{% ELSE %}{index_page_favorites_goods.IMAGE_MEDIUM}{% ENDIF %}" alt=""></a></div>
					   <div class="leftinfo">
						 <div class="nameWrp"><div class="name"><a class="hover-f" title="{index_page_favorites_goods.NAME}" href="{index_page_favorites_goods.URL_MIN_PRICE_NOW | url_amp}" style="*height:;">{index_page_favorites_goods.NAME}</a></div></div>
						 <div class="clear"></div>
						 <div class="price">
							  <div class="price-new">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</div>
							  {% IF index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_favorites_goods.MIN_PRICE_NOW %}
								<div class="price-old" style="display:none;">{index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</div>
							  {% ELSEIF index_page_favorites_goods.MIN_PRICE_OLD>index_page_favorites_goods.MIN_PRICE_NOW %}
								<div class="price-old" style="display:none;">{index_page_favorites_goods.MIN_PRICE_OLD | money_format}</div>
							  {% ENDIF %}							
						 </div>   
					   </div>
							 <div class="addcartbutton"> 
								<form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{index_page_favorites_goods.MIN_PRICE_NOW_ID}">
								  <input type="hidden" name="hash" value="{HASH}" />
								  <input type="hidden" name="form[goods_from]" value="{index_page_favorites_goods.GOODS_FROM}" />
								  <input type="hidden" name="form[goods_mod_id]" value="{index_page_favorites_goods.MIN_PRICE_NOW_ID}" />							   
								  <a class="addToCart {% IF index_page_favorites_goods.MIN_REST_VALUE <= 0 %}noavalible{% ENDIF %}" {%IF index_page_favorites_goods.MIN_REST_VALUE > 0%}onclick="quickorder('.product-form-{index_page_favorites_goods.MIN_PRICE_NOW_ID}');return false;"{%ENDIF%} {%IF index_page_favorites_goods.MIN_REST_VALUE > 0%} title="Быстро оформить заказ"{%ELSE%}title="Товара нет в наличии"{%ENDIF%}><span class="icon-cart3"></span></span></a>
								</form>
							  </div><!--END addcartbutton-->
							</div><!--END Proditem-->			   
						  </div><!--END Item-->
				 {%ENDFOR%}<!--ENDFOR index_page_favorites_goods-->				
			  </div><!--END carousel-->			
			{%ENDIF%}<!-- END IFNOT index_page_favorites_goods_empty-->   
	</div>
		 {%ENDIF%}

И сразу после добавьте данный код:

		<div class="mainPageGoods">		
			{% IFNOT index_page_sale_goods_empty %}	  
			 <div class="iphwrp"><h2 class="indexPageHeader"><span>Распродажа</span></h2></div>
			<div class="customNavigation">
			  <a class="btn prev"><span class="icon-arrow-left"></span></a>
			  <a class="btn next"><span class="icon-arrow-right"></span></a>
			</div>
			<div id="owl-demo6" class="owl-carousel owl-theme">   
				{% FOR index_page_sale_goods %}				 
				 <div class="item">
					<div class="mainnewitem proditem">
					  <div class="textc image goods-cat-image-medium-square mainpage"><a title="{index_page_sale_goods.NAME}" href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}"><img class="goods-cat-image-medium" src="{% IF index_page_sale_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=caramel{% ELSE %}{index_page_sale_goods.IMAGE_MEDIUM}{% ENDIF %}" alt=""></a></div>
					  <div class="leftinfo">
						<div class="nameWrp"><div class="name"><a class="hover-f" title="{index_page_sale_goods.NAME}" href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}" style="*height:;">{index_page_sale_goods.NAME}</a></div></div>					 
						<div class="clear"></div>
						<div class="price">
						 {% IF index_page_sale_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_sale_goods.MIN_PRICE_NOW %}
								<div class="price-old">{index_page_sale_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</div>
							  {% ELSEIF index_page_sale_goods.MIN_PRICE_OLD>index_page_sale_goods.MIN_PRICE_NOW %}
								<div class="price-old">{index_page_sale_goods.MIN_PRICE_OLD | money_format}</div>
						 {% ENDIF %}  
							  <div class="price-new">{index_page_sale_goods.MIN_PRICE_NOW | money_format}</div>													   
						 </div>  
					   </div>
						<div class="addcartbutton"> 
							  <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListItemCatalogueAddToCartButton product-form-{index_page_sale_goods.MIN_PRICE_NOW_ID}">
								<input type="hidden" name="hash" value="{HASH}" />
								<input type="hidden" name="form[goods_from]" value="{index_page_sale_goods.GOODS_FROM}" />
								<input type="hidden" name="form[goods_mod_id]" value="{index_page_sale_goods.MIN_PRICE_NOW_ID}" />
								<a class="addToCart {%IF index_page_sale_goods.MIN_REST_VALUE <= 0%}noavalible{%ENDIF%}" {%IF index_page_sale_goods.MIN_REST_VALUE > 0%}onclick="quickorder('.product-form-{index_page_sale_goods.MIN_PRICE_NOW_ID}');return false;" {%ENDIF%} {%IF index_page_sale_goods.MIN_REST_VALUE > 0%} title="Быстро оформить заказ"{%ELSE%}title="Товара нет в наличии"{%ENDIF%}><span class="icon-cart3"></span></a>
							  </form>
					  </div><!--END addcartbutton-->
					</div><!--END Proditem-->			   
				  </div><!--END Item-->
				 {%ENDFOR%}<!--ENDFOR index_page_sale_goods-->				
			  </div><!--END carousel-->			
			{%ENDIF%}<!-- END IFNOT index_page_sale_goods_empty-->
	  
	</div>	 

Найдите данный код в main.js:

/*END карусель новинок*/

И сразу после добавьте данный код:

/*Карусель Распродажа*/
$(document).ready(function() {
 var scrolls = getClientSize();
  var owl = $("#owl-demo6");

  owl.owlCarousel({
	  items : 4, //10 items above 1000px browser width
	  itemsDesktop : [1200,3], //4 items between 1650px and 901px
	  itemsDesktopSmall : [905,2], // betweem 1250px and 601px
	  itemsTablet: [580,1], //1 items between 600 and 0
	  itemsMobile : false // itemsMobile disabled - inherit from itemsTablet option
  });

  // Custom Navigation Events
  $(document).ready(function(){
	owl.trigger('owl.play',5000);
  });
  $(".next").click(function(){
	 owl.trigger('owl.next');  
  })
  $(".prev").click(function(){
	owl.trigger('owl.prev');
  })
  $(".owl-item").hover(function(){
	owl.trigger('owl.stop');},function(){owl.trigger('owl.play',5000);
	})
});
/*END карусель Распродажа*/ 

Добавление Таймера в блок "Распродажа":
Зайдите в Редактор шаблонов --- main.css и добавьте в самый конец шаблона код:

#owl-demo6 .counter {width: calc(100% + 30px);margin-left: -15px;margin-bottom: 10px;padding: 10px 0 0px 0;background: #dfefbf;text-align: center;display: -ms-flexbox;display: -webkit-flex;display: flex;justify-content: center;}
#owl-demo6 .counter div {margin-right: 10px;}
#owl-demo6 .counter div:last-child {margin-right: 0;}
#owl-demo6 .counter div label {display: block;font-size: 12px;text-transform: lowercase;}
#owl-demo6 .counter div span {display: inline-block;position: relative;width: 50px;height: 30px;line-height: 30px;background: #ffffff;text-align: center;}
#owl-demo6 .products-grid .item {position: relative;float: left;text-align: left;margin-bottom: 30px;height: 440px;}

Зайдите в Редактор шаблонов --- main.js и добавьте в самый конец шаблона код:

// Отсчет даты до окончания акции
function counterDate() {
// Устанавливаем дату обратного отсчета ММ-ДД-ГГ
$('.counter').each(function(i, el){
  var end = $(el).attr('end');
  var countDownDate = new Date(end).getTime();
  // Обновление счетчика каждую секунду
  var x = setInterval(function() {
		var now = new Date().getTime();
		var distance = countDownDate - now;
		var days = Math.floor(distance / (1000 * 60 * 60 * 24));
		var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
		var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
		var seconds = Math.floor((distance % (1000 * 60)) / 1000);
		// Вывод
		$(el).find('.days span').text(days);
		$(el).find('.hours span').text(hours);
		$(el).find('.minutes span').text(minutes);
		$(el).find('.seconds span').text(seconds);
		// Счетчик завершен
		if (distance < 0) {
		  clearInterval(x);
		  $(el).find('span').text("0");
		}
  }, 1000);
})
}

// Отсчет даты до окончания акции
function openMod() {
$('.product-view .qty-wrap .label.mod').on('click', function(){
  if($('.product-view .goodsDataMainModificationsBlock').hasClass('active')){
		$(this).removeClass('active');
		$('.product-view .goodsDataMainModificationsBlock').removeClass('active');
		$('.product-view .goodsDataMainModificationsBlock').slideUp(600);
  }else{
		$(this).addClass('active');
		$('.product-view .goodsDataMainModificationsBlock').addClass('active');
		$('.product-view .goodsDataMainModificationsBlock').slideDown(600);
  }
});
}

Зайдите в HTML и найдите код:

					<div class="mainnewitem proditem">
					  <div class="textc image goods-cat-image-medium-square mainpage"><a title="{index_page_sale_goods.NAME}" href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}"><img class="goods-cat-image-medium" src="{% IF index_page_sale_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=caramel{% ELSE %}{index_page_sale_goods.IMAGE_MEDIUM}{% ENDIF %}" alt=""></a></div>

И сразу после добавьте данный код:

<!-- Счетчик обратного отсчета. end дата окончания акции в формате Месяц:День:Год Часы:Минуты:Секунды -->
																 <div class="counter" end="{index_page_sale_goods.MAX_DISCOUNT_EXPIRED_AT | date("m/d/Y H:i:s")}" now="{CURRENT_TIME | date("m/d/Y H:i:s")}">
																 <div class="days">
																		 <span>00</span>
																		 <label>дн.</label>
																 </div>
																 <div class="hours">
																		 <span>00</span>
																		 <label>час.</label>
																 </div>
																 <div class="minutes">
																		 <span>00</span>
																		 <label>мин.</label>
																 </div>
																 </div>

Найдите данный код:

	<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=caramel"></script>

И после вставьте данный код:

	<!--Обратный отсчет акции -->
	<script type="text/javascript">
	$(document).ready(function () { counterDate(); });
	</script>