Перейти к содержимому


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

Автор metry, 07 нояб. 2019 13:00
#Распродажа

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 2

#1 metry

metry

    Активный участник

  • Модераторы
  • 887 сообщений

Отправлено 07 Ноябрь 2019 - 13:00

Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

#producttabs .pdt-nav li {position: relative;display: inline-block;width: 32%;}

замените на:

#producttabs .pdt-nav li {position: relative;display: inline-block;width: 24%;}

далее зайдите в Редактор шаблонов-->HTML и найдите:

{% IFNOT index_page_favorites_goods_empty %}<li class="item-nav {% IF index_page_goods_empty=1 && index_page_new_goods_empty=1 %}tab-nav-actived{% ENDIF %}" data-href="pdt-best"><span>Хиты продаж</span></li>{% ENDIF %}

после него вставьте:

<li class="item-nav {% IF index_page_goods_empty=1 && index_page_new_goods_empty=1 $$ index_page_favorites_goods_empty  %}tab-nav-actived{% ENDIF %}" data-href="pdt-best-sale"><span>Распродажа</span></li>

далее найдите:

											href="{COMPARE_ADD_URL}?id={index_page_favorites_goods.MIN_PRICE_NOW_ID}&amp;from={index_page_favorites_goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
										  ><i class="fa fa-retweet"></i></a>
										{% ENDIF %}
									  {% ENDIF %}
									  <!-- END Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
									</li>
								  </ul>
								</div>
							</form>
						  </div>
						</div>
					  {% ENDFOR %}
					  <div class="button-load">
						<div class="loadGoods button" title="Показать все">Показать все</div>
					  </div>
					</div>
				  </div>
				{% ENDIF %}

