Сообщений в теме: 2

[optomizkitaya]

Возможно ли установить такой плагин?
сайт

[mikola]

optomizkitaya (24 Февраль 2013 - 11:13) писал:

Возможно ли установить такой плагин?
сайт

Добрый день..
данная тема : http://forum.storela...ора/#entry32048
копия сообщения
Здравствуйте. Рассмотрим установку плагина который описан здесь http://www.xiper.net...cloud-zoom.html
Первое что нужно это скачать архив с css и js кодом себе на компьютер и распаковать в любую папку.
Затем переходим Сайт-> Редактор тем.
Загружаем на сайт файлы.

Нажимаем кнопку "Добавить файлы"
Нам нужно два файла "cloud-zoom.1.0.2.js" и "cloud-zoom.css"

Жмем сохранить.
Теперь нужно подключить эти файлы к сайту. Делается это в файле HTML.
Откроем его для редактирования и вставим код перед </head>.

<!-- Подключение Js плагина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}cloud-zoom.1.0.2.js"></script>
<!-- Подключение css файла плагина -->
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}cloud-zoom.css" type="text/css" />

Плагин подключен и доступен для остальных файлов.
Теперь его нужно подключить для определенного изображения на сайте. В нашем случаее это страниц "Товара".
(Внимание. Ваш код может отличаться если у вас шаблон не "Сияние")
Открываем файл "Товар".
Найти код:
<a href="{GOODS_IMAGE_LARGE}" target="_blank" title="Увеличить {GOODS_NAME}"><img class="cornerAll withBorder goods-image-medium" src="{GOODS_IMAGE_MEDIUM}" alt="{GOODS_NAME}" /></a>
Заменить на:

<a href="{GOODS_IMAGE_LARGE}" class="cloud-zoom" id='zoom1' target="_blank" title="Увеличить {GOODS_NAME}" rel="position: 'right', adjustX: 8, adjustY: 0, zoomWidth:250px">
<img class="cornerAll withBorder goods-image-medium " src="{GOODS_IMAGE_MEDIUM}" alt="{GOODS_NAME}"/>
</a>

Теперь для первого изображения все будет грузится нормально но если выбрать остальные изображения то появится в увеличение все равно первое. Чтобы это исправить нужно сделать следующее.
Найти код:

<a href="{goods_images.LARGE}" rel="gallery" target="_blank" title="{goods_images.NAME}"><img class="cornerAll withBorder goods-image-icon" rel="{goods_images.MEDIUM}" src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a>

Заменить на:

<a href="{goods_images.LARGE}" rel="useZoom: 'zoom1'" class="cloud-zoom-gallery" target="_blank" title="{goods_images.NAME}"><img class="cornerAll withBorder goods-image-icon" rel="{goods_images.MEDIUM}" src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a>

На этом изменения закончены. Не забудьте сохранить файл перед просмотром результата.
И делать бекапы шаблонов.

Примечание.
1. Ширина и высота указываются без 'px'. Пример: zoomWidth:250

[optomizkitaya]

спасибо!