При загрузке каждого изображения товара на сервере создаются несколько уменьшенных вариантов (эскизов) этого изображения. Эскизы разного размера удобно использовать в разных разделах витрины: в списках, при просмотре категории, на странице товара.
При загрузке изображений эскизы формируются в соответствии с правилами, заданными в разделе бекенда магазина «Настройки → Изображения». В этом разделе всегда содержится несколько стандартных правил формирования эскизов — они используются для показа эскизов изображений товаров в бекенде магазина. Если этих правил недостаточно для витрины вашего магазина, в дополнение к стандартным правилам можно добавить собственные.
Добавление новых правил приведет к тому, что при загрузке изображений на сервере будут создаваться дополнительные эскизы с указанными размерами.
Вместо задания новых правил вы можете включить формирование эскизов дополнительных размеров «на лету». Для этого включите параметр «Разрешить создание эскизов произвольных размеров по требованию». В этом случае эскиз нужного размера, если он отсутствует на сервере, будет автоматически сформирован только при открытии страницы, на которой он отображается. Сформированный «на лету» эскиз сохранится на сервере и будет использоваться в дальнейшей работе интернет-магазина.
Правила формирования эскизов
В Shop-Script поддерживается несколько типов правил формирования эскизов из исходных (больших) изображений — все они описаны ниже в этой статье.
Вписывание в квадрат по ширине и высоте [200]
Оригинальное изображение уменьшается с сохранением пропорций таким образом, чтобы ни ширина, ни высота полученного эскиза не превышали указанное значение.
Пример настройки эскиза:
Макс. (ширина, высота) = 200px
Код для HTML-шаблона:
{$wa->shop->productImgHtml($product, '200')}
Ограничение по ширине [200x0]
Оригинальное изображение уменьшается с сохранением пропорций таким образом, чтобы ширина эскиза не превышала указанное значение.
Пример настройки эскиза:
Ширина = 200px, высота = авто
Код для HTML-шаблона:
{$wa->shop->productImgHtml($product, '200x0')}
Внимание: при указании формата изображения с несколькими размерами следует использовать латинскую букву x.
Ограничение по высоте [0x200]
Оригинальное изображение уменьшается с сохранением пропорций таким образом, чтобы высота эскиза не превышала указанное значение.
Пример настройки эскиза:
Ширина = авто, высота = 200px
Код для HTML-шаблона:
{$wa->shop->productImgHtml($product, '0x200')}
Квадратная обрезка [96x96]
Из середины оригинального изображения вырезается квадрат максимальной площади и уменьшается до указанного размера. Если оригинальное изображение квадратное, то оно просто уменьшается до указанного размера.
Пример настройки эскиза:
Квадратная обрезка: размер = 96px
Код для HTML-шаблона:
{$wa->shop->productImgHtml($product, '96x96')}
Прямоугольная обрезка [100x50]
Из середины оригинального изображения вырезается прямоугольник максимальной площади, соотношение сторон которого соответствует соотношению указанных значений. Вырезанный прямоугольник уменьшается с сохранением пропорций до заданных размеров. Если оригинальное изображение обладает теми же пропорциями, что и указанные значения, то оно просто уменьшается до этих размеров.
Пример настройки эскиза:
Прямоугольная обрезка: ширина = 100px, высота = 50px
Код для HTML-шаблона:
{$wa->shop->productImgHtml($product, '100x50')}
Как получить адрес эскиза
Для того чтобы получить в шаблоне только адрес (URL) эскиза нужного размера вместо готового кода для отображения эскиза, следует аналогичным образом использовать хелпер {$wa->shop->productImgUrl($product, $size)}, как показано в примере:
{$wa->shop->productImgUrl($product, '750x0')}
46 комментариев
Добрый день, выставлена галочка на опцию создание эскизов произвольных размеров по требованию но сами эскизы на сайте не создаются, подскажите в чем проблема?
Возможные причины и варианты решения: https://www.shop-script.ru/help/4599/thumbnails-on-the-fly-fail/.
А каким образом к сгенерированному <img> добавить класс?
Пример:
{$wa->shop->productImgHtml($p, '200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png", 'class' => 'test'])}А как изображению 'default' => "`$wa_theme_url`img/dummy200.png" добавить класс?
Добрый день! Столкнулись со следующей проблемой, при выгрузке фото на всех фото получается какой-то фон, как будто накладывается маска, и белый становится в сероватый, на белом фоне фотка выделяется. Это как-то можно поправить ? Сказали что это так отрабатывает PHP.
Пример фото , сразу незаметно, но если присмотреться то видно что фон сероватого оттенка, особенно видно если в фотошопе применить уровни к фото.
Подскажите, пожалуйста, за что отвечает параметр со значением 970 в ссылке фотографии товара?
<a href="{$wa->shop->productImgUrl($product, '970')}">{$wa->shop->productImgHtml($product, '750', [ 'itemprop' => 'image', 'id' => 'product-image', 'alt' => $product.name|escape ])}
</a>
Это размер изображения с квадратной обрезкой в 970px, т.е. по ссылке откроется большое изображение размером 970px на 970px.
А где или как включить, чтобы на странице товара отображались квадратные эскизы и миниатюры
http://motux.ru/product/%D0%B0%D0%B2%D1%82%D0%BE%D...
Отображение миниатюр фотографий зависит от настроек и функциональности темы дизайна. За консультацией обратитесь к разработчику вашей темы.
Жаль. Это стандартный функционал мог быть для всех тем. И работать с разработчиками тем сложнова то как-то. Не могу понять, как изменить эти параметры
Макс. ( Ширина, Высота ) = 970 px
Ширина = 750 px, Высота = авто
Ширина = 200 px, Высота = авто
Квадратная обрезка: 96x96 px
Квадратная обрезка: 48x48 px
Лучше бы сделали правильную обрезку миниатюр и эскизов, ну хотя бы как вКонтакте... прямоугольные они некрасиво смотрятся.
Есть ли возможность изменить путь нахождения эскизов
Может есть готовый плагин?
Либо в какую сторону смотреть?
Как пример нужно из базового пути: /wa-data/public/shop/products/73/39/3973/images/5/5.750.jpg
Сделать наподобие: /assets/название товара или артикул/эскизы
Напишите, зачем вам это нужно. Возможно, задачу можно переформулировать или решать с другой стороны.
Мы переносим готовый магазин клиента и там картинки уже проиндексированы и используются на других сайтах, поэтому ищем пути возможно ли как то все сохранить
Там система папок такая
/assets/Название товара.jpg
/assets/Папка с Название эскиза 1/Название товара.jpg
/assets/Папка с Название эскиза 2/Название товара.jpg
То есть нужно 2 вещи:
1 Для каждого эскиза формировать свою папку, в папке эскизов размещаются фото товаров (мы сделаем настройку без переименовывания файла)
2 Убрать промежуточные папки с id (73/39/3973)
Тогда если даже папки не совпадут нам достаточно будет сделать простой редирект
Подозреваю, что вам не стоит изменять структуру хранения эскизов изображений товаров в Shop-Script. Вполне вероятно, что вам и вашему клиенту это изменение может потом стоить лишних нервов и работы.
Я бы просто настроил редиректы со старых адресов на новые.
Другой, более экономный способ решения проблемы: просто оставьте файлы изображений там, где они уже есть — в директории /assets/. В Webasyst не используется корневая поддиректоория с таким именем. Внешние ссылки продолжат работать, как и раньше. А для товаров загрузите эти же изображения ещё раз — уже в стандартные директории Shop-Script. Конечно, получится дублирование файлов на сервере и занятое дисковое пространство, но зато вы сэкономите на разработке довольно сложного решения с не совсем ясной перспективой его работоспособности в будущем и на нагрузке на сервер, которую будут вызывать редиректы.
Если вы хотите получить больше комментариев по вашему вопросу, задайте его в общем хабе поддержки — там вам смогут ответить и другие пользователи. Комментарии к статьям, как здесь, например, чаще всего оставляют только сотрудники Webasyst.
Спасибо попробую там спросить, если не найдем решение то думаю воспользуемся на время вашим решением и сохраним старую папку
1. Как вывести все имеющиеся эскизы товара для list-thumbs.html?
{$wa->shop->productImgHtml($product, '200')}2. Как вывести первые 2 эскиза товара для list-thumbs.htmlТакое не работает
{if count($product.images) < 1} {$wa->shop->imgHtml($image, '200x200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png"])} {else} {$product = $wa->shop->product($p.id)} {foreach $product.images as $image} {$wa->shop->imgHtml($image, '200x200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png"])} {/foreach} {/if}Хочу, если у товара 1 или 0 картинок то должна быть 1 картинка или dummy200.png. Если картинок больше чем 1 то вывести две картинки.
как это сделать?
Попробуйте так:
{$product = $wa->shop->product($p.id)} {foreach $product.images as $image} {if $image@iteration < 3} {$wa->shop->imgHtml($image, '200x200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png"])} {/if} {foreachelse} {$wa->shop->imgHtml(null, '200x200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png"])} {/foreach}Как сделать, чтобы генерировались изображения товаров с высотой более 1000 пикселей.
В эскизах добавили нужны размер
В коде файла темы указали 1800, там где было 970.
Но изображение генерируется только 1000 пикселей в высоту
Создайте файл wa-config/apps/shop/config.php с таким содержимым:
<?php return array( 'image_max_size' => 2000, //строка с новым ограничением );Если такой файл уже есть, добавьте в него только строку с новым ограничением.
Очистите кеш Вебасиста.
А из какого приложения/раздела нужно создать этот файл?
Как очистить кеш вебасиста, кроме как ctrl+f5 при открытии страницы?
Его нужно создать в текстовом редакторе на вашем компьютере и загрузить в директорию сервера, например, по FTP, SSH или через файловый менеджер в контрольной панели хостинга. Если вы в облаке Webasyst, попросите службу поддержки загрузить для вас нужный файл.
Об этом есть справочная статья. Её легко найти поиском в базе знаний.
Здравствуйте! В новом Shop-Script перестал работать этот способ? в конфиге указано 1600, а формирует картинки размером 970px
Как сделать чтобы баннеры в слайдере отображались во весь размер? Сейчас баннер обрезан.
С этим вопросом обратитесь, пожалуйста, к разработчику вашей темы дизайна. Или задайте вопрос на форуме поддержки.
При пересоздании эскизов откуда берется эскиз-оригинал?
Эскизы формируются из полноразмерных изображений, хранящихся в директории wa-data/protected/shop/products/.
Здравствуйте. как сделать что бы не делались эскизы фотографий а только оригинальные были картинки, а то у меня не хватает места на хостинга , а товаров больше 30к?
Запретить формирование эскизов стандартных размеров нельзя — они используются в бекенде магазина. Можно только попробовать отказаться от использования дополнительных размеров, которые используются в вашей теме дизайна.
Какие у вас есть варианты выхода:
Добрый день! Обрезала плагином для фотографий белый фон, и в бекенде "поехали" размеры изображений, стали разными, есть просто огромные. Во фротенде смотрится нормально из-за настроек шаблона темы. А в бекенде просто беда. Как вернуть изображениям с обрезанным белым фоном стандартные размеры эскизов для бекенда? Без удаления товаров и новой их загрузки?
Ваш вопрос не имеет прямого отношения к теме статьи. Задайте его в отдельной теме на форуме поддержки, пожалуйста, или поищите ответ на него с помощью функции поиска.
Здравствуйте, как сделать так, чтоб КРАТКОЕ ОПИСАНИЕ отображалось не только в списках товаров но и на каждой карточке товара под названием, Я НА ФОТО ОТМЕТИЛА красным и прикрепила картинку из другого магазина (как пример. У них есть краткое описание на карточке)
Ваш вопрос не имеет прямого отношения к теме статьи. Задайте его в отдельной теме на форуме поддержки, пожалуйста, или поищите ответ на него с помощью функции поиска.
Капец, неделю от вас ждем ответа, и вы пишете что это не относится к теме! Ужас просто!
Вопросы, не относящиеся к теме статьи, лучше задавать на форуме или напрямую службе поддержки.
В начале статьи явно не хватает кода для HTML-шаблона для вызова оригинала изображения.
Попробуйте использовать такой код:
{$wa->shop->productImgHtml($product, '10000')}Вместо 10000 укажите любое большое число.
Здравствуйте. Если на сайте изображения товаров имеют размеры меньше 700px и Яндекс-маркет не пропускает их, можно ли как-то настроить, чтобы устранить эту проблему? Спасибо
Вариант решения — загрузить изображения товаров с нужными размерами.
В краткой и полной карточке товара у изображений нет чёткости. Плохо читается текст если он есть на товаре. Как исправить? Вторая картинка - это если навести курсор на товар, тогда видно хорошо и всё читаемо.
Попробуйте включить настройку «Резкость» и увеличить значение настройки «Качество эскизов» и затем выполнить действие «Удалить и заново создать эскизы изображений всех товаров» в разделе «Настройки → Изображения».
Помогите разобраться.
Выгружаем картинки на сайт, но эскизы нарезает как-то криво, а именно, в категории товаров у некоторых товаров ломает главную картинку https://partez.ru/category/vanny/akrilovye-vanny/ , хотя в карточке товара изображения показывает корректно https://partez.ru/akrilovaya-vanna-gemy-g8040-c-l/
Заметил такую же проблему при импорте товаров в магазин по ID товара или артикула. При импорте товаров в магазин установите поиск товаров по названию и коду артикула. У меня сработало. Тут видимо какой-то баг в работе импорта...
Напишите нам, пожалуйста, в службу поддержки — изучим ситуацию подробнее в вашем магазине. Предположительно в свойствах некоторых товаров в базе данных хранится неверный идентификатор изображения. Но это нужно проверить точно, имея доступ к вашему магазину или изучая дамп вашей базы данных.
Если вы сами точно заметите, при каких обстоятельствах возникает эта проблема, чтобы её можно было легко повторить, можно вместо обращения в службу поддержки оставить сообщение об ошибке в специальном разделе форума поддержки.