после него вставьте:

				{% IFNOT index_page_sale_goods_empty %}
				  <div class="pdt-content {% IF index_page_goods_empty=1 && index_page_new_goods_empty=1 && index_page_favorites_goods_empty=1 %}tab-content-actived{% ENDIF %} pdt-best-sale">
					<div class="pdt-list products-grid">
					  {% FOR index_page_sale_goods %}
						<div class="item col-sm-4 col-sms-6 col-smb-12 effect-bounceIn">
						  <div class="item-inner" itemscope itemtype="https://schema.org/Product">
							<form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="product-form-{index_page_sale_goods.MIN_PRICE_NOW_ID} goodsListForm">
							  <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}" />
								<div class="item-info">
								  <div class="product-name"><a href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}" title="{index_page_sale_goods.NAME}" itemprop="url">{index_page_sale_goods.NAME}</a></div>
								  <meta itemprop="name" content="{index_page_sale_goods.NAME}">
								  <meta itemprop="description" content="{% IF index_page_sale_goods.DESCRIPTION_SHORT %}{index_page_sale_goods.DESCRIPTION_SHORT}{% ELSE %}Описание отсутствует{% ENDIF %}">
								  <div class="price-box" itemprop="offers" itemscope itemtype="https://schema.org/Offer">
									<meta itemprop="priceCurrency" content="{CURRENCY_CHAR_CODE}"/>
									{% IF index_page_sale_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_sale_goods.MIN_PRICE_NOW %}
									<p class="old-price">
									  <span class="price {CURRENCY_CHAR_CODE}">{index_page_sale_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</span>
									</p>
									{% ELSEIF index_page_sale_goods.MIN_PRICE_OLD>index_page_sale_goods.MIN_PRICE_NOW %}
									<p class="old-price">
									  <span class="price {CURRENCY_CHAR_CODE}">{index_page_sale_goods.MIN_PRICE_OLD | money_format}</span>
									</p>
									{% ENDIF %}
									<p class="special-price">
									  <span class="price {CURRENCY_CHAR_CODE}" itemprop="price">{index_page_sale_goods.MIN_PRICE_NOW | money_format}</span>
									</p>
								  </div>
								  <div class="ratings">
									<div class="rating-box">
									  {% IF index_page_sale_goods.OPINION_RATING_VALUE %}
									  <span itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating">
										<meta itemprop="worstRating" content = "1">
										<meta itemprop="bestRating" content = "10">
										<meta itemprop="ratingValue" content = "{index_page_sale_goods.OPINION_RATING_VALUE}">
										<meta itemprop="reviewCount" content = "{index_page_sale_goods.OPINION_RATING_CNT_ALL}">
										<div class="rating" style="width:{index_page_sale_goods.OPINION_RATING_VALUE}0%" alt="{index_page_sale_goods.OPINION_RATING_VALUE}" title="Рейтинг товара"></div>
									  </span>
									  {% ELSE %}
										<div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
									  {% ENDIF %}
									</div>
								  </div>
								</div>
								<div class="item-img">
								  <div class="ico-product">
									{% IF index_page_sale_goods.IS_NEW %}
									  <span class="ico-new">Новинка</span>
									{% ELSEIF index_page_sale_goods.IS_TOP %}
									  <span class="ico-best">Хит</span>
									{% ENDIF %}
									{% IF index_page_sale_goods.MAX_DISCOUNT %}
									  <span class="ico-sale">Скидка</span>
									{% ENDIF %}
								  </div>
								  <a href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}" title="{index_page_sale_goods.NAME}" class="product-image">
									<img src="{% IF index_page_sale_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=sport{% ELSE %}{index_page_sale_goods.IMAGE_MEDIUM}{% ENDIF %}" class="goods-image-small" alt="{index_page_sale_goods.NAME}" title="{index_page_sale_goods.NAME}"  itemprop="image">
								  </a>
								</div>
								<div class="actions">
								  <!--a class="add-cart quick button " title="Быстро оформить заказ" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF index_page_sale_goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}></a-->
								  <a class="add-cart button" title="В корзину" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF index_page_sale_goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}><i class="fa fa-shopping-cart"></i></a>
								  <ul class="add-to-links">
									<li class="wishlist">
									  <!-- Если есть возможность добавить товар в избранное -->
									  {% IF index_page_sale_goods.IS_HAS_IN_FAVORITES_LIST %}
										<a class="add-wishlist added btn-addto"
										  data-action-is-add="0"
										  data-action-add-url="{FAVORITES_ADD_URL}"
										  data-action-delete-url="{FAVORITES_DELETE_URL}"
										  data-action-add-title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в избранное"
										  data-action-delete-title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из избранного"
										  title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из избранного"
										  href="{FAVORITES_DELETE_URL}?id={index_page_sale_goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
										><i class="fa fa-heart"></i></a>
									  {% ELSE %}
										<a class="add-wishlist btn-addto"
										  data-action-is-add="1"
										  data-action-add-url="{FAVORITES_ADD_URL}"
										  data-action-delete-url="{FAVORITES_DELETE_URL}"
										  data-action-add-title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в избранное"
										  data-action-delete-title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из избранного"
										  title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в избранное" href="{FAVORITES_ADD_URL}?id={index_page_sale_goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
										><i class="fa fa-heart"></i></a>
									  {% ENDIF %}
									  <!-- END Если есть возможность добавить товар в избранное -->
									</li>
									<li class="compare">
									  <!-- Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
									  {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}
										{% IF index_page_sale_goods.IS_HAS_IN_COMPARE_LIST %}
										  <a class="add-compare added btn-addto"
											data-action-is-add="0"
											data-action-add-url="{COMPARE_ADD_URL}"
											data-action-delete-url="{COMPARE_DELETE_URL}"
											data-action-add-title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в список сравнения с другими товарами"
											data-action-delete-title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из списка сравнения с другими товарами"
											data-prodname="{index_page_sale_goods.NAME}"
											data-produrl="{index_page_sale_goods.URL}"
											data-id="{index_page_sale_goods.ID}"
											data-mod-id="{index_page_sale_goods.MIN_PRICE_NOW_ID}"
											title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из списка сравнения с другими товарами"
											href="{COMPARE_DELETE_URL}?id={index_page_sale_goods.MIN_PRICE_NOW_ID}&amp;from={index_page_sale_goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
										  ><i class="fa fa-retweet"></i></a>
										{% ELSE %}
										  <a class="add-compare btn-addto"
											data-action-is-add="1"
											data-action-add-url="{COMPARE_ADD_URL}"
											data-action-delete-url="{COMPARE_DELETE_URL}"
											data-action-add-title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в список сравнения с другими товарами"
											data-action-delete-title="Убрать &laquo;{index_page_sale_goods.NAME}&raquo; из списка сравнения с другими товарами"
											data-prodname="{index_page_sale_goods.NAME}"
											data-produrl="{index_page_sale_goods.URL}"
											data-id="{index_page_sale_goods.ID}"
											data-mod-id="{index_page_sale_goods.MIN_PRICE_NOW_ID}"
											title="Добавить &laquo;{index_page_sale_goods.NAME}&raquo; в список сравнения с другими товарами"
											href="{COMPARE_ADD_URL}?id={index_page_sale_goods.MIN_PRICE_NOW_ID}&amp;from={index_page_sale_goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
										  ><i class="fa fa-retweet"></i></a>
										{% ENDIF %}
									  {% ENDIF %}
									  <!-- END Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
									</li>
								  </ul>
								</div>
							</form>
						  </div>
						</div>
					  {% ENDFOR %}
					  <div class="button-load">
						<div class="loadGoods button" title="Показать все">Показать все</div>
					  </div>
					</div>
				  </div>
				{% ENDIF %}

далее зайдите в Редактор шаблонов-->main.js и найдите:


//Функция показать больше для Хитов продаж
$(function(){
  var i = 0;
  $('.pdt-best .item').each(function(){
	i++;
  })
  if(i<=6){$('.pdt-best .button-load').hide()}
  $('.pdt-best .loadGoods').on('click',function(){
	if($(this).hasClass('loaded')){
	  $(this).removeClass('loaded');
	  $('.pdt-best .item').removeClass('showThis');
	  $(this).text('Показать все');
	  $(this).attr('title', 'Показать все');
	}else{
	  $('.pdt-best .item').addClass('showThis');
	  $(this).addClass('loaded');
	  $(this).text('Скрыть');
	  $(this).attr('title', 'Скрыть');
	}
  })
});

после него вставьте:

//Функция показать больше для Распродаж
$(function(){
  var i = 0;
  $('.pdt-best-sale .item').each(function(){
	i++;
  })
  if(i<=6){$('.pdt-best-sale .button-load').hide()}
  $('.pdt-best-sale .loadGoods').on('click',function(){
	if($(this).hasClass('loaded')){
	  $(this).removeClass('loaded');
	  $('.pdt-best-sale .item').removeClass('showThis');
	  $(this).text('Показать все');
	  $(this).attr('title', 'Показать все');
	}else{
	  $('.pdt-best-sale .item').addClass('showThis');
	  $(this).addClass('loaded');
	  $(this).text('Скрыть');
	  $(this).attr('title', 'Скрыть');
	}
  })
});

#2 metry

metry

    Активный участник

  • Модераторы
  • 887 сообщений

Отправлено 07 Ноябрь 2019 - 13:26

так же можно для добавленных товаров Распродажи на главной вывести таймер, для этого зайдите в Редактор шаблонов-->HTML и найдите:

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

после него вставьте:

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

далее найдите:

								 <a href="{index_page_sale_goods.URL_MIN_PRICE_NOW | url_amp}" title="{index_page_sale_goods.NAME}" class="product-image">
								 <img src="{% IF index_page_sale_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=sport{% ELSE %}{index_page_sale_goods.IMAGE_MEDIUM}{% ENDIF %}" class="goods-image-small" alt="{index_page_sale_goods.NAME}" title="{index_page_sale_goods.NAME}" itemprop="image">
								 </a>

после него вставьте:

<!-- Счетчик обратного отсчета. 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>

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

.pdt-best-sale .counter {width: calc(100% + 30px);margin-left: -15px;padding: 10px 0 0px 0;background: #ecebf2;text-align: center;display: -ms-flexbox;display: -webkit-flex;display: flex;justify-content: center;}
.pdt-best-sale .counter div {margin-right: 10px;}
.pdt-best-sale .counter div:last-child {margin-right: 0;}
.pdt-best-sale .counter div label {display: block;font-size: 12px;text-transform: lowercase;}
.pdt-best-sale .counter div span {display: inline-block;position: relative;width: 50px;height: 30px;line-height: 30px;background: #ffffff;text-align: center;}
.pdt-best-sale .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);
  }
});
}

