Работа с блоком изображений WordPress: как добавить изображения в WordPress [+секретный совет]

Многих пользователей работа с изображением может сильно разочаровать. Не всегда легко выбрать правильное соотношение сторон или правильно изменить размер изображений, чтобы они хорошо смотрелись на всем макете.

1. Зачем использовать блок изображений WordPress
2. Как добавить изображения с помощью блока изображений WordPress
3. Процесс дополнительного форматирования изображений
4. Дополнительный совет от нас внутри статьи

В старых версиях WordPress (до версии 5.0) изображения добавляются с помощью кнопки +Добавить медиафайл. Проблема заключалась в том, что даже при минимальном изменении размера изображения вам нужно было загрузить его снова. Это означает пустую трату времени и лишние клики.

Новый блочный редактор Gutenberg изменяет способ добавления изображений в WordPress, чтобы упростить этот процесс для конечных пользователей. В этой статье мы покажем вам практическое руководство по добавлению и редактированию блока изображений WordPress. Кроме того, мы объясним еще один вариант вставки изображений — как скопировать и вставить изображение в область содержимого всего за несколько кликов. Мы также познакомим вас с новыми функциями, добавленными в WP 5.3.

Но сначала давайте поговорим о том, почему вы должны использовать изображения в постах и на страницах.

Почему блок изображений WordPress обязателен для вашего сайта

Привлекать внимание

Изображения привлекают внимание посетителей сайта. Они должны быть интересными, чтобы посетители дольше оставались на вашем сайте. Подумайте о записи в блоге без изображений. Это просто набор текста. На первый взгляд это не очень интересно, хотя может быть ценным и полным информации. Кроме того, фотографии могут помочь лучше представить и описать вашу тему.

По этой причине нам нужно использовать блок изображений WordPress, чтобы сосредоточить внимание на важных вещах.

Иллюстративный текст и контекст

Изображения также являются важной частью для понимания контента, потому что они позволяют посетителям лучше понять, о чем статья. Благодаря инфографике вы можете объяснить сложные связи и рассказать простым языком. Это помогает посетителям лучше ориентироваться в проблеме, о которой вы говорите.

Сделать сайт красивее

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

Как добавить изображения в редактор блоков WordPress

Чтобы вставить изображение в публикацию или страницу, вам нужно добавить основной блок — блок изображения. Есть несколько способов сделать это:

- Использование «+» в верхней панели или в любом месте редактора

– Использование косой черты «/» и последующее написание слова «изображение»

Будет создан новый блок, куда вы сможете добавлять актуальные изображения.

Загрузка изображений в WordPress

Как разместить изображения там, где вы хотите?

• Используйте Загрузить и выберите изображение с жесткого диска.
• Используйте медиатеку, где вы можете выбрать изображения, которые уже были загружены на ваш сайт.
• Используйте мышь и перетащите изображение
• Вставить URL-адрес изображения

Менее известный метод добавления изображений WordPress

Помимо загрузки изображений через окно загрузки, как упоминалось ранее, есть еще один способ вставить изображение (и это такой быстрый способ!). С улучшенным редактором WordPress вы сможете:

• Скопируйте изображение из любого контента или
• Просто «перетащите» изображение курсором мыши

Затем вставьте или переместите (перетащите) выбранное изображение в нужное место в области содержимого.

Ту же технику вы можете использовать и в случае, если вы хотите вставить изображение, снятое с вашего экрана. Всего три простых шага. Первый, вам нужно сделать скриншот с помощью функции принтскрин. Например, Windows 10 предоставляет инструмент Snippet по умолчанию под названием Snip & Sketch, который также доступен с помощью ярлыка — просто одновременно нажмите клавиши Win + Shift + S на клавиатуре. Затем выберите область изображения, которую вы хотите захватить. Последний шаг — вставить скопированное изображение (или его часть) в область содержимого с помощью основного сочетания клавиш Ctrl+V.

А что происходит с изображением WordPress, которое вы вставили в свой редактор? Что ж, он автоматически добавляется в Медиатеку, где вы можете редактировать это изображение.

Ограниченные возможности метаданных изображения

В рамках редактирования изображения вы можете установить его заголовок, заголовок, описание и альтернативный текст. К сожалению, вы не можете изменить имя файла изображения — оно сохранит свое автоматически сгенерированное имя, например изображение-1.png и так далее. Этот тип имени файла может быть небольшим недостатком с точки зрения SEO-оптимизации из-за конфликта с рекомендациями по именованию файлов. Поэтому вам необходимо учитывать этот аспект, прежде чем перемещать изображения WordPress в область контента.

Выравнивание изображения

