Как можно отредактировать текст на бейдже "Распродажа" в блоках Gutenberg?

Как заменить бейдж "Распродажа" на отображение процента скидки в архивах и на странице товара? <br/> Столкнулся с проблемой, что тема блочная и не всегда поддерживает стандартные фильтры и хуки. <br/> Не могу понять, куда именно следует обратиться за решением. <br/> <br/> У меня уже есть функция, которая правильно рассчитывает процент на странице товара, но в архивах это не работает. <br/> <br/> <a href="https://ru.paste.pics/RSDSR" rel="nofollow">Скрин - Страница товара</a> <br/>
  • 28 августа 2024 г. 11:14
Ответы на вопрос 2
Чтобы заменить бейдж "Распродажа" на отображение процента скидки в блоках Gutenberg, вам нужно будет использовать хуки и фильтры WooCommerce для изменения отображения этих бейджей. Поскольку вы упомянули, что ваша тема блочная и может не поддерживать стандартные фильтры, мы попробуем использовать универсальный подход.

1. **Замена бейджа "Распродажа" на процент скидки на странице товара**:
   Если у вас уже есть функция, рассчитывающая процент скидки, убедитесь, что она находится в вашем `functions.php`, и вы можете использовать её для отображения вместо бейджа "Распродажа". Вот пример кода, который может помочь:

   ```php
   add_filter('woocommerce_sale_flash', 'custom_sale_flash', 10, 2);
   function custom_sale_flash($html, $post) {
       $percentage = get_discount_percentage($post->ID); // Функция для получения процента скидки
       if ($percentage > 0) {
           return '<span class="onsale">-' . $percentage . '%</span>';
       }
       return $html; // Возврат оригинального HTML, если скидки нет
   }

   function get_discount_percentage($product_id) {
       $product = wc_get_product($product_id);
       if (!$product->is_on_sale()) {
           return 0;
       }
       $regular_price = $product->get_regular_price();
       $sale_price = $product->get_sale_price();
       return round((($regular_price - $sale_price) / $regular_price) * 100);
   }
   ```

2. **Замена бейджа "Распродажа" на процент скидки в архиве**:
   Чтобы изменить отображение на страницах архива (категории и магазин), вы можете использовать похожий фильтр. Например, можно изменить его следующим образом:

   ```php
   add_filter('woocommerce_sale_flash', 'custom_sale_flash_archive', 10, 2);
   function custom_sale_flash_archive($html, $post) {
       $percentage = get_discount_percentage($post->ID);
       if ($percentage > 0) {
           return '<span class="onsale">-' . $percentage . '%</span>';
       }
       return $html;
   }
   ```

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

4. **Дебаг**:
   Если изменения не работают, включите отображение ошибок PHP, чтобы находить возможные конфликты. Обязательно проверяйте на наличие ошибок и предупреждений.

5. **Вариант с использованием плагина**:
   Если вы не хотите рисковать изменять код в `functions.php`, вы можете рассмотреть возможность использования плагинов для кастомизации WooCommerce, таких как Code Snippets. Это позволит вам добавлять и тестировать код без редактирования файлов темы.

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

Примерное решение:

<script>
        $( document ).ready(function(){
            
            $( "li.product.sale" ).each( function() {
               
                var price_b = $( this ).find(".wc-block-components-product-price del bdi");
                var price_before = price_b.text().match(/\d/g).join('');
                
                var price_a = $( this ).find(".wc-block-components-product-price ins bdi");
                var price_after = price_a.text().match(/\d/g).join('');
                
                var sel = price_before - price_after;
                
                var prc = Math.round( sel / price_after * 100 );
                                
                $( this ).find(".wc-block-grid__product-image > a").prepend('<span class="onsale">-'+ prc +' %</span>');
                
            });

        });
</script>
Похожие вопросы