Как правильно настроить превью в Minishop2?
Здравствуйте. Подскажите пожалуйста, уже запутался, не могу разобраться как настроить эти превью для вывода на сайте.
Сайт на minishop2 версия 2.4.14. Нужно выводить изображения разного размера на разных страницах:
Карточка товаров
Страница каталога
Рекомендуемые товары
и т.д.
Сейчас все настройки магазина по умолчанию:
Источник файлов skrinshoter.ru/s/161018/VIsCu9iI не понимаю что там прописывать нужно и как потом вызывать данные размеры превью.
Код галереи, что здесь нужно прописать, если нужно?
Сайт на minishop2 версия 2.4.14. Нужно выводить изображения разного размера на разных страницах:
Карточка товаров
Страница каталога
Рекомендуемые товары
и т.д.
Сейчас все настройки магазина по умолчанию:
Источник файлов skrinshoter.ru/s/161018/VIsCu9iI не понимаю что там прописывать нужно и как потом вызывать данные размеры превью.
Код галереи, что здесь нужно прописать, если нужно?
<div id="msGallery">
{if $files?}
<div class="fotorama"
data-nav="thumbs"
data-thumbwidth="60"
data-allowfullscreen="true"
data-swipe="true"
data-autoplay="5000">
{foreach $files as $file}
<a href="{$file['url']}" target="_blank">
<img src="{$file['small']}" alt="" title="">
</a>
{/foreach}
</div>
{else}
<img src="{('assets_url' | option) ~ 'components/minishop2/img/web/ms2_medium.png'}"
srcset="{('assets_url' | option) ~ 'components/minishop2/img/web/ms2_medium@2x.png'} 2x"
alt="" title=""/>
{/if}
</div>
Вот часть кода из чанка msProduct. Что здесь нужно прописать, чтобы картинки были нужного размера, к примеру 255х264px{if $thumb?}
<img class="111" src="{$thumb}" alt="{$pagetitle}" title="{$pagetitle}"/>
{else}
<img src="{'assets_url' | option}components/minishop2/img/web/ms2_small.png"
srcset="{'assets_url' | option}components/minishop2/img/web/ms2_small@2x.png 2x"
alt="{$pagetitle}" title="{$pagetitle}"/>
{/if}
Буду очень признателен за помощь. Вообще не могу разобраться в этих тумбах и превью. Комментарии: 11
В источнике файлов пишете:
И у вас будет плейсхолдеры small и thumb этого размера. Если же надо дополнительные размеры, то задаётся так:
И будет доступен новый плейсхолдер medium, в чанке галереи соответственно так:
Если нужно подключить превью для вывода в msProducts, это делается так:
Почитать про параметры phpthumb для генерации превью(zc:0 и прочее) можно здесь.
{"small":{"w":255,"h":264,"q":90,"zc":"0"}}
И у вас будет плейсхолдеры small и thumb этого размера. Если же надо дополнительные размеры, то задаётся так:
{"small":{"w":255,"h":264,"q":90,"zc":"0"},"medium":{"w":500,"h":500,"q":90,"zc":"0"}}
И будет доступен новый плейсхолдер medium, в чанке галереи соответственно так:
{foreach $files as $file}
<a href="{$file['url']}" target="_blank">
<img src="{$file['medium']}" alt="" title="">
</a>
{/foreach}
Если нужно подключить превью для вывода в msProducts, это делается так:
[[!msProducts?
&parents=`0`
&includeThumbs=`small,medium`
]]
Почитать про параметры phpthumb для генерации превью(zc:0 и прочее) можно здесь.
Спасибо огромное. А как вот здесь
<img class="111" src="{$thumb}" alt="{$pagetitle}" title="{$pagetitle}"/>
вызвать нужный размер?
Так после того как вы подключите нужный размер в вызове:
Либо можете в источнике файлов задать нужный размер в small, и у вас в thumb будет сразу нужный.
[[!msProducts?
&parents=`0`
&includeThumbs=`medium`
]]
то у вас они будут доступны внутри чанка:<img class="111" src="{$medium}" alt="{$pagetitle}" title="{$pagetitle}"/>
Либо можете в источнике файлов задать нужный размер в small, и у вас в thumb будет сразу нужный.
Ну да, я так и сделал. Получилось только через параметр small, а если нужно свой размер? К примеру medium или big по сути название то не важно, как вызвать в таком случае?
<img class="111" src="{$medium}" alt="{$pagetitle}" title="{$pagetitle}"/>
вот так делал, не работало, в msProducts подключал, можете показать более полную конструкцию если если еще где-то нужно прописать.
Проверил сейчас на тестовом сайте, всё должно работать, вызов:
Чанк:
В источнике файлов для примера:
Также когда прописали новый размер, нужно заново сгенерировать превью, т.к. сами собой они не появятся, это можно сделать в галерее выделив фотографии и правой кнопкой — Обновить превью. Либо через скрипт — Перегенерировать все превью товаров miniShop2, запускается через компонент Console.
[[!msProducts? &includeThumbs=`medium`]]
Чанк:
{if $medium?}
<img src="{$medium}" alt="{$pagetitle}" title="{$pagetitle}"/>
{else}
<img src="{'assets_url' | option}components/minishop2/img/web/ms2_small.png"
srcset="{'assets_url' | option}components/minishop2/img/web/ms2_small@2x.png 2x"
alt="{$pagetitle}" title="{$pagetitle}"/>
{/if}
В источнике файлов для примера:
{"small":{"w":120,"h":90,"q":90,"zc":"1","bg":"000000"},"medium":{"w":200,"h":200,"q":90,"zc":"1","bg":"000000"}}
Также когда прописали новый размер, нужно заново сгенерировать превью, т.к. сами собой они не появятся, это можно сделать в галерее выделив фотографии и правой кнопкой — Обновить превью. Либо через скрипт — Перегенерировать все превью товаров miniShop2, запускается через компонент Console.
Извиняюсь дико у меня вот такая проблема, выводит миниатюру и картинку вместе как это решить?
чанк
Просто да же загружаешь 3 картинки всё равно одна добавляется ((
чанк
<div id="msGallery">
{if $files?}
<div class="fotorama"
data-nav="thumbs"
data-thumbheight="60"
data-thumbwidth="60"
data-swipe="true"
data-stopautoplayontouch="false"
data-allowfullscreen="native"
data-ratio="9/10"
>
{foreach $files as $file}
<a href="{$file['url']}" alt="[[+pagetitle]]" title="[[+pagetitle]]">
<img src="{$file['thumb']}" alt="[[+pagetitle]]" title="[[+pagetitle]]">
</a>
{/foreach}
</div>
{else}
<img src="{('assets_url' | option) ~ 'components/minishop2/img/web/nophoto_medium.jpg'}"
srcset="{('assets_url' | option) ~ 'components/minishop2/img/web/nophoto_medium2x.jpg'} 2x"
alt="" title=""/>
{/if}
</div>
вывожу вот так[[!msGallery? &tpl=`tpl.msGallery-elki`]]
Мне просто нужно это устранить, когда одно изображение показывает 2 миниатюры, не могу понять как решить эту задачу ((Просто да же загружаешь 3 картинки всё равно одна добавляется ((
Источник файлов skrinshoter.ru/s/161018/VIsCu9iI не понимаю что там прописывать нужно и как потом вызывать данные размеры превью.А что там понимать?
w = width (ширина)
h = height (высота)
q = quality (качество)
zc = zoom crop (центровая обрезка)
Здравствуйте!
А если вывод товаров идет через mFilter2, там же нет параметра &includeThumbs, как изменить размер? Спасибо.
А если вывод товаров идет через mFilter2, там же нет параметра &includeThumbs, как изменить размер? Спасибо.
mFilter2 это обёртка. По умолчанию он вызывает mSearch2. А если указать,
&element=`msProducts`
то станут доступны все фичи msProducts. Как бы документация есть и очень хорошая.
Спасибо, но всё равно не получается. Что то видимо не так делаю. Может увидите что не так.
Вызов mFilter2
Вызов mFilter2
[[!mFilter2?
&element=`msProducts`
&filters=`msoption|profit:number, msoption|price_for_buy:number, msoption|activity:activity, msoption|city:city, msoption|business_age:number, msoption|form_company:form_company, msoption|rent:boolean, msoption|rent_and_bay:boolean, msoption|work_now:boolean`
&tplFilter.outer.msoption|city=`tpl.mFilter2.filter.select`
&tplFilter.row.msoption|city=`tpl.mFilter2.filter.option`
&suggestionsRadio=`msoption|city`
&tplFilter.outer.msoption|activity=`tpl.mFilter2.filter.select`
&tplFilter.row.msoption|activity=`tpl.mFilter2.filter.option`
&suggestionsRadio=`msoption|activity`
&tplFilter.outer.msoption|business_age=`tpl.mFilter2.filter.slider`
&tplFilter.row.msoption|business_age=`tpl.mFilter2.filter.number`
&tplFilter.outer.msoption|form_company=`tpl.mFilter2.filter.select`
&tplFilter.row.msoption|form_company=`tpl.mFilter2.filter.option`
&suggestionsRadio=`msoption|form_company`
&tplFilter.outer.msoption|profit=`tpl.mFilter2.filter.slider`
&tplFilter.row.msoption|profit=`tpl.mFilter2.filter.number`
&tplFilter.outer.msoption|price_for_buy=`tpl.mFilter2.filter.slider`
&tplFilter.row.msoption|price_for_buy=`tpl.mFilter2.filter.number`
&class=`msProduct`
&tpl= `item-business`
&tplOuter= `mFilterOuter`
&aliases=`ms|price==price, resource|parent==parent`
&includeThumbs=`medium`
]]
Запись в настройка медиа thumbnails:{"small":{"w":120,"h":90,"q":90,"zc":"1","bg":"000000"}, "medium:"{"w":320,"h":290,"q":90,"zc":"1","bg":"000000"}}
Вывод превью в айтеме<img src="{$medium}" class="mw-100 item_img" alt="{$pagetitle}" title="{$pagetitle}"/>
Заранее спасибо вам.
Включите &showLog=`1` и посмотрите что вообще происходит
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.