Редактор изображений — встроенный инструмент, позволяющий отредактировать загруженное на сайт изображение.
Обработать изображение можно в любом из блоков, где предусмотрено его наличие. Исключением являются блоки из категории «Магазин». Карточки товаров рекомендуется подготовить перед загрузкой на сайт.
Загрузка изображения и активация редактора
Выберите подходящий для вашей страницы блок, перейдите в меню «Контент» этого блока, и затем в разделе с изображением загрузите нужную картинку.
После успешной загрузки рядом с изображением появится иконка карандаша. При клике на нее в всплывающем окне откроется редактор.
Выберите подходящий для вашей страницы блок, перейдите в меню «Контент» этого блока, и затем в разделе с изображением загрузите нужную картинку.
После успешной загрузки рядом с изображением появится иконка карандаша. При клике на нее в всплывающем окне откроется редактор.
Интерфейс редактора
Доступны базовые операции, которые можно произвести с изображениями: изменить размер, отразить по горизонтали и вертикали, обрезать, добавить текст, обработать фильтрами. Также вы можете отменить, вернуть, или полностью сбросить действия над изображением, если что-то пошло не по плану.
Если же вам требуется сложная обработка изображения, то мы рекомендуем воспользоваться специализированными графическими редакторами и после этого загрузить изображение на сайт.
Доступны базовые операции, которые можно произвести с изображениями: изменить размер, отразить по горизонтали и вертикали, обрезать, добавить текст, обработать фильтрами. Также вы можете отменить, вернуть, или полностью сбросить действия над изображением, если что-то пошло не по плану.
Если же вам требуется сложная обработка изображения, то мы рекомендуем воспользоваться специализированными графическими редакторами и после этого загрузить изображение на сайт.
Изменить размер
Вы можете задать собственное разрешение для изображения. Но необходимо учитывать исходный размер картинки. Можно уменьшить картинку без потери качества, но её увеличение уже грозит ухудшением детализации.
Размер можно указать вручную или установить галочку у параметра «Сохранить пропорции», чтобы система автоматически подбирала оптимальное разрешение.
Рекомендованный максимальный размер изображения для загрузки на сайт — 1680x900 пикселей. Подробнее о подготовке изображений перед загрузкой на сайт можно узнать в нашем справочном материале.
Вы можете задать собственное разрешение для изображения. Но необходимо учитывать исходный размер картинки. Можно уменьшить картинку без потери качества, но её увеличение уже грозит ухудшением детализации.
Размер можно указать вручную или установить галочку у параметра «Сохранить пропорции», чтобы система автоматически подбирала оптимальное разрешение.
Рекомендованный максимальный размер изображения для загрузки на сайт — 1680x900 пикселей. Подробнее о подготовке изображений перед загрузкой на сайт можно узнать в нашем справочном материале.
Обрезание изображения
Если требуется оставить только часть изображения, для этого можно воспользоваться специальным инструментом.
Вы сможете выделить поле на изображении, которое вы хотите оставить. Чтобы изменения сохранились, нажмите на кнопку «Применить» и затем на кнопку «Сохранить».
Также вы можете использовать готовые пропорции: 1:1, 3:2, 4:3, 5:4, 7:5, 16:9.
Если требуется оставить только часть изображения, для этого можно воспользоваться специальным инструментом.
Вы сможете выделить поле на изображении, которое вы хотите оставить. Чтобы изменения сохранились, нажмите на кнопку «Применить» и затем на кнопку «Сохранить».
Также вы можете использовать готовые пропорции: 1:1, 3:2, 4:3, 5:4, 7:5, 16:9.
Ориентация изображения
В некоторых случаях для идеального сочетания текста и изображения достаточно его отразить по горизонтали или вертикали. Это можно сделать с помощью инструмента «Развернуть».
В некоторых случаях для идеального сочетания текста и изображения достаточно его отразить по горизонтали или вертикали. Это можно сделать с помощью инструмента «Развернуть».
Поворот изображения
Если вы хотите повернуть изображение на определенный градус, то для этого откройте в редакторе соответствующий пункт.
С помощью ползунка можно задать любое значение от -360 до +360 градусов. Либо использовать шаг в 30 градусов.
Если вы хотите повернуть изображение на определенный градус, то для этого откройте в редакторе соответствующий пункт.
С помощью ползунка можно задать любое значение от -360 до +360 градусов. Либо использовать шаг в 30 градусов.
Добавление текста
При работе с большинством блоков из нашей библиотеки вы можете добавить текстовый элемент отдельно от изображения. Для этого есть соответствующие поля в меню «Контент».
Но иногда может возникнуть необходимость добавить текст прямо в изображение. В этом случае на помощь придет инструмент «Текст».
После активации инструмента нажмите на любом месте изображения, чтобы появился контейнер с текстом. Контейнеру можно задать подходящий размер и изменить его наклон. Также добавленный текст можно отформатировать: изменить цвет, установить курсив, добавить жирности, или подчеркнуть слово.
Дополнительно можно задать выравнивание текста по центру, левой и правой сторонам.
При работе с большинством блоков из нашей библиотеки вы можете добавить текстовый элемент отдельно от изображения. Для этого есть соответствующие поля в меню «Контент».
Но иногда может возникнуть необходимость добавить текст прямо в изображение. В этом случае на помощь придет инструмент «Текст».
После активации инструмента нажмите на любом месте изображения, чтобы появился контейнер с текстом. Контейнеру можно задать подходящий размер и изменить его наклон. Также добавленный текст можно отформатировать: изменить цвет, установить курсив, добавить жирности, или подчеркнуть слово.
Дополнительно можно задать выравнивание текста по центру, левой и правой сторонам.
Нарисовать линию
Если нужно что-то быстро подчеркнуть на изображении, то для этого можно добавить линию.
Вы можете нарисовать линию или стрелку в уникальной форме, либо использовать фиксированную прямую. Также можно изменить цвет и толщину линии.
Если нужно что-то быстро подчеркнуть на изображении, то для этого можно добавить линию.
Вы можете нарисовать линию или стрелку в уникальной форме, либо использовать фиксированную прямую. Также можно изменить цвет и толщину линии.
Добавление фильтров
Изображению можно добавить яркости, шума, явно выделить пиксели, удалить белый цвет, и задать градацию серого.
Доступны проверки: наложение при работе с многослойными изображениями –multiply; управление оттенком изображения при установке собственного фильтра — tint; блендинг, чтобы композицию на изображении сделать естественнее — blend.
Также вы можете воспользоваться готовыми пресетами фильтров: градация серого, сепия, размытие, тиснение, инверсия, резкость.
Изображению можно добавить яркости, шума, явно выделить пиксели, удалить белый цвет, и задать градацию серого.
Доступны проверки: наложение при работе с многослойными изображениями –multiply; управление оттенком изображения при установке собственного фильтра — tint; блендинг, чтобы композицию на изображении сделать естественнее — blend.
Также вы можете воспользоваться готовыми пресетами фильтров: градация серого, сепия, размытие, тиснение, инверсия, резкость.
Какого размера должно быть фото и как уменьшить вес
О технологии Lazy Load
Какие размеры лучше использовать для блоков
Рассмотрим в статье, какие галереи есть в Тильде и как их настроить
Добавление изображений из специальных сервисов, наборов иконок Tilda Icons и Linea.io, и из аккаунта Instagram
