Изображение НОВИНОК в лайтбоксе.

[pr0fessor 0]

Подскажите пожалуйста, как сделать следующее.

На главной странице выводится НОВИНКИ. Как сделать чтоб при нажатии на Изображение товара пользователю всплывала Увеличенная картинка в лайтбоксе? (по умолчанию при нажатии на картинку перекидывает на карточку товара)

Понимаю что править нужно тут: new_products_default.html но как... затрудняюсь.

Открыл product_info_v1.html (посмотрел как тут реализован лайтбокс), попытался подставить переменные, но увы не получил желаемый результат.

Может кто делал подобное?

[support 447]

Нет, только шаблон - этого недостаточно.

Нужно ведь заводить новую метку, что б достать большую картинку, которую затем показывать в лайтбоксе.

т.е. сначала заводите в /includes/classes/product.php новую метку, в методе buildDataArray по аналогии с PRODUCTS_IMAGE

Нужно менять:

				'PRODUCTS_IMAGE' => $this->productImage($array['products_image'], $image), 
[/code]

на:
[code]
				'PRODUCTS_IMAGE' => $this->productImage($array['products_image'], $image), 
				'PRODUCTS_IMAGE_POUP' => $this->productImage($array['products_image'], 'popup'), 

А затем уже шаблон правьте, просто через a тэг указывайте ссылку на {$PRODUCTS_IMAGE_POUP}, т.е. ссылку на большую картинку, ну и используйте атрибут rel в тэге a, что б картинка открывалась с использованием javascript.

[pr0fessor 0]

Спасибо за ответ, но пока не получилось.

Все сделал как вы описали.

1. Добавил в /includes/classes/product.php строчку 

'PRODUCTS_IMAGE_POUP' => $this->productImage($array['products_image'], 'popup'), 

2. В шаблоне вместо

{if $module_data.PRODUCTS_IMAGE}<a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" title="{$module_data.PRODUCTS_NAME}" /></a></div>{/if}

вставил

{if $module_data.PRODUCTS_IMAGE}<a href="{$PRODUCTS_IMAGE_POUP}" rel="group"><img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" title="{$module_data.PRODUCTS_NAME}" /></a></div>{/if}

Значение rel поставил "group" (понимаю что это только в том случае если есть более одной фотки, но именно этот параметр стоит в файле product_info_v1.html) или есть какие-то другие варианты с rel чтобы лайтбокс подхватывал?

В итоге получается что при нажатии на картинку меня ведет в корень сайта, т.к. я тестирую на локалке то у меня получается http://localhost/ вместо картинки в лайтбоксе. Может что-то еще необходимо подправить?

[support 447]

У Вас же метки в шаблоне через module_data выводятся, значит нужно и новую метку выводить вот так:

{$module_data.PRODUCTS_IMAGE_POUP}
[/code]
Для начала просто вставьте эту метку и посмотрите выведется ли название файла картинки.

[pr0fessor 0]

У Вас же метки в шаблоне через module_data выводятся, значит нужно и новую метку выводить вот так:

{$module_data.PRODUCTS_IMAGE_POUP}
[/code]
Для начала просто вставьте эту метку и посмотрите выведется ли название файла картинки.
Ой :) Точно! В общем вставил {$module_data.PRODUCTS_IMAGE_POUP} и все ОК! Т.е. при нажатии по картинки товара выдается картинка большая. А как теперь прикрутить лайтбокс? Пробовал вставлять данные параметры тега <a> такие как в product_info_v1.html, но чего-то не получается :(
Какой должен быть параметр rel? Подскажите пожалуйста!

[mosquito 0]

его может вообще не быть

что б подключить его нужно знать как ты его обявлял

по умолчанию просто должен быть класс class="lightbox"

а rel (rel="group")  нужен если ты хочешь сделать галерею, возможность листать вперед назад по всем картинкам подключенным к лайтбоксу на странице

[pr0fessor 0]

Опа. В торопях делаю, и вот неточности.

В общем, когда я говорил что хочу картинку поместить в ЛАЙТБОКС я имел ввиду что показать картинку в всплывающем окне как на КАРТОЧКЕ ТОВАРА средствами стандартной комплектации VamShop (не обязательно через LightBox).

Я так понимаю что в движке есть скрипт "fancybox", верно? Так вот как через него вывести картинку...

Я так понимаю что мне в шаблон главной страницы нужно подгрузить этот скрипт. Посмотрел как это сделано в коде страницы product_info_v1.html

<link rel="stylesheet" type="text/css" href="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.css" media="screen" /> 
<script type="text/javascript" src="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.pack.js"></script> 
<script type="text/javascript"> 
	$(document).ready(function() {
		$("a.zoom").fancybox({
		"zoomOpacity"			: true,
		"overlayShow"			: false,
		"zoomSpeedIn"			: 500,
		"zoomSpeedOut"			: 500
	});
	});
</script>
[/code]
И вот не пойму куда эти строчки мне вписать, в  /templates/шаблон/index.html думаю не стоит. И второй вопрос как его подцепить, этот [b]fancybox[/b] каким значением rel? Видел только rel=group вот и пытался хоть как-то его включить. 
Подскажите если знаете.

[mosquito 0]

тут главное $("a.zoom") то есть  для картинки нужно просто добавить класс zoom на ссылку с увеличенным изображением + убрать в файле includes/header.php условие

<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO)) {
?>
<script type="text/javascript" src="jscript/jquery/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.css" media="screen" />
<script type="text/javascript" src="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.pack.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("a.zoom").fancybox({
		"zoomOpacity"			: true,
		"overlayShow"			: false,
		"zoomSpeedIn"			: 500,
		"zoomSpeedOut"			: 500
	});
	});
