Если вы используете Elementor и WooCommerce для создания своего интернет-магазина, вы можете столкнуться с ситуацией, когда захотите скрыть кнопку «Добавить в корзину» для определенных продуктов. К счастью, есть несколько методов, которые можно использовать для достижения этой цели. В этой статье мы рассмотрим различные подходы, сопровождаемые разговорными объяснениями и примерами кода, которые помогут вам скрыть кнопку «Добавить в корзину» в Elementor для WooCommerce.

Метод 1: использование кода CSS
Один из способов скрыть кнопку «Добавить в корзину» — добавить собственный код CSS. Вы можете сделать это, выполнив следующие действия:

1. Отредактируйте страницу, на которой отображается товар в Elementor.
2. Добавьте класс CSS в виджет товара или раздел, содержащий кнопку «Добавить в корзину».
3. Перейдите в настройки Elementor и перейдите в раздел «Пользовательский CSS».
4. Напишите код CSS, чтобы настроить таргетинг на определенный класс и скрыть кнопку. Например:

   .your-custom-class .woocommerce-Button {
   display: none;
   }

   Этот код скроет кнопку «Добавить в корзину» для целевого класса.

Метод 2: использование динамического контента Elementor
Elementor предоставляет параметры динамического контента, которые позволяют условно скрывать или отображать элементы в зависимости от определенных условий. Вот как можно использовать эту функцию, чтобы скрыть кнопку «Добавить в корзину»:

1. Отредактируйте страницу в Elementor и выберите виджет продукта или раздел, содержащий кнопку.
2. В редакторе Elementor щелкните значок «Динамический» рядом с параметром видимости кнопки.
3. Выберите условие, определяющее, когда кнопка должна быть скрыта. Например, вы можете выбрать «Скрыть, если товара нет в наличии» или «Скрыть, если цена товара равна нулю».
4. Сохраните изменения, и кнопка «Добавить в корзину» будет автоматически скрыта в зависимости от выбранного условия.

Метод 3: использование пользовательской функции в файле Functions.php вашей темы
Если вам удобно редактировать файлы темы, вы можете использовать пользовательскую функцию, чтобы скрыть кнопку «Добавить в корзину». Выполните следующие действия:

1. Доступ к вашей установке WordPress через FTP или файловый менеджер на панели управления хостингом.
2. Найдите каталог вашей темы и перейдите к файлу functions.php.
3. Откройте файл functions.phpи добавьте следующий фрагмент кода:

   function hide_add_to_cart_button() {
   if (is_product()) {
     global $product;
     $product_type = $product->get_type();
     if ($product_type !== 'variable') {
        remove_action('woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10);
        remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
     }
   }
   }
   add_action('wp', 'hide_add_to_cart_button');

   Этот код удалит кнопку «Добавить в корзину» со всех страниц отдельных товаров, за исключением страниц с переменными товарами.

Используя методы, описанные выше, вы можете легко скрыть кнопку «Добавить в корзину» в Elementor для WooCommerce. Независимо от того, предпочитаете ли вы настройку CSS, настройки динамического контента или пользовательские функции, эти подходы предлагают гибкость и контроль над внешним видом вашего интернет-магазина. Поэкспериментируйте с этими методами, чтобы найти тот, который лучше всего соответствует вашим потребностям и сделает покупки более удобными для ваших клиентов.