Редактор як додати зображення і іконку 1

Редактор як додати зображення і іконку 1

Щоб встановити віджет, перемістимо його всередину секції. Натиснемо на кнопку "Завантажте зображення з вашого комп'ютера", виберемо зображення з бібліотеки або завантажимо зображення з комп'ютера.

У вкладці "Вид"

У вкладці "Роль"

Можна вибрати картинку як звичайне зображення і картинку як фото товару. якщо вона призначена для функціоналу кошика. Обов'язково призначте роль "Фото товару", якщо розміщуєте картинку як фото товару в інтернет-магазині.

У вкладці "Дія"

Налаштувати, щоб зображення відкривалося при натисканні.

У вкладці "SEO"

Налаштовуємо ALT і TITLE. За допомогою цих атрибутів пошукові системи ранжирують зображення в своїх сервісах з пошуку картинок. Коли ваші зображення беруть участь у видачі пошукових систем, це дає приплив додаткового трафіку на сайт.

Атрибут ALT (альт) - це альтернативний текст, який відображає браузер, якщо не може завантажити картинку, наприклад, картинка видалена з сервера або у відвідувача відключений показ зображень. Пошукові боти поки не навчилися «читати» зображення, але завдяки альта ви підкажете роботу, що це за картинка, яке у неї назву і що на ній написано. Раніше за стандартами W3C наявність цього атрибута було обов'язковим.

Атрибут TITLE (тайтл) - це додаткова інформація про зображення або посилання. Його основне призначення - допомогти відвідувачу отримати більш докладний опис елемента. Значення атрибута показується при наведенні мишки на об'єкт. Не плутайте атрибут TITLE з однойменною тегом заголовка сторінки!

Якщо нам потрібна одна з простих іконок: зафарбована, контурна або з тонким контуром, можна налаштувати її форму.

Форма іконки №1 задається за замовчуванням

Редактор як додати зображення і іконку 1
Для форми іконки №2 можна налаштувати "Розмір іконки" і "Скруглення"
Редактор як додати зображення і іконку 1
Для форми іконки №3 налаштовується "Розмір іконки", "Скруглення" і "Товщина обведення"
Редактор як додати зображення і іконку 1
Для форми іконки №4 налаштовується "Розмір іконки" і "Скруглення" і "Непрозорість"
Редактор як додати зображення і іконку 1

ЩО ЩЕ ПОЧИТАТИ

Схожі статті