> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://dots.crisp.help/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Який має бути розмір завантажуваних фото товарів (страв)?

Зображення повинне мати співвідношення сторін 3:2 та бути у форматі .png або .jpg.

Максимальний розмір файлу 1 МБ.

**Важливо!** Чим більший файл, тим довше він завантажуватиметься у додатку. Використовуйте компресію. Намагайтеся зробити розмір файлу якнайменше щоб швидкість завантаження зображень залишалася на прийнятному рівні. В ідеалі розмір фото має важити не більше ніж 300 Кб

**Рекомендований розмір 1652х1100px.**

Також у фото товарів є видима зона в передпоказі, за якою фото обрізається. Відповідно до цієї видимої зони підганяється фото. **Видима зона** виділена зеленим на скріншоті, її розмір в пікселях зазвичай **1650х662**. Зона передпоказу — це те, що ви бачите, коли просто відкриваєте сторінку меню. Повністю (червона зона) фото відкривається, якщо відкриєте певний товар та наведете курсор на фото 

![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_1omao1i.png)

Фото можуть бути як з фоном, так і з прозорим фоном, нижче буде декілька прикладів. 
Приклад відображення товарів **з фоном** за посиланням — https://pizzhub.com.ua/sofiyivska-borschagivka/pizzhub-sofiyivska-borschagivka/pizza
Приклад відображення товарів **з прозорим фоном** за посиланням — https://jckbur.dots.live/kyiv/jacks-burgers-kyiv-1670592964?city=kyiv

| Важливо! 
**Функціонал Редагування.**  Ви можете додати зображення будь-якого розміру та скористатися функціоналом Редагування зображення. Тобто обрати будь-яку частину зображення, яка має відображатися для товару.

![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_14k9xnt.png)
![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_1hu3y5r.png)

_ **Примітка** _: Завантажте зображення будь-якого розміру та оберіть варіант "Використовувати рекомендовані пропорції", тоді рекомендовані вимоги підтягнуться.


![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_ik7ejf.png)

Також можна скористатися кнопкою **Перегляд**. Кнопка дозволяє побачити, як завантажене зображення буде виглядати в веб версії сайту, мобільній версії сайту та додатків, в залежності від налаштувань відображення.

![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_9rmbsf.png)

![](https://storage.crisp.chat/users/helpdesk/website/3c7680cb850c3200/image_9vsuz.png)

**Примітка:** Якщо зображення Вас не влаштовує , Ви можете натиснути кнопку **Змінити зображення** та відкриється вікно Вашого пристою для завантаження іншого зображення.  Ця функція дозволить уникнути небажаного обрізання фото на різних пристроях та версіях налаштувань.



Посилання на цю статтю: [тут.](https://dots.crisp.help/uk/article/yakij-maye-buti-rozmir-zavantazhuvanih-foto-tovariv-strav-ytzyol/?bust=1700328048157)