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


Изменение Изображения При Смене Модификации


  • Авторизуйтесь для ответа в теме
В этой теме нет ответов

#1 MikDark

MikDark

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

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

Отправлено 21 Апрель 2020 - 13:37

Если Ваш товар имеет несколько цветов и Вы хотите, чтобы при выборе цвета появлялась соответствующая картинка, то выполните следующую инструкцию:

1) Зайдите в редактирование товара и у каждой модификации в ее описании укажите ссылку на картинку, которая ей соответствует

Скрытый текст

2) В шаблоне HTML после кода:

$(document).ready(function () { quantity(); });
$(document).ready(function () { counterDate(); });
// Инициализируем табы на странице
$(document).ready(function () { initTabs(); });

добавьте:

$( document ).ready(function() {
{% IF GOODS_MOD_DESCRIPTION %}
selectModImage();
{%ENDIF%}
});

3) В самый конец шаблона main.js добавляем:

function selectModImage() {
function getLinksFromDesr(string){
return string.trim().replace(/\r?\n/g, ' ').split(' ');
}
// Парсим описание текущей модификации
var imgLinksArray = getLinksFromDesr($('.goodsDataMainModificationsDescriptionBlock').text())
// При загрузке подставляем первую ссылку как главное изображение
$('.product-image a').attr('href', imgLinksArray[0]).find('img').attr('src', imgLinksArray[0])
}

4) В шаблоне main.js меняем:

// Описание модификации товара. Покажем если оно есть, спрячем если его у модификации нет
	 if(modificationDescription.length > 0) {
		 goodsModDescriptionBlock.show().html('<div>' + modificationDescription + '</div>');
	 } else {

на

// Описание модификации товара. Покажем если оно есть, спрячем если его у модификации нет
	 if(modificationDescription.length > 0) {
		 goodsModDescriptionBlock.show().html('<div>' + modificationDescription + '</div>');
		 selectModImage();
	 } else {





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

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