Мы помогаем клиенту с сайтом WordPress WooCommerce, который на долгие годы потерял видимость в поисковых системах из-за сотен проблем с кодом, конфигурацией и контентом, вызванных годами пренебрежения, установленных и удаленных плагинов и десятков тем.

После запуска нового сайта мы отслеживали его производительность и недавно получили следующий отчет Google Search Console:

Мы были удивлены тем, что на WooCommerce были представлены продукты компании, для которых не было установлено изображение продукта. Когда мы просканировали только что открывшийся сайт, мы не обнаружили никаких проблем… это произошло потому, что в новой теме было изображение-заполнитель, которое появлялось всякий раз, когда изображение не было установлено. Это привело к отсутствию ошибок для изображений, которые не были найдены.

Список продуктов WooCommerce

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

фильтр изображения товара не установлен

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

Добавьте фильтр в список продуктов администратора WooCommerce.

На странице function.php дочерней темы клиента мы добавили следующие два раздела кода. Сначала мы создаем поле фильтра:

// Add a filter on product for set product image
add_action('restrict_manage_posts', 'filter_products_by_image_presence');
function filter_products_by_image_presence() {
    global $typenow;
    $selected = isset($_GET['product_image_presence']) ? $_GET['product_image_presence'] : '';
    if ('product' === $typenow) {
        ?>
        <select name="product_image_presence" id="product_image_presence">
            <option value="">Filter by product image</option>
            <option value="set" <?php selected('set', $selected); ?>>Image Set</option>
            <option value="notset" <?php selected('notset', $selected); ?>>Image Not Set</option>
        </select>
        <?php
    }
}

Ниже приводится подробное объяснение каждой части кода.

  • add_action('restrict_manage_posts', 'filter_products_by_image_presence');
    • Эта линия подходит restrict_manage_posts, действие, которое активируется в области администрирования WordPress и позволяет вам добавить дополнительные параметры фильтрации в список сообщений. Здесь он используется для добавления нового фильтра в список продуктов WooCommerce.
  • function filter_products_by_image_presence() { ... }
    • Этот блок определяет функцию filter_products_by_image_presenceкоторый выводит HTML для нового фильтра выбора раскрывающегося списка на экране администратора продукта.
  • global $typenow;
    • Глобальная переменная $typenow используется для проверки типа текущего списка новостей, чтобы гарантировать, что пользовательский фильтр добавляется только на экраны типа новостей «Продукты», а не на другие.
  • $selected = isset($_GET['product_image_presence']) ? $_GET['product_image_presence'] : '';
    • Эта строка проверяет наличие активного фильтра, проверяя параметр URL-адреса Product_image_presence, передаваемый как запрос GET, когда вы выбираете параметр фильтра и отправляете фильтр. Он сохраняет текущий выбор, чтобы сохранить выбранное состояние фильтра после перезагрузки страницы.
  • if ('product' === $typenow) { ... }
    • Этот условный оператор проверяет, является ли текущий тип сообщения «продукт», гарантируя, что код в операторе if работает только для продуктов WooCommerce.
    • Все между ?> и <?php — это вывод в формате HTML, включающий раскрывающееся меню выбора с параметрами фильтрации по продуктам с «Изображение установлено» или «Изображение не установлено». PHP интерполируется для обработки динамического выбора с использованием selected() функция, которая выводит selected атрибут, если текущий $selected значение соответствует значению опции.
    • selected() Эта функция представляет собой вспомогательную функцию WordPress, которая сравнивает первый аргумент со вторым и, если они совпадают, выводит «selected=»selected»», который является атрибутом HTML, необходимым для отображения параметра, выбранного в раскрывающемся меню.
ЧИТАТЬ  Вебинар по искусственному интеллекту для аналитики социальных сетей – 20 июня 2024 г. | Цифровые мероприятия

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

Запустите запрос в списке продуктов администратора WooCommerce.

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

add_filter('parse_query', 'filter_products_query_by_image_presence');
function filter_products_query_by_image_presence($query) {
    global $pagenow, $typenow;

    if ('edit.php' === $pagenow && 'product' === $typenow && isset($_GET['product_image_presence']) && $_GET['product_image_presence'] != '') {
        $presence = $_GET['product_image_presence'];
        $meta_query = array(
            'relation' => 'OR',
            array(
                'key' => '_thumbnail_id',
                'compare' => 'NOT EXISTS'
            ),
            array(
                'key' => '_thumbnail_id',
                'value' => '0'
            )
        );

        if ('set' === $presence) {
            $meta_query = array(
                array(
                    'key' => '_thumbnail_id',
                    'compare' => 'EXISTS'
                ),
                array(
                    'key' => '_thumbnail_id',
                    'value' => array('', '0'), // Assuming '0' or '' could be placeholders for no image.
                    'compare' => 'NOT IN'
                ),
            );
        } elseif ('notset' === $presence) {
            $meta_query = array(
                'relation' => 'OR',
                array(
                    'key' => '_thumbnail_id',
                    'compare' => 'NOT EXISTS'
                ),
                array(
                    'key' => '_thumbnail_id',
                    'value' => '0'
                )
            );
        }

        $query->set('meta_query', $meta_query);
    }
}

Этот фрагмент кода предназначен для изменения основного запроса WordPress к спискам продуктов в области администрирования, чтобы разрешить фильтрацию продуктов на основе того, есть ли у них связанное с ними изображение. Вот объяснение его ингредиентов:

  • add_filter('parse_query', 'filter_products_query_by_image_presence');
    • Эта строка прикрепляет filter_products_query_by_image_presence функционировать, чтобы parse_query ловушка фильтра, используемая для настройки основного запроса, который WordPress использует для получения сообщений (или пользовательских типов сообщений, таких как продукты) в таблице списка администраторов.
  • function filter_products_query_by_image_presence($query) { ... }
    • Эта функция предназначена для изменения запроса списка продуктов на основе наличия изображений продуктов. $query переменная является экземпляром WP_Query класс передается по ссылке, а это означает, что любые изменения в этом объекте повлияют на фактический запрос, выполняемый WordPress.
  • global $pagenow, $typenow;
    • Эти глобальные переменные являются переменными среды WordPress. $pagenow используется для проверки текущей страницы администратора и $typenow чтобы проверить текущий тип сообщения.
    • Условный оператор проверяет, является ли текущая страница «edit.php» (страница по умолчанию для списков сообщений и пользовательских типов сообщений), тип сообщения — «продукт» (что означает, что мы находимся в списке продуктов WooCommerce), и если фильтр устанавливается через GET параметр с именем «product_image_presence».
  • Новый массив метазапросов создается на основе значения Product_image_presence. Этот массив предназначен для создания условий для фильтрации товаров с изображениями или без них.
    • relation ключ, установленный на «ИЛИ», указывает, что любое условие может быть истинным для метазапроса для получения продуктов.
    • Если для фильтра установлено значение «установить», новый $meta_query предназначен для поиска товаров с изображениями. Продукты, у которых есть «_thumbnail_id» (что означает, что изображение установлено), включаются вместо пустой строки или 0.
    • Если для фильтра установлено значение «notset», метазапрос ищет продукты, для которых метаключ «_thumbnail_id» либо не существует, либо имеет значение «0», что означает, что с продуктом не связано никакое изображение.
  • $query->set('meta_query', $meta_query);
    • Эта строка изменяет основной запрос, устанавливая «meta_query» с определенными условиями. $meta_query.

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

ЧИТАТЬ  На эти наушники с шумоподавлением от Sony скидка более 50 % | Цифровые тенденции

Source