</script>
<?php
 }
?>
[/code]

заменить на
[code]
<script type="text/javascript" src="jscript/jquery/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.css" media="screen" />
<script type="text/javascript" src="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.pack.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("a.zoom").fancybox({
		"zoomOpacity"			: true,
		"overlayShow"			: false,
		"zoomSpeedIn"			: 500,
		"zoomSpeedOut"			: 500
	});
	});
</script>

про rel я уже писал как для fancy я точн не знаю но вроде так же посмотри в документации на их сайте

[pr0fessor 0]

тут главное $("a.zoom") то есть  для картинки нужно просто добавить класс zoom на ссылку с увеличенным изображением + убрать в файле includes/header.php условие

Все сделал. Заработало! Большое спасибо!

[mosquito 0]

Нет, только шаблон - этого недостаточно.

Нужно ведь заводить новую метку, что б достать большую картинку, которую затем показывать в лайтбоксе.

т.е. сначала заводите в /includes/classes/product.php новую метку, в методе buildDataArray по аналогии с PRODUCTS_IMAGE

Нужно менять:

				'PRODUCTS_IMAGE' => $this->productImage($array['products_image'], $image), 
[/code]

на:
[code]
				'PRODUCTS_IMAGE' => $this->productImage($array['products_image'], $image), 
				'PRODUCTS_IMAGE_POUP' => $this->productImage($array['products_image'], 'popup'), 

А затем уже шаблон правьте, просто через a тэг указывайте ссылку на {$PRODUCTS_IMAGE_POUP}, т.е. ссылку на большую картинку, ну и используйте атрибут rel в тэге a, что б картинка открывалась с использованием javascript.

можно и только через шаблон, просто для определения попап картинки используем {$module_data.PRODUCTS_IMAGE|replace:"thumbnail_images":"popup_images"}

[support 447]

Тоже неплохо, если уж совсем прям неохота в php лазить.

[Александр 0]

можно и только через шаблон, просто для определения попап картинки используем {$module_data.PRODUCTS_IMAGE|replace:"thumbnail_images":"popup_images"}

Может что-то не так делаю, но у меня не выходит. Подскажите где копать:

добавляю в product_info_v1.html:

{$module_data.PRODUCTS_POPUP_IMAGE|replace:"thumbnail_images":"popup_images"}

<a href="{$PRODUCTS_POPUP_IMAGE}" [/code]


или

[code]
[code]{$module_data.PRODUCTS_POPUP_IMAGE|replace:"popup_images":"thumbnail_images"}

<a href="{$PRODUCTS_POPUP_IMAGE}" 

а в исходниках html при выводе страницы ничего не меняется.

Кэш ни при чём.

Вообще вся затея в том, чтобы положить по принципу popup_images | info_images | thumbnail_images в папки с произвольными названиями (например popup_images1 | popup_images2 | popup_images3) варианты дополнительных картинок(с одинаковым названием), подключив в шаблоне к ним lightbox.

Т.к. не устраивает работа дополнительных картинок (их надо указывать для каждой позиции через админку, и не залить через  easypopulate). К тому же они не всегда во всплывающем окне.

[support 447]

Это наверное к mosquito вопрос.

Я лично так не делал как он предлагает.

[Александр 0]

а можно как-то так:

<a href="images/product_images/popup_images3/{$product_image}"...
[/code]
?
Только как определить [b]{$product_image}[/b], или переменная уже определена?
А так у mosquito удобный вариант, если бы у меня заработал.

[support 447]

Так есть же {$PRODUCTS_POPUP_IMAGE}

[Александр 0]

Я несколько другое имел ввиду.

Например, у товара загружена картинка ( я, кстати, обычно по ftp  гружу отредактированные\порезанные фотки с именами соответствующими артикулу) - 3745238324.png

Интересует именно переменная, обозначающая мою картинку 3745238324.png, и как её вызвать непосредственно в шаблоне.

чтобы написать

<a href="images/product_images/моя_папка_1/{$переменная}"...

, а получить

<a href="images/product_images/моя_папка_1/3745238324.png"...

[support 447]

В /includes/modules/product_info.php поменяйте например:

		$info->assign('PRODUCTS_IMAGE', $image);
[/code]

на:
[code]
		$info->assign('PRODUCTS_IMAGE', $image);
		$info->assign('PRODUCTS_IMAGE_FILE', $product->data['products_image']);

