Как вставить картинку на сайт. Редактирование
Ольга
Голый текст без изображений, подходящих по смыслу – это скучно. Обучающие материалы без скриншотов и иллюстраций – это нонсенс. Без них трудно разобраться, что надо делать, уловить последовательность действий.
Начинающие блогеры, давайте учиться, как вставить картинку на сайт WordPress правильно.
Как вставить картинку на сайт WordPress
Можно применить несколько способов, чтобы вставить картинку на сайт. Рассмотрим эти способы.
1. Меню админпанели Медиафайлы=>Добавить новый;
2. Непосредственно в Записи=>редактор админпанели блога WordPress (режим Визуально);
наведите курсор на нужное место в тексте;
нажмите вкладку Загрузить/Вставить (Добавить медиафайл).
При этом откроется окно Выберите файлы => выбираете нужную картинку с расширением jpg или png на вашем компьютере => Открыть.
Появится форма с информацией о загруженной картинке.
Заранее дайте картинке правильное название (до загрузки на блог). Если сайт оптимизируете под Google, назовите изображение по-английски (в моем случае – button-google). Если под Яндекс – транслитное название knopka-google или knopka_google.
Если картинка названа, к примеру, Z127 – это не принесет пользу странице в плане seo оптимизации. Если в имени файла русские буквы - появятся битые ссылки, потому что современные программы понимают только алфавиты на латинице.
Заголовок (title тега IMG картинки) формируется автоматически. То, что написано в строчке Заголовок, посетители увидят при наведении курсора на картинку.
Текст – строчка, обязательная для заполнения. При загрузке изображений браузер сначала получает текстовую информацию. Затем она заменяется изображением. Если загрузка изображений в браузере отключена, атрибут alt дает текстовую информацию о рисунке.
Если невозможно подобрать к статье близкие по смыслу Заголовок и Текст, используйте ключевое слово и разбавленное ключевое вхождение. Это поможет при продвижении блога.
Подпись – не обязательный атрибут. Тем не менее, строчку можно заполнить. Подпись появится под изображением, обеспечит релевантный окружающий текст.
Описание – также используем ключевое слово.
Настройте нижнюю часть формы.
Поле ссылка оставьте пустым. Тогда при клике посетителя по изображению ничего не произойдет. Выберите Ссылка на файл – при клике на картинку посетитель увидит ее в исходном размере.
Как выбрать выравнивание?
Слева – текст будет обтекать изображение справа.
По центру – текст будет размещен над и под изображением.
Справа – картинка будет справа относительно текста.
Нет выравнивания – левый нижний угол картинки будет находиться на месте поставленного вами курсора.
Размеры изображения по умолчанию заранее настраиваются в меню админпанели WordPress Параметры=>Медиафайлы. Обычные настройки:
- миниатюра – изображение сжимается до 150 по наименьшей стороне с обрезкой второй стороны;
- средний размер – картинка сжимается до 300 пикселей по меньшей стороне (ширине или высоте), другая сторона уменьшается пропорционально;
- большой размер также задается индивидуально во вкладке Параметры=>Медиафайлы;
- полный – фактический размер картинки, тот, что вы сделали у себя на компьютере.
Затем нажмите Вставить в запись.
В Галерее находятся картинки, вставленные через данную запись. В Библиотеке файлов – изображения, добавленные через страницы, записи и меню админпанели Медиафайлы. Любое из них можно отредактировать и загрузить в запись, нажав надпись Показать рядом и картинкой.
Редактирование изображений
Если что-то не устраивает после загрузки медиафайла в запись, есть возможность его редактирования.
Админпанель=>Медиафайлы=>Изменить. Здесь можно редактировать Заголовок, Текст, Подпись, Описание.
Опция позволяет обрезать, повернуть картинку против или по часовой стрелке, отразить по вертикали, либо горизонтали.
Далее Редактировать =>Масштабировать – можно задать определенный масштаб.
Либо Обрезать – задать нужные пропорции или размеры.
Редактирование расположения изображения в статье
Нажмите на изображение (Редактировать запись, режим Визуально).
1 – редактировать расположение изображения в статье;
2 – удалить его.
На вкладке Редактировать вы сможете:
- изменить масштаб картинки;
- изменить ее месторасположение в теле статьи (слева, справа, по центру)
На вкладке Дополнительно – поменять размеры самой картинки.
После редактирования не забывайте нажать кнопку Сохранить.
Напомню, что редактировать изображение после загрузки не рекомендуется - это одна из рекомендаций сервиса PageSpeed для ускорения загрузки блога на компьютер пользователя. Лучше подготовить изображение с нужными размерами до того, как загружать картинку на сайт. Что еще можно сделать для увеличения скорости загрузки сайта?