Здравствуйте! tv параметр image позволяет загрузить ОДНУ картинку к товару, вопрос, как через TV прикрутить несколько фото к одному товару?
<body> <div class="img"> <a href="img/1.jpg" rel="example_group" id="adpdp14"> <img src="img/1.jpg" id="dp14" style="margin-bottom: 3px;" alt="" /></a> </div> <div class="thumbs"> <div class="it"><a style="display:none;" href="img/1.jpg" rel="example_group"></a> <img src="img/1.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="it"><a style="display:none;" href="img/3.jpg" rel="example_group"></a> <img src="img/3.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="it"><a style="display:none;" href="img/4.jpg" rel="example_group"></a> <img src="img/4.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="it"><a style="display:none;" href="img/5.jpg" rel="example_group"></a> <img src="img/5.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="it"><a style="display:none;" href="img/6.jpg" rel="example_group"></a> <img src="img/6.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="it"><a style="display:none;" href="img/7.jpg" rel="example_group"></a> <img src="img/7.jpg" onclick='setBigImage(this);' alt="" /></div> <div class="clr"></div> </div> </body>
и чтобы в карточке товара эти фото привязывались
{if $object.image} {assign var=src value=$object.image} {else} {assign var=src value=$object.imageDefault} {/if} <div class="span4"> <div class="row-fluid"> <div class="span8"> <a href="{$object.image}"> <img src="{snippet name=phpthumbof params="input=`{$src}`&options=`w=200`"}" title="{field name=pagetitle}" align="left"/> </a>
Самое простое — добавить несколько TV, которые в шаблоне будут доступны не как $object.image, а как $object.tvs.img1, $object.tvs.img2 и т.д.
или можно использовать MIGX
MIGX конечно же предпочтительней по ряду причин, в том числе и потому что не приходится 100500 ТВшек создавать.
Вот я на одном проекте так докручивал галерею. В процессор получения товара дописал:
public function afterIteration(array $list){ $list = parent::afterIteration($list); foreach($list as & $l){ switch($this->getProperty('image_url_schema')){ case 'base': $images_base_url = $this->modx->runSnippet('getSourcePath'); break; case 'full': $images_base_url = $this->modx->getOption('site_url'); $images_base_url .= preg_replace("/^\//", "", $this->modx->runSnippet('getSourcePath')); break; default: $images_base_url = ''; } /* Картинки */ $l['images'] = array(); if(!empty($l['tvs']['images']['value'])){ $images = json_decode($l['tvs']['images']['value'], true); foreach($images as $image){ $image['image'] = $images_base_url.$image['image']; $l['images'][] = $image; } } } return $list; }
А в шаблоне уже оформление по своему вкусу. У меня это вот так:
{if $object.images} {foreach $object.images as $img} {snippet name="phpthumbof" params="input=`{$img.image}`&options=`w=65&h=65&q=90`" assign=thumb} <a rel="useZoom: 'zoom1', smallImage: '{$thumb}'" title="" href="{$img.image}" class="cloud-zoom-gallery"> <img alt="" src="{$thumb}"> </a> {/foreach} {/if}
а как быть с
foreach($list as & $l){ $l['image'] = ''; if(!empty($l['tvs']['image']['value'])){ $l['image'] = $images_base_url . $l['tvs']['image']['value']; } else{ $l['imageDefault'] = $images_base_url . 'products/no_photo.png'; } }
а это уже дела вкуса. тут просто проверяется, задана ли картинка, и если нет — вставляется дефолтовое изображение. но это можно и в smarty сделать.
Если вы хотите дописать это (получение галереи товара) в исходный процессор получения товаров, то вы все это объединяете в одном цикле, то есть получится так:
public function afterIteration(array $list){ $list = parent::afterIteration($list); switch($this->getProperty('image_url_schema')){ case 'base': $images_base_url = $this->modx->runSnippet('getSourcePath'); break; case 'full': $images_base_url = $this->modx->getOption('site_url'); $images_base_url .= preg_replace("/^\//", "", $this->modx->runSnippet('getSourcePath')); break; default: $images_base_url = ''; } foreach($list as & $l){ // Базовая картинка $l['image'] = ''; if(!empty($l['tvs']['image']['value'])){ $l['image'] = $images_base_url . $l['tvs']['image']['value']; } else{ $l['imageDefault'] = $images_base_url . 'products/No-Photo.jpg'; } /* Картинки */ $l['images'] = array(); if(!empty($l['tvs']['images']['value'])){ $images = json_decode($l['tvs']['images']['value'], true); foreach($images as $image){ $image['image'] = $images_base_url.$image['image']; $l['images'][] = $image; } } } return $list; }
А если вы расширяете процессор, то за это не паритесь, потому что там все равно вызывается родительский метод, так что картинка будет учтена и базовая.
public function afterIteration(array $list){ $list = parent::afterIteration($list);
В общем, здесь конечно же хорошо бы ООП понимать.
Только начала изучать. ShopModxRev Решила так. Установила пакет gallery и в товаре прямо загружаю фото в текстовый редактор, сколько хочу. Мышкой их уменьшаю до нужного мне размера и на сайте они увеличивпются.
Очень интересно. Адрес странички можно узнать?
Как выглядит код картинки, если отключить визуальный редактор?
Вы спрашиваете или хвастаетесь?
Саш, если просто вставить картинки в текстовом редакторе, они всплывать не будут. Это как минимум надо плагин DirectResize включать или типа того.
Вы спрашиваете или хвастаетесь?
Этот нюанс я не углядел :)
Я так понял, что девушка задает один размер, а на сайте картинка отображается другого размера. Я сам вообще не пользуюсь визуальными редакторами, и картинки выводить в поле контента - это по-моему не совсем удобно. :)
Есть у меня наработка, включу ее в новую сборку ShopModxBox. Там загрузка картинок прям аджаксовая. Нажал кнопку, выбрал файл, он сразу загрузился и добавился в галерею документа. Отличная штука для наполнения большого каталога.
Примерно такой же метод как описала ylarus я и использовал
http://shop-merlis.ru/catalog/platya/platya-naryadnyie/988-atlasnyij-zhakkard-izumrud.html
с MIGX я так и не смог разобраться...
Но все равно спасибо Николаю за сборку!!!
Достойный сайт получился!:)
Так в итоге как именно ваш метод работает? DirectResize используете?
P.S. Постараюсь в обозримом будущем накидать подробный мануал для создания галерей на базе Migx.
TinyMCE визуальный HTML редактор, фото закидываю в описание товара указывая размер, описание, и т.д
утомительно но продуктивно...
Незадокументированные возможности ShopModxBox :)
Дело в том, что в сборке установлен плагин DirectResize, который и дает в данном случае этот эффект. То есть перед тем, как MODX отдаст конечных HTML, срабатывает этот плагин, находит в коде картинки, для которых размеры указаны меньше, чем их реальный размер, и эти картинки заменяются на всплывашки.
Кстати, в DirectResize входит три разных JS-скрипта, и вы можете попробовать в настройках плагина изменить используемый скрипт.
http://joxi.ru/Zxz8U4wyTJDrAt9EGpo
А на нельзя задавать JS-скрипты в шаблонах? чтобы на одной страничке одни картинки через highslide обрабатывались, а другие через prettyphoto? Было бы очен удобно :)
Можно конечно поэкспериментировать на предмет того, чтобы устанавливать различные настройки через $modx->setOption(), но вряд ли сработает, так как в первую очередь учитываются настройки самого плагина, а значит без хардкода вообще никак :) Проще вручную прописать либы в шаблонах и все.
Я не хвастаюсь. Просто может кому нибудь пригодиться! Вот и все. Вот ссылка (сайт в процессе создания)http://iconist.ru/catalog/muzhskaya-odezhda/dzhinsyi/dzhinsyi-kingz-1294.html код к картинке не добавляю. Но если посмотреть исходный код страницы, к ссылки приписывается класс и oncluk, но в текст.редакторе ничего не меняется и кроме картинки ничего не добавляю. Для пользователя который раньше не наполнял сайт в текс.ред вполне удобно)). Есть недостаток, на андройде в браузере.
Я не хвастаюсь. Просто может кому нибудь пригодиться!
Я вас не пытался обидеть, просто не было понятно спрашиваете вы про что-то или уже опытом делитесь. Как я и написал ниже, это "виноват" плагин DirectResize.