Выравнивание изображения является одной из основных функций. Независимо от того, добавляете ли вы блок изображения WordPress в публикацию или страницу, вы всегда должны учитывать размещение в зависимости от дизайна веб-сайта. Исходя из этого, выравнивание изображения можно выбрать на панели инструментов над ним. По умолчанию вы можете выровнять изображение по левому краю, по правому краю или по центру. Некоторые темы WordPress позволяют центрировать изображения по ширине или по всей ширине. Это действительно зависит от функций темы, так как не все темы поддерживают это.

Изменение размера изображений

Революционная функция блока изображений в редакторе WordPress — практическое изменение размера. Просто перетащите сторону изображения, чтобы сделать его меньше или больше. Таким образом, вы можете настроить размер изображения в зависимости от текста в содержимом. Редактор автоматически сохраняет пропорции изображения, поэтому вам не нужно беспокоиться о деформации.

Новый стиль блока, который преобразует изображение в форму круга.

Если вы используете последнюю доступную версию WordPress, вы, возможно, заметили новый стиль обрезки круга, который вы можете использовать для своего изображения. Форму изображения можно изменить через верхнюю панель инструментов, нажав на первый значок «Изменить тип или стиль блока». Форма по умолчанию (прямоугольник) будет обрезана до формы круга.

Новые функции в блоке изображений WordPress (добавлены в WP 5.3)

Поддержка изображений высокого разрешения

Одной из самых ярких особенностей WP 5.3 является улучшенная обработка изображений на платформе WordPress. Работа с изображениями теперь имеет две основные особенности:

1. Возобновление загрузки — если вы загружаете фотографии с высоким разрешением и происходит сбой подключения к Интернету, процесс загрузки продолжится автоматически с прерванного места.
2. Автоматический поворот изображения — последняя выпущенная версия WP гарантирует, что неправильно повернутые изображения автоматически поворачиваются в правильное положение при загрузке.

Настройки в Инспекторе

Чтобы настроить точные размеры, вы можете использовать Инспектор на правой боковой панели редактора. Настройки размера изображения предлагают готовые к использованию форматы, такие как эскиз, средний, большой или полный размер. Вы можете установить ширину и высоту в пикселях или процентах, конечно.

Это очень быстро и практично, потому что вы можете делать все изменения размера изображения прямо в блоке изображений WordPress и все в одном месте в редакторе блоков.

Другие настройки блока изображений

Как добавить URL-адрес

Изображения можно использовать как статические изображения или они также могут быть интерактивными и ссылаться на:

•   Медиафайл
•   Страница вложения
•   Пользовательский URL

Как отредактировать изображение в блоке изображения WordPress

Каждое изображение можно редактировать после нажатия на значок карандаша. Будет открыто модальное окно с медиатекой, где вы можете написать замещающий текст, заголовок, подпись и описание. Так же, как вы уже привыкли делать это в старой версии WordPress с классическим редактором.

Почему важно заполнять эти тексты?

Если посетители нажимают на изображение, чтобы увеличить его, они видят заголовок изображения (например, домашнюю страницу Citadela), а не имя файла изображения. Кроме того, если возникнут проблемы с загрузкой изображения, на вашем веб-сайте будет отображаться альтернативный текст.

Дополнительные советы

Помимо всех этих причин и настроек для блоков WordPress Images есть самое главное. Вы можете привлечь больше посетителей на свой сайт, используя изображения. Итак, как их получить?

Сейчас людям лень читать. Они предпочитают прокручивать картинки вниз, чтобы найти ответы. Как ваши фотографии и изображения могут ранжироваться? Тексты — вот ответ. Очень важным для SEO-оптимизации является правильное название и описание изображения. Не забудьте заполнить Альтернативный текст. Тогда Google сможет лучше понять изображение. Так у вас будет больше шансов ранжировать его в результатах поиска изображений.

2 способа, как добавить подпись к изображению

Добавление подписи к изображению с помощью редактора блоков очень просто. Прямо под изображением есть место для написания текста. Это первый способ — Подпись пишется именно к этому изображению на данной подстранице.

Второй способ — написать подпись к изображению с помощью значка карандаша (Редактировать изображение) в медиатеке. Таким образом, вы добавляете подпись к изображению глобально по всему веб-сайту. Это означает, что если вы используете одно и то же изображение в трех разных местах, оно всегда будет использовать эту подпись.

Вам нравится, как легко добавлять изображения в блок изображений WordPress? Попробуйте сами!

Узнайте больше о нашей новой теме WordPress Citadela и ее настраиваемых пакетах макетов. Они были специально разработаны и разработаны для различных видов бизнеса, а также поддерживают новый способ редактирования контента через редактор блоков WordPress.