Добавляем HTML в заголовках изображений в WordPress

Когда вы вставляете изображение в запись или на страницу в WordPress, то вы можете добавить ей заголовок. Каждое вставленное изображение может иметь свой заголовок и использовать стандартные теги HTML для его форматирования (конечно же вы можете оставить его пустым, и тогда у картинки вообще не будет заголовка).

Теги, которые можно использовать, по умолчанию те же самые, которые доступны и в комментариях.

Например, вы можете использовать жирный текст с помощью <strong>, курсив — с помощью <em> и зачеркнутый текст — используя тег <strike>.

Обратите внимание, что WordPress использует светло-серый цвет для фона и темно-серый для текста по умолчанию. Эти селекторы классов CSS — .wp-caption и .wp-caption-text.

Если вы решили использовать свои собственные стили, тогда добавьте в таблицу стилей вашей темы (обычно style.css) следующий код.

.wp-caption {
    background: #F1F1F1;
    line-height: 18px;
    margin-bottom: 20px;
    padding: 4px;
    text-align: center;
}

.wp-caption-text {
    color: #888;
    font-size: 12px;
    margin: 5px;
}

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

HTML код, который мы использовали, следующий:

<em>Этот текст курсив.</em> <strong>А этот - жирный.</strong>

Примеры в картинках

Вставка картинки в админке

Вид заголовка в редакторе

Вид заголовка на сайте

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

По всем вопросам и отзывам просьба писать в комментарии ниже.

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