Сообщение отредактировал metry: 07 Ноябрь 2019 - 16:43

#3 metry

metry

    Активный участник

  • Модераторы
  • 887 сообщений

Отправлено 07 Ноябрь 2019 - 16:01

так же таймер можно вывести в карточке акционного товара. Для этого зайдите в Редактор шаблонов-->Товар и найдите:
	  <!-- Блок информации по акции действующей на товар, если таковая есть -->
	  {% IF GOODS_MOD_MAX_DISCOUNT_ID %}
		<div class="goodsDataMainDiscountBlock f-fix" content="{GOODS_MOD_MAX_DISCOUNT_EXPIRED_AT | date("Y-m-d")}">
		  <span>Товар участвует в акции <strong>&laquo;{GOODS_MOD_MAX_DISCOUNT_CAMPAIGN_NAME}&raquo;.</strong></span><br />
		  <span>До {GOODS_MOD_MAX_DISCOUNT_EXPIRED_AT | date} скидка составляет <strong>{GOODS_MOD_MAX_DISCOUNT}%</strong></span>
		</div>
	  {% ENDIF %}

после него вставьте:
				  <!-- Блок информации по акции действующей на товар, если таковая есть -->
		{% IF GOODS_MOD_MAX_DISCOUNT_ID %}
		<div class="goodsDataMainDiscountBlock">
		  <!-- Счетчик обратного отсчета. end дата окончания акции в формате Месяц:День:Год Часы:Минуты:Секунды -->
		  <div class="counter" end="{GOODS_MOD_MAX_DISCOUNT_EXPIRED_AT | date("m/d/Y H:i:s")}" now="{CURRENT_TIME | date("m/d/Y H:i:s")}">
			<div class="title">Осталось:</div>
			<div class="days">
			  <span>0</span>
			  <label>дн.</label>
			</div>
			<div class="hours">
			  <span>0</span>
			  <label>час.</label>
			</div>
			<div class="minutes">
			  <span>0</span>
			  <label>мин.</label>
			</div>
			<div class="seconds">
			  <span>0</span>
			  <label>сек.</label>
			</div>
		  </div>
		</div>
		{% ENDIF %}

далее зайдите в Редактор шаблонов-->main.css и в самый конец кода вставьте:
.product-view .goodsDataMainDiscountBlock {width: 100%;margin-bottom: 25px;display: -ms-flexbox;display: -webkit-flex;display: flex;justify-content: center;}
.product-view .goodsDataMainDiscountBlock .title {line-height: 30px;margin-right: 30px;font-weight: bold;}
.product-view .counter {width: 100%;padding: 15px 0;background: #ecebf2;text-align: center;display: -ms-flexbox;display: -webkit-flex;display: flex;justify-content: center;-ms-flex-align: center;-webkit-align-items: center;-webkit-box-align: center;align-items: center;-ms-flex-flow: row wrap;-webkit-flex-flow: row wrap;flex-flow: row wrap;}
.product-view .counter div {margin-right: 10px;}
.product-view .counter div:last-child {margin-right: 0;}
.product-view .counter div label {font-size: 12px;text-transform: lowercase;margin-left: 2px;}
.product-view .counter div span {display: inline-block;width: auto;height: 30px;line-height: 30px;background: #ffffff;text-align: center;position: relative;letter-spacing: 1px;padding: 0px 10px;}

Обратно в Акции



Темы с аналогичным тегами #Распродажа

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Спорт
  5. → Акции
  6. Privacy Policy