Открываем консоль сайта.
Заходим в раздел Товаров.
Находим нужную сборку.
жмем на кнопку “Изменить”
Заходим в раздел Товаров.
Находим нужную сборку.
жмем на кнопку “Изменить”

Перед каждой строкой вставляем текст:
<div class="sbor1-1"></div>
После названия конфеты вставляем другой текст
<div class="imgsb-1-1"></div> </div>
Повторяем с каждой конфетой меняя цифры 1-1 на соответствующий сбор и конфету.
Т.е. Если работаем со сбором № 6, и конфетой 4 по порядку, то строка должна быть такой:
<div class="sbor6-4"> Шоколадный батончик «Mars» mini (Mars) — 1 шт. <div class="imgsb-6-4"></div> </div>

ставим курсор между
<div class="imgsb-6-4">
и
</div>
и нажимаем кнопку “Добавить мультимедиа” (в верхней части экрана, левее)
добавится код к картинке конфеты.
Повторяем до конца со всеми конфетами.
Сохранив и просмотрев страницу у тебя должно получиться что такое.
только с картинками под каждой строкой.
только с картинками под каждой строкой.

Теперь делаем так что бы картинки пропали и появлялись только при наведении на текст
на странице с товаром, там где строки чередуются с картинками. В самом верху экрана последняя кнопка “Edit With Yellow Pencil” где в выпадающем меню ты выбираешь “Edit this product”, ждешь загрузку и видишь новые окна и панели с кнопками по бокам. Вместо курсора у тебя крестик. Им ты тыкаешь на первую строку с конфетой и потом по кнопке
на странице с товаром, там где строки чередуются с картинками. В самом верху экрана последняя кнопка “Edit With Yellow Pencil” где в выпадающем меню ты выбираешь “Edit this product”, ждешь загрузку и видишь новые окна и панели с кнопками по бокам. Вместо курсора у тебя крестик. Им ты тыкаешь на первую строку с конфетой и потом по кнопке
</>
третья слева вверху.



Открывается панель для ввода характеристик объектов на странице.
Прямо там с новой строки и вводим следующий текст
Прямо там с новой строки и вводим следующий текст
.sbor10-1{ position:relative; } .imgsb-10-1{ display:none; box-shadow:0 5px 5px rgba(0,0,0,0.3); -webkit-box-shadow:0 5px 5px rgba(0,0,0,0.3); -moz-box-shadow:0 5px 5px rgba(0,0,0,0.3); margin-left:10%; } .sbor10-1:hover .imgsb-10-1{ display:block; width:350px; height:400px; position:absolute; z-index:1000; }
где “.sbor-10-1” – это номер сбора с который ты работаешь и номер конфеты по порядку.

Далее ты должна повторить код столько сколько у тебя конфет, каждый раз меняя цифры номера конфеты.
когда закончишь нажмешь зеленую кнопку “Save” на правом меню.
когда закончишь нажмешь зеленую кнопку “Save” на правом меню.
