Визуал в Shopify — это первое, что видит покупатель. Иногда нужно перевернуть фото, чтобы товар смотрелся выигрышнее, или чтобы текст на этикетке читался правильно. Но сделать это в Shopify не так просто, как кажется.
Встроенные инструменты Shopify
В админке Shopify есть базовый редактор картинок. Откройте товар, нажмите на фото и ищите иконки поворота. Однако зеркального отражения там нет. Shopify позволяет поворачивать изображение на 90 градусов, но не отражать его.
Это сделано намеренно: платформа не хочет, чтобы продавцы меняли пропорции товара. Но иногда нужно.
Где взять нужную функцию
Есть три способа:
- Графический редактор. Отразить фото до загрузки в Shopify. Подойдет Photoshop, Figma или даже онлайн-редакторы типа Photopea.
- Приложения. В магазине приложений Shopify есть плагины для работы с изображениями (например, «Image Optimizer» или «Bulk Image Edit»).
- Код CSS. Если вы умеете редактировать тему, можно добавить стиль, который отразит изображение на лету.
Отражение через CSS
Самый быстрый способ без сторонних инструментов — добавить CSS-код в тему. Заходите в «Темы» → «Действия» → «Редактировать код». Найдите файл theme.css и добавьте:
.product-gallery img { transform: scaleX(-1);
}Это правило отразит все изображения товаров. Но будьте осторожны: если на фото есть текст, он станет зеркальным и нечитаемым.
Когда это нужно
Отражение изображения полезно для:
- Обуви (если нужен вид на пару).
- Одежды с принтами (чтобы показать симметрию).
- Зеркал и стеклянных поверхностей (чтобы создать эффект отражения).
Ошибки при отражении
Главная ошибка — потеря качества. При отражении через CSS браузер перерисовывает картинку, что может привести к пикселизации. Лучше отразить фото в графическом редакторе и загрузить готовый файл.
Если вы отразите изображение в Shopify бездумно, можете запутать покупателя. Помните: зеркальное фото должно нести смысл, а не быть просто трюком.
Альтернатива — специальные приложения
Для тех, кто не хочет лезть в код, приложения Shopify делают всё автоматически. Например, «Bulk Image Editor» позволяет применить эффекты сразу к сотням фото. Это удобно для больших каталогов.