Как автоматически добавлять alt текст к загружаемым изображениям в WordPress

По умолчанию в WordPress поле "Alt атрибут" не заполняется при загрузке изображений. Это приводит к тому, что атрибут остаётся пустым, когда изображение вставляется в контент.

Примечание: Код в этой статье подходит как для классического редактора, так и для редактора блоков Gutenberg.

Идеально, чтобы alt атрибут содержал текст, описывающий изображение. Это важно для людей, которые по каким-либо причинам не могут видеть изображение (в этом случае текст alt будет показан вместо изображения), и для SEO, так как это помогает поисковым системам понять, что изображено на фото.

Решение проблемы: автоматическое заполнение alt атрибута

Чтобы решить эту проблему, используйте следующий код. Когда вы создаёте пост и выбираете изображение из медиа-библиотеки, поле alt (если оно пустое) будет автоматически заполнено на основе заголовка изображения.

Как вставить код в WordPress

Для начала нужно вставить код в файл functions.php вашей темы или оформить его как плагин.

/**
 * Заполняет поле alt атрибута на основе заголовка изображения, когда оно вставляется в контент поста.
 *
 * @param array $response
 *
 * @return array
 */
function change_empty_alt_to_title( $response ) {
    if ( ! $response['alt'] ) {
        $response['alt'] = sanitize_text_field( $response['title'] );
    }

    return $response;
}

add_filter( 'wp_prepare_attachment_for_js', 'change_empty_alt_to_title' );

Преимущество этого метода

Преимущество данного подхода в том, что информация динамически заменяется в момент выбора и вставки изображения в пост, поэтому она не хранится в базе данных, что экономит место.

Как работает фильтр

Похожие данные (содержимое переменной $response) проходят через фильтр:

Array
(
    [id] => 291
    [title] => картофель в коробках
    [filename] => boxed-seed-potatoes.jpg
    [url] => http://wp-test.com/wp-content/uploads/2019/02/boxed-seed-potatoes.jpg
    [link] => http://wp-test.com/post-4/boxed-seed-potatoes/
    [alt] =>
    [author] => 1
    [description] =>
    [date] => 1553934323000
    [modified] => 1553934323000
    [filesizeHumanReadable] => 41 KB
    [height] => 451
    [width] => 600
)

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

Другой пример использования

Вы также можете заменить заголовок поста на пустой alt для изображений:

/**
 * Заполняет поле alt атрибута заголовком поста для изображения, когда оно добавляется в контент.
 *
 * @param array $response
 *
 * @return array
 */
function change_empty_alt_to_post_title( $response ) {
    if ( ! $response['alt'] ) {
        $response['alt'] = sanitize_text_field( $response['uploadedToTitle'] );
    }

    return $response;
}

add_filter( 'wp_prepare_attachment_for_js', 'change_empty_alt_to_post_title' );

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