Как настроить блок Картинка

Блок «Картинка» ставит на страницу изображение: фото, логотип, афишу, баннер акции или скриншот отзыва. Картинку можно сделать кликабельной — например, превью портфолио, которое ведёт на полный альбом или сайт.

Как добавить

  1. Откройте проект, вкладку «Редактор».
  2. В панели «Добавить блок» выберите группу «Медиа» → «Картинка». Если на странице уже есть блоки, панель свёрнута — нажмите на её заголовок.
  3. Блок встанет в конец страницы и откроется на вкладке «Содержимое». Изменения сохраняются сами, превью справа обновляется сразу.

Настройки

Содержимое

  • Выбрать изображение — загрузить файл с телефона или компьютера: PNG, JPEG, WebP, GIF, AVIF, BMP или ICO до 8 МБ. После загрузки появятся надпись «Готово» и миниатюра.
  • ИИ — создать картинку по текстовому описанию.
  • Картинка (URL / id) — сюда подставляется адрес загруженного файла. Можно вставить и прямую ссылку на изображение в интернете.
  • Ссылка — адрес, который откроется по нажатию на картинку. Пустое поле — картинка никуда не ведёт.
  • Alt — короткое описание изображения. Его читают экранные дикторы и поисковики, а посетитель увидит его, если картинка не загрузится.

Кнопка «+ элемент» добавляет в блок ещё одну картинку — они встанут друг под другом. Лишнюю убирает «Удалить элемент».

Блок «Картинка» в редакторе TapWay: загруженное фото, поля «Ссылка» и «Alt»

Дизайн

По умолчанию блок оформлен «как на странице»: фон, тень и рамка берутся из дизайна страницы. Нажмите «Настроить этот блок» и откройте раздел «Содержимое: цвета и шрифты»:

  • Размер — «В полном размере» (на всю ширину) или фиксированная ширина: «Большая» — 250 px, «Средняя» — 150 px, «Маленькая» — 100 px, «Очень маленькая» — 50 px. Вариант «(обрезать)» ограничивает высоту той же величиной, «(не обрезать)» показывает картинку целиком.
  • Закругление — «Не закруглять», «Мягкий квадрат» или «Круг». «Круг» делает картинку круглой — так оформляют аватар.
  • Заполнение — как картинка вписывается в размер: «Оставить как есть», «Помещать полностью», «Заполнить блок» или «Авто».
  • Выравнивание — слева, по центру или справа; заметно, когда картинка уже полной ширины.
  • Открывать ссылку — «В новом окне» (так по умолчанию) или «В этом же окне».

Ниже — общие разделы оформления: «Готовые стили», «Фон, скругление и отступы», «Тень», «Рамка», «Градиент», «Стекло», «При наведении», «Анимация и наследование». Кнопка «Сбросить» снимает с блока тень, рамку, градиент, стекло и эффект при наведении.

Настройки дизайна блока «Картинка»: размер, закругление «Круг» и заполнение

Действия

«Скрыть блок» убирает картинку со страницы, ничего не удаляя, — вернуть можно кнопкой «Активировать блок». «Дублировать блок» ставит копию в конец страницы, «Удалить навсегда» удаляет блок после подтверждения.

Советы

  • Круглый аватар: «Размер» — «Средняя (обрезать)», «Закругление» — «Круг», «Заполнение» — «Заполнить блок».
  • Файлы HEIC (формат фото iPhone) редактор не принимает: если загрузка с компьютера не проходит, сохраните фото как JPEG.
  • Заполняйте «Alt» словами, которые описывают картинку, например «Маникюр с дизайном, френч», а не «фото1».
  • Несколько фото для пролистывания соберите в «Карусель», фото с заголовком и текстом — в «Карточку».

Лимиты тарифа

  • Картинок от ИИ в месяц: 3 на бесплатном тарифе, 10 на «Базовом», 20 на «Про», 200 на «Бизнесе».
  • Блоков на странице: на бесплатном тарифе посетителям видны первые 5, на «Базовом», «Про» и «Бизнесе» — без лимита.
  • «Градиент», «Стекло», рамки «Градиент» и «Неон», эффекты «Свечение» и «Блик» при наведении — это эффекты оформления: на бесплатном тарифе посетители их не видят, на «Базовом», «Про» и «Бизнесе» — видят.