Как установить картинкам название поста в качестве Alt текста на сайте WordPress

Когда я провел SEO-аудит на одном из проектов на этом сайте, я был удивлён тем фактом, что на изображениях не хватает альтернативных текстов . Учитывая, что я тщательно добавляю такой текст к каждому изображению, которое добавляю в статьи, это было интригующе.

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

Как установить картинкам название поста в качестве Alt текста на сайте WordPress

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

Но большая проблема заключается в следующем: WordPress не будет автоматически устанавливать изображение Alt-Text. Если вы серьезно относитесь к SEO, вы поймете, что это проблема. В целях SEO ваши изображения должны иметь правильно заданный Alt-Text, он ничего не стоит и определенно имеет значение. Я скажу еще раз: всегда убедитесь, что вы указали Alt-Text для своих изображений.

Как установить картинкам название поста в качестве Alt текста на сайте WordPress

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

Фрагмент действительно прост. Во-первых, я подключаюсь для получения метаданных, который действительно полезен различными способами. Например, мета-ключ даже не должен существовать, и это дает такие возможности, как создание программных метаданных. Я ограничиваю функцию показанным изображением и предотвращаю бесконечный цикл в условии. Прежде чем получить заголовок, я проверяю существующий альтернативный текст, если таковой имеется.get_{$meta_type}_metadata

function lwp_37481_featured_alt_text($metadata, $object_id, $meta_key, $single) {
    if(isset($meta_key) && $meta_key == '_wp_attachment_image_alt'
        && get_post_thumbnail_id() == $object_id
        && $single === true
    ){
        $original_value = get_post_meta(
            $object_id, '_wp_attachment_image_alt', false
        );
        if(empty($original_value)){
            return get_the_title();
        }
    }
    return $metadata;
}
add_filter('get_post_metadata', 'lwp_37481_featured_alt_text', 10, 4);

Добавьте этот фрагмент кода в ваш WordPress и вуаля. Теперь вы (и Google) увидите заголовок поста в качестве альтернативного текста на избранных вами изображениях. Больше нет необходимости вручную устанавливать альтернативный текст. Ура!

Сначала я думал, что это будет фрагмент Elementor, но он должен хорошо работать за пределами этой экосистемы. Он будет действовать везде, где ваша тема показывает сообщение с его изображением (включая почтовые ящики на главной странице блога, архивы, отдельные сообщения и т. Д.). В конце дня он имитирует заполнение вами этого альтернативного текста . Любая система, которая соблюдает это (будет считаться лучшей практикой), будет обманута моим подходом. 🙂

Почему заголовок сообщения в качестве Альт?

Выгода SEO может быть незначительной, но все мелочи имеют значение. Особенно, если единственное изображение в вашей статье – это рекомендуемое изображение, почему бы не сделать все возможное для лучшего SEO на странице ? Если вы проигнорируете это, они просто будут существовать без альтернативного текста, и, возможно, вы упускаете небольшую возможность.

Когда вы загружаете новый медиафайл в WordPress, он создает новое вложение. Вложение, по сути, является типом поста, и, как таковое, вложение имеет заголовок, выдержку и контент, как и обычные посты. В случае Вложения отрывок используется для хранения подписи к изображению, а Контент – для описания изображения.

Кроме того, как и все обычные сообщения, вложение может иметь метаданные, связанные с ним. На самом деле Alt-Text – это именно то, что: метаданные, хранящиеся рядом с вложением (публикацией).

Таким образом, наш подход будет следующим:

  • Сначала загрузите новое изображение, которое создает вложение.
  • Во-вторых, обновите приложение, чтобы задать заголовок, выдержку (подпись) и содержание (описание) изображения.
  • Наконец, обновите метаданные вложения, чтобы установить изображение Alt-Text.

Мы будем полагаться на один хук действия WordPress и две функции WordPress:

  • Хук: мы прикрепим наш код к хуку WordPress add_attachment, который срабатывает сразу после создания вложения.
  • Функция 1: в WordPress сообщения хранятся в таблице wp_posts. Таким образом, мы можем использовать wp_update_post()функцию для обновления таблицы wp_posts новыми заголовками, заголовками и описаниями изображений.
  • Функция 2: также, в WordPress мета поста хранится в таблице wp_post_meta. Таким образом, мы можем использовать update_post_meta()функцию для установки Alt-Text.

Единственный вопрос сейчас: что мы должны установить все это? Ну, ко всему, что нам нравится, но проще всего установить для них чистое, очищенное имя файла.

Таким образом, наш подход гарантирует, что каждый файл изображения, загруженный в библиотеку мультимедиа, будет тщательно обработан и промыт по имени файла: он автоматически избавится от черточек, подчеркиваний, лишних пробелов и правильно использует заглавные буквы для каждого слова.

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

Есть только одна вещь, которую вы должны сделать: дать каждому файлу изображения осмысленное имя файла перед его загрузкой. Не используйте имя файла по умолчанию вне камеры, такое как IMG_0001.jpg или DSC99876.jpg. Просто переименуйте его в приличную короткую фразу, и все готово.

ОСТАВЬТЕ ОТВЕТ

Пожалуйста, введите ваш комментарий!
пожалуйста, введите ваше имя здесь

СЕГОДНЯ ЧИТАЮТ

10 распространенных ошибок WordPress и решения для их исправления

Для инструмента, которому принадлежит 50-процентная доля рынка всей системы управления контентом (CMS), WordPress стал собственным стандартом. Но, как и любой инструмент, вы можете время от...

Что такое опыт страницы: новый фактор рейтинга Google для страниц сайтов

Пару недель назад Google анонсировал Web Vitals - новый набор метрик для измерения скорости и удобства работы веб-сайтов. На прошлой неделе Google объявил, что...

Список кодов ответов FTP (ФТП) при соединении

Полный список кодов ответов FTP для web мастеров. Здесь вы сможете найти полный список ответов ФТП при создании соединения. Ответ FTP сервера на любую...

Как восстановить пароль администратора на сайте WordPress

Как восстановить пароль к админке от WordPress. Бывает так, что вы не успели записать пароль администратора, а сайт уже не впускает вас. И хорошо...

Руководство по сжатию изображений с помощью плагина Image Optimizer Robin

Robin Image Optimizer является один из двух свободных модулей сжатия изображений который очень хорошо производит сжатие графики на сайте. В предыдущей статье я показал...

Психология подбора цвета сайта для web дизайна проектов

Мы зачастую воспринимаем цвет сайта интуитивно как удобный для работы с сайтом или наоборот. При этом редко знаем почему всё так обстоит и почему...

ПОХОЖИЕ МАТЕРИАЛЫ

Редакторы изображений Tune WP | Дополнение WPSSO для повышения резкости фото WordPress

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

Вопросы и ответы по теме Woodmart (обновляется )

Тема Woodmart одна из лучших для создания интернет магазинов на Woocommerce. Однако ничто не бывает идеальным, поэтому возникают различные проблемы с ней. В этой...

TotalContest Pro – Плагин WordPress для конкурса фото, аудио и видео

TotalContest - это мощный плагин для проведения онкурсов WordPress, предназначенный для проведения и управления конкурсами и соревнованиями на вашем сайте. Он был разработан, чтобы...

Content-visibility: новое свойство CSS, повышающее скорость и рендеринг сайта

Поддержка новых возможностей css стилей, которые появились в Chromium 85, могут быть один из самых новых свойств впечатляющих CSS для улучшения производительности загрузки страницы....

Хак Woocommerce для отображения цену в руб и грв

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

BulletProof Security плагин WordPress: безопасность, сканер, файрвол

Защита безопасности сайта на WordPress: Сканер вредоносного кода, Файрвол, защита формы авторизации, создание резервных копий базы данных, анти-спам и многое другое. Смотрите раздел Основные...