Как добавить значок в кнопку добавления в корзину WooCommerce ⇐ Javascript
Как добавить значок в кнопку добавления в корзину WooCommerce
В woocommerce я хочу добавить значок из библиотеки iconify на кнопку «Добавить в корзину» на моем сайте. Я предпринял несколько попыток, но желаемого результата не получил. Я использовал хуки WooCommerce, но этот значок отображается как HTML-тег и не работает. Этот код:
add_filter('woocommerce_product_single_add_to_cart_text', 'ChangeAddToCartBtnText'); add_filter('woocommerce_product_add_to_cart_text', 'ChangeAddToCartBtnText'); функция ChangeAddToCartBtnText() { $ProductID = get_the_ID(); $Stock = get_post_meta($ProductID, '_stock_status', true); if ($Stock == 'нет на складе') { $text = ' Дополнительная информация'; } еще { $text = ' Добавить в корзину'; } вернуть $текст; //Вы также можете сделать это с помощью оператора переключателя } Я решил сделать это с помощью jquery, но на этом этапе у меня возникли проблемы, мой код такой:
$('#primary .button ').html(' Дополнительная информация'); $('#primary .add_to_cart_button ').html(' Добавить в корзину'); Но этот код реагирует только при первом открытии страницы, а когда пользователь использует фильтры Ajax, кнопки корзины возвращаются в исходное состояние без значков. Я пытался запустить этот код, когда структура страницы категории меняется при выборе фильтра и перестановке продуктов, мой код:
var typingTimer; //идентификатор таймера вар DoneTypingInterval = 1000; //время в мс, например 5 секунд вар $input = $('#primary'); вар Продукты, LastLength; //нажатие клавиши запускает обратный отсчет $input.one('DOMSubtreeModified', function () { Продукты = $('[id^=ProductBox_]'); if (Products.length == LastLength && Products.length != 0) { } еще { ПоследняяДлина = Продукты.длина; typingTimer = setTimeout(doneTyping, DoneTypingInterval); } }); //пользователь «закончил печатать», сделайте что-нибудь функция DoneTyping() { $('#primary .button ').html(' Дополнительная информация'); $('#primary .add_to_cart_button ').html(' Добавить в корзину'); } Но этот код работает только один раз, то есть если пользователь выберет два фильтра, кнопки вернутся в первое состояние. Даже я из $input.bind('DOMSubtreeModified', function () { Я тоже использовал его, но это также создает ненужную обработку для сайта, и это замедляет мою страницу категории продуктов, этот код вызывает моя функция работает бесконечно, а это совсем нехорошо.
В woocommerce я хочу добавить значок из библиотеки iconify на кнопку «Добавить в корзину» на моем сайте. Я предпринял несколько попыток, но желаемого результата не получил. Я использовал хуки WooCommerce, но этот значок отображается как HTML-тег и не работает. Этот код:
add_filter('woocommerce_product_single_add_to_cart_text', 'ChangeAddToCartBtnText'); add_filter('woocommerce_product_add_to_cart_text', 'ChangeAddToCartBtnText'); функция ChangeAddToCartBtnText() { $ProductID = get_the_ID(); $Stock = get_post_meta($ProductID, '_stock_status', true); if ($Stock == 'нет на складе') { $text = ' Дополнительная информация'; } еще { $text = ' Добавить в корзину'; } вернуть $текст; //Вы также можете сделать это с помощью оператора переключателя } Я решил сделать это с помощью jquery, но на этом этапе у меня возникли проблемы, мой код такой:
$('#primary .button ').html(' Дополнительная информация'); $('#primary .add_to_cart_button ').html(' Добавить в корзину'); Но этот код реагирует только при первом открытии страницы, а когда пользователь использует фильтры Ajax, кнопки корзины возвращаются в исходное состояние без значков. Я пытался запустить этот код, когда структура страницы категории меняется при выборе фильтра и перестановке продуктов, мой код:
var typingTimer; //идентификатор таймера вар DoneTypingInterval = 1000; //время в мс, например 5 секунд вар $input = $('#primary'); вар Продукты, LastLength; //нажатие клавиши запускает обратный отсчет $input.one('DOMSubtreeModified', function () { Продукты = $('[id^=ProductBox_]'); if (Products.length == LastLength && Products.length != 0) { } еще { ПоследняяДлина = Продукты.длина; typingTimer = setTimeout(doneTyping, DoneTypingInterval); } }); //пользователь «закончил печатать», сделайте что-нибудь функция DoneTyping() { $('#primary .button ').html(' Дополнительная информация'); $('#primary .add_to_cart_button ').html(' Добавить в корзину'); } Но этот код работает только один раз, то есть если пользователь выберет два фильтра, кнопки вернутся в первое состояние. Даже я из $input.bind('DOMSubtreeModified', function () { Я тоже использовал его, но это также создает ненужную обработку для сайта, и это замедляет мою страницу категории продуктов, этот код вызывает моя функция работает бесконечно, а это совсем нехорошо.
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение