Добавляем атрибут Title к изображениям WordPress

Не так давно мы уже рассказывали вам о различиях между alt текстом и тайтлом изображения и о том, как стоит использовать их для изображений своего блога WordPress. Один из пользователей спросил, существует ли простой способ добавления атрибута title для изображений WordPress. Стандартный загрузчик медиафайлов не предлагает опции для добавления этого атрибута. В сегодняшней статье мы покажем вам как легко можно добавить атрибут title к изображениям в WordPress.

Что такое атрибут Title у изображений?

В HTML изображения выводятся с помощью тега img. Вот так:

<img src="/path/to/image/fruits.jpg" width="100" height="100" />

Однако, роботы поисковиков не могут увидеть ваши изображения. Для того, чтобы помочь им, вы можете добавить атрибут для того, чтобы задать альтернативный текст для области изображения. Это атрибут описывает то, что отображает картинка. Вот так:

<img src="/path/to/image/fruits.jpg" width="100" height="100" alt="A fruit basket" />

Тег alt также отображается, когда изображение не найдено или когда браузер не может загрузить картинки. Вот так:

broken-img2[1]

Для того, чтобы упростить жизнь пользователям, пользующимся экранными дикторами и пользователям с ограниченными возможностями, вы такое можете добавить атрибут title изображению. Вот так:

<img src="/path/to/image/fruits.jpg" width="100" height="100" alt="A fruit basket" title="Fruit Basket" />

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

image-title-popup[1]

Используя атрибуты как alt, так и title, вы можете улучшить релевантность ваших изображений в поисковых системах. Также это поможет пользователям с ограниченными возможностями понять, о чем идет речь на вашей веб-страничке.

Проблема

Вы можете добавить title к своим изображениям WordPress при загрузке их с помощью стандартного загрузчика медиафайлов. Однако, этот title используется только внутри WordPress, и это не то же самое, что атрибут title, используемый внутри тега img в HTML.

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

Добавление атрибута Title к изображениям WordPress

Первым делом вам необходимо установить и активировать плагин Restore Image Title. После активации просто перейдите в редактор записей и попробуйте загрузить изображение. После того, как оно будет загружено, используйте поле Title для добавления любого нужного текста, который вы хотите видеть в атрибуте title.

title-attribute-wp[1]

Далее, просто вставьте изображение в запись. Теперь, когда вы наведете мышь на картинку в визуальном редакторе, вы увидите текст указанного вами title во всплывающей подсказке.

title-displayed-editor[1]

Плагин берет значение, которое вы ввели в заголовке изображения и добавляет его в код вставки картинки в качестве title атрибута.

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

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

VN:F [1.9.22_1171]
Rating: 5.0/5 (1 vote cast)

Об авторе ADv

Занимаюсь разработкой сайтов и магазинов на WordPress. Оказываю платные помощь и консультации. Skype: advokat_b
  • Dfgdfgdfg Fgdfgdfgdf

    А как цвет изменить подсветки заголовка при наведение на картинку? Где искать это в самом WordPress. Сейчас он выводит в бледно жёлтом оттенке.

Scroll To Top