Изображения товара в Opencart

категория: , Поля в админке

✎ Опубликовано: 30.05.2015 ☕ Просмотров: 6873 ✉ Комментарии: 1

Изображения товара в Opencart

Изображения это дополнительные картинки на странице товара. Количество изображений не ограничено

Изображения это дополнительные картинки на странице товара. Количество изображений не ограничено, однако рекомендуется добавлять в разумных пределах на стандартном шаблоне, т.к. при большом количестве будут сдвинуты вниз вкладки с описанием, характеристиками, рекомендованными товарами и отзывами.

Если у товара много фотографий, я рекомендую воспользоваться каруселью, что бы для просмотра доступны были, например 3 изображения, а остальные прокручивались стрелками, таким образом, мы и все фото выложим и не испоганим шаблон

Как оказалось на практике, настройка и генерация всплывающих больших изображений определенного размера совершенно неудобно т.к. во многих магазинах есть как большие изображения товара, так и маленькие. При задании размера большого фото товара, например 800х600, изображения размером 800х400 будут иметь белые полоски, а картинки малых размеров — увеличены и зернистые, что неправильно и некрасиво.

Если сайт имеет в своем наборе разного размера и ориентации изображения, я рекомендую сделать всплывающие оригинальные фото. Для этого открываем файл catalog/controller/product.php ищем строку

$this->data['popup'] = $this->model_tool_image->resize($product_info['image'], $this->config->get('config_image_popup_width'), $this->config->get('config_image_popup_height'));

Заменяем её на

$this->data['popup'] = "/image/".$product_info['image'];

По аналогии убираем статический размер в дополнительных изображениях. Для этого строку

'popup' => $this->model_tool_image->resize($result['image'], $this->config->get('config_image_popup_width'), $this->config->get('config_image_popup_height')),

Заменяем на

'popup' => "/image/".$result['image'],

После этих изменений при нажатии на изображение товара у нас в сплывающем окне будет отображено оригинальное фото в оригинальных пропорциях. Данный метод хорош, если использовать fancybox или стандартный colorbox т.к. он автоматически изменяет размеры окна для изображения, и вписывается пропорционально в размеры браузера, если картинка слишком большая. На стандартном colorbox недостаток метода в том, что если изображение больше за размер окна браузера оно выходит за его рамки и появляются полоски прокрутки. Так что лучше использовать fancybox.

Комментарии:

Фото комментатора

Виктор 30.05.2015

скажите, у меня фото открывается не в сплывающем колорбоксе а на отдельной странице в уголку… это не хорошо, как исправить?
Администратор

Ответ for-opencart.com 30.05.2015

Судя по всему не работает colorbox либо неправильно подключен. Посмотрите исходный код на странице товара, он должен содержать в себе такие строки:

<script type="text/javascript" src="catalog/view/javascript/jquery/colorbox/jquery.colorbox-min.js"></script>

и:

<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/colorbox/colorbox.css" media="screen" />

Также на странице должен быть вызов colorbox:

	<script type="text/javascript"><!--
	  $(document).ready(function() {
	   $('.colorbox').colorbox({
	    overlayClose: true,
	    opacity: 0.5,
	    rel: "colorbox"
	   });
	  });
	//--></script> 

Если одного из этих кодов нет, надо уже разбираться смотреть шаблон и подключение скриптов.

Быстрый поиск

Похожее

Новое на сайте