и используйте в карточке товара метку {$PRODUCTS_IMAGE_FILE}

Но какой смысл, если и так уже есть готовые метки, которые выводятся полный путь к картинке.

[Александр 0]

Спасибо, такой вариант работает.

Нужно для того, чтобы в десяток папок с альтернативными изображениями посбрасывать файлы с одинаковыми именами и разным содержанием. А привязка к продукту идёт по имени файла. Таким образом можно как-то рулить этими изображениями через еаsypopulate. Учитывая, что один человек выкладывает картинки, другой качает с фтп и переделывает так, как надо, а третий просто делает перенос в другой магазин - такая структура удобна.

Может мы немного не правы и есть альтернативные варианты, но со встроенной функцией доп. картинок как-то не срослось.

[support 447]

Так это ж всё равно как-то криво, руками ж всё придётся писать, я так понимаю.

Нужно же стремиться к максимальной автоматизации, особенно в скриптах, зачем тратить своё время на то, что php сам может сделать.

P.S. Это просто мыслу вслух, решать конечно Вам, если устраивает и такой вариант - почему нет.

[Александр 0]

Не, я как раз автоматизировать максимально пытаюсь.

Встроенный вариант - добавление картинки через админку. Это как раз ручная работа. Попробуйте перелопатить 500-2000 дополнительных картинок через админку - это не реально долго. И потом перенести можно будет только через SQL напрямую.

Я хочу загнать в массив переменные, соответсвующие дополнительным картинкам из папок

 $popup_images[$i]='images/product_images/popup_images_'.$i;

а потом, при наличии файла в папке выводить его через лайтбокс. Таким образом оператору, для добавления фотографии достаточно через easypopulate, посмотреть название картинки текущей позиции (а проще вообще по фтп слить папку popup_images), перекрасить всё в разные цвета и разложить по папочкам popup_images_1  -  popup_images_Х Кстати, не подскажите, добавил в product_info.php

$alternative_product_images[$img_num] = array ();
	  for ($img_num = 1;; $img_num++){
	  $alternative_product_images[$img_num]='images/product_images/popup_images_'.$img_num.'/'.$product->data['products_image'];
	  if (!file_exists($alternative_product_images[$img_num])) {break;}
	  $info->assign('PRODUCTS_IMAGE_FILE_'.$img_num, $alternative_product_images[$img_num]);}
	  
[/code]
а теперь ломаю голову как его вывести через foreach в [b]product_info_v1_html[/b] ?
Как-то через [b]$info->assign('[/b] ?
Возможно позже вас потревожу на предмет привязки этих картинок к атрибуту Цвет. Возможно, :) если сам не откажусь от затеи с привязкой атрибутов к картинкам.

[support 447]

Так для загрузки если Excel импорт/экспорт.

Код у Вас неправильный, такой код вряд ли выведешь.

Смотрите пример как например выводятся доп. поля товаров в карточке товара.

[Александр 0]

$popup_images[$i]='images/product_images/popup_images_'.$i;

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

{if $PRODUCTS_IMAGE_FILE_1!=''}<a href="{$PRODUCTS_IMAGE_FILE_1}" title="{$PRODUCTS_NAME} - вариант 2" rel="lightbox[vpopup]"></a>
{/if}
{if $PRODUCTS_IMAGE_FILE_2!=''}<a href="{$PRODUCTS_IMAGE_FILE_2}" title="{$PRODUCTS_NAME} - вариант 3" rel="lightbox[vpopup]"></a>
{/if}
{if $PRODUCTS_IMAGE_FILE_3!=''}<a href="{$PRODUCTS_IMAGE_FILE_3}" title="{$PRODUCTS_NAME} - вариант 4" rel="lightbox[vpopup]"></a>
{/if}
{if $PRODUCTS_IMAGE_FILE_4!=''}<a href="{$PRODUCTS_IMAGE_FILE_4}" title="{$PRODUCTS_NAME} - вариант 5" rel="lightbox[vpopup]"></a>
{/if}
{if $PRODUCTS_IMAGE_FILE_5!=''}<a href="{$PRODUCTS_IMAGE_FILE_5}" title="{$PRODUCTS_NAME} - вариант 6" rel="lightbox[vpopup]"></a>
{/if}[/code]
Есть ли возможность массив из [b]$PRODUCTS_IMAGE_FILE_XXX [/b] выводить перечислением сразу в шаблоне?
Так для загрузки если Excel импорт/экспорт.
разве там есть доп. картинки?

[support 447]

Можно.

Вот описание foreach - http://www.smarty.net/docsv2/ru/language.function.foreach.tpl

Есть примеры использования в шаблонах магазина.

т.е. в php коде задаётся массив через $vamTemplae->assign, а в шаблоне уже выводится через foreach.

[Александр 0]

Спасибо, буду разбираться, правда чуть позже, сейчас сделал рабочий, но не красивый(удобный), с точки зркния кода, вариант.

Как напишу - выложу, думаю народу пригодится, вещь потребная, но пока не припечёт делать не будешь :).

[support 447]

Не за что, надеюсь, что разберётесь.