Добавление класса к изображениям в зависимости от их ориентации в WordPress

Question

Я создаю веб-сайт с Wordpress и использую созданную мной дочернюю тему.

Я хотел бы добавить класс ко всем своим изображениям в зависимости от их ориентации. (.portrait или .landscape) Я сделал это с javascript, но я не знаю, как это сделать с php. (Я еще не очень хорошо знаю, как использовать фильтры и т.д.)

У меня есть 2 вопроса:

1 - это хорошая идея, чтобы сделать это с php вместо javascript с точки зрения производительности? 2 - Если ответ на предыдущий вопрос - да, то как я могу это сделать? Используя php, как я могу проверить все изображения и, в зависимости от их ориентации, добавить соответствующий класс (.portrait или .landscape)?

Answer 1

1. Да, лучше сделать это с PHP, а не JavaScript, по причинам взаимодействия с пользователем. Расходы на внутреннюю производительность незначительны.
2. Вы бы использовали фильтр WordPress внутри функции wp_get_attachment_image , которая называется wp_get_attachment_image_attributes. Это позволяет изменить атрибут класса перед выводом изображения.

Вот как будет работать фильтр:

function add_orientation_class( $attr, $attachment ) {

    $metadata = get_post_meta( $attachment->ID, '_wp_attachment_metadata', true);

    // Sanity check: we need both width and height to add the orientation class. If either are missing, we should return the attributes.
    if ( empty($metadata['width']) || empty($metadata['height'])) {
        return $attr;
    }

    // Sanity check x2: class should be set by now, but another filter could have cleared it out.
    if ( !isset($metadata['class'])) {
        $metadata['class'] = '';
    }

    if ( $metadata['width'] > $metadata['height'] ) { // If width is greater than height, the image is a landscape image.
        $attr['class'] .= ' landscape';
    } else { // If not, it's a portrait image.
        $attr['class'] .= ' portrait';
    }

    // Return the attributes.
    return $attr;
}

add_filter( 'wp_get_attachment_image_attributes', 'add_orientation_class', 10, 2 );