Położenia powiadomienia WooCommerce w WordPress możesz spersonalizować, używając wtyczki Elementor Pro do edycji strony produktu. Powiadomienie WooCommerce Elementor może przysporzyć problemów. Czasem może pojawić się problem z powiadomieniem, co może być frustrujące. Jeśli masz taki problem, to prawdopodobnie jest to związane z samym usytuowaniem powiadomienia na stronie pojedynczego produktu. Dowiedz się jak poprawić ten problem jak i swój sklep w tej kwestii. Zapraszamy do lektury.
Opis problemu ze sklepem
Podczas projektowania jednego ze sklepów natrafiliśmy na problem związany z powiadomieniem WooCommerce z buildera stron Elementor Pro. W tej wtyczce istnieje możliwość personalizacji strony produktu. Dodatkowo, istnieje widget/element pozwalający wyświetlać powiadomienia z WooCommerce (np. z informacją o dodaniu przedmiotu do koszyka) w dowolnym miejscu na stronie. Niestety zdarza się tak, że pomimo ustawienia miejsca widgetu, wyświetla się on w innym miejscu. Jest to związane z tym, że część akcji we wtyczce sklepu są wywoływane lub pojawiają się nad szablonem Elementora. Najczęściej jest to związanie z dodawaniem produktu do koszyka.
Jak ustawić i wyświetlić powiadomienie prawidłowo?
Jeśli chcesz ustawić i wyświetlić powiadomienie prawidłowo na swoim sklepie internetowym WordPress, będziesz potrzebować dodać fragment kodu PHP do motywu. Można to zrobić bez konieczności edycji zakładki po stronie kodowej produktu. Jest to dość prosta operacja. Aby to zrobić, wystarczy dodać odpowiedni kod PHP do motywu WordPress i zapisać go. Możesz w ten sposób łatwo i skutecznie naprawić powiadomienia WooCommerce na swojej stronie internetowej. Jest to świetny sposób na szybką naprawę tego.
Dlaczego wyświetla się to w taki sposób?
Gdy zajrzymy do źródła pliku content-single-product.php to zauważymy taki fragment kodu:
/**
* Hook: woocommerce_before_single_product.
*
* @hooked woocommerce_output_all_notices - 10
*/
do_action( 'woocommerce_before_single_product' );
To on (tu: szósta linijka) jest odpowiedzialny za wyświetlanie powiadomienia na stronie produktu (Single Product Template). Natomiast w pliku elementor-pro/modules/woocommerce/module.php w linijce 478 zaczyna się funkcja woocommerce_mock_notices. Po wgłębieniu się w kod widzimy, że powiadomienie jest generowane i wysyłane do WooCommerce w celu wyświetlenia go, ale sam builder Elementor nie nadpisuje funkcji powiadomień sklepu. Sam problem został rozwiązany w wersji Pro 3.6.0, ale to samo wystąpiło we wtyczce w wersji 3.19.2.
Powiadomienie WooCommerce Elementor
Zobacz nasze rozwiązanie dla WordPress
Aby skonfigurować i wyświetlić powiadomienie WooCommerce prawidłowo przy użyciu Elementora Pro, będziesz musiał dodać fragment kodu PHP do strony, usuwający akcję WooCommerce. Możesz to zrobić poprzez wtyczkę Code Snippets lub poprzez edycję pliku functions.php w aktywnym motywie WordPress.
remove_action('woocommerce_before_single_product', 'woocommerce_output_all_notices', 10);
Po tym zabiegu w miejscu swojego powiadomienia (widget Elementora Pro) dodaj shortcode, aby je wyświetlić:
[shop_messages]
Sam shortcode jest wbudowany we wtyczkę WooCommerce. Ostatecznie, aby dodać stylizację powiadomienia, zawsze możesz zastosować dodatkowe style CSS. W tym przypadku tracimy możliwość edycji stylu poprzez edytor Elementora.
