Tworzysz strony produktów w Elementorze, a przycisk listy życzeń nie chce się umieścić tam, gdzie chcesz? SaveTo Wishlist udostępnia natywny widżet Elementora, dzięki czemu możesz przeciągnąć przycisk dokładnie tam, gdzie powinien się znaleźć, zamiast polegać na automatycznym umieszczaniu przez wtyczkę. Ten przewodnik obejmuje dodawanie widżetu, jego stylizację, używanie go w siatkach produktów i naprawianie najczęściej pojawiających się problemów.
Czego będziesz potrzebować
- Elementor, darmowy lub Pro.
- SaveTo Wishlist Lite w wersji 1.1.3 lub nowszej. Wcześniejsze wersje nie zawierają widżetu.
- WooCommerce, z co najmniej jednym opublikowanym produktem.
- Szablon lub strona zawierająca produkt, z którym można pracować, na przykład szablon pojedynczego produktu lub pętla produktów.
Widżet odczytuje istniejące ustawienia listy życzeń, więc nie ma nic do skonfigurowania na początku. Umieść go w szablonie, a zostanie wyświetlony ten sam przycisk, który już pokazuje Twój sklep.
Dodaj widżet do szablonu produktu
- Otwórz szablon produktu lub stronę, którą chcesz edytować w Elementorze.
- W panelu widżetów wyszukaj Zapisz do listy życzeń.
- Przeciągnij widżet na swój układ tam, gdzie chcesz, aby pojawił się przycisk.
- Kliknij Aktualizuj, aby zapisać.
Widżet pojawia się zarówno w kategoriach WooCommerce, jak i Ogólne w panelu, więc każda z nich działa, jeśli wolisz przeglądać niż szukać.
Przycisk zostanie wyświetlony od razu, używając bieżących ustawień listy życzeń. Jeśli nic się nie pojawi, zapoznaj się z poniższą sekcją rozwiązywania problemów.
Wybierz typ przycisku
Otwórz sekcję Przycisk listy życzeń w zakładce Treść. Zawiera ona jedno ustawienie.
- Ustaw Typ przycisku na pożądany styl.
- Domyślnie jest to styl przycisku produktu ustawiony w ustawieniach listy życzeń.
- Zmiana tutaj wpływa tylko na ten widżet, a nie na resztę Twojego sklepu.
Dostępnych jest dziesięć stylów:
- Tylko tekst
- Tylko ikona
- Ikona i tekst
- Pigułka z ikoną i tekstem
- Solidna ikona
- Solidna ikona i tekst
- Solidna pigułka z ikoną i tekstem
- Minimalna ikona
- Minimalna ikona i tekst
- Minimalna pigułka z ikoną i tekstem
Warianty Pill używają w pełni zaokrąglonych rogów. Solid wypełnia kształt ikony, a Minimal używa lżejszego obrysu.
Ustaw wyrównanie
Wyrównanie znajduje się w zakładce Styl, gdzie Elementor przechowuje wyrównanie dla własnych widżetów.
- Otwórz sekcję Układ w zakładce Styl.
- Ustaw Wyrównanie na Lewo, Środek lub Prawo.
Wyrównanie domyślnie ustawione jest na Lewo.
Zmień kolory przycisków
Otwórz sekcję Kolory w zakładce Styl. Otrzymasz osiem kontrolek kolorów, każda z normalnym i najechaniem:
- Kolor tekstu i Kolor tekstu (najazdu)
- Kolor tła i Kolor tła (najazdu)
- Kolor obramowania i Kolor obramowania (najazdu)
- Kolor ikony i Kolor ikony (najazdu)
Każdy z nich zaczyna się od koloru już zapisanego w ustawieniach Twojej listy życzeń, więc niezmodyfikowany widżet wygląda dokładnie tak samo jak reszta Twojego sklepu. Zmień jeden, a nadpisze ten kolor tylko dla tego widżetu.
Kolory to jedyne, co nadpisuje widżet. Rozmiar przycisku, dopełnienie, szerokość obramowania i kształt ikony nadal pochodzą z ustawień listy życzeń, więc zmień je w SaveTo Wishlist > Ustawienia > Umieszczenie przycisku i style.
Selektory kolorów akceptują tylko jednolite kolory. Nie ma suwaka przezroczystości ani zakładki kolorów globalnych, ponieważ przycisk listy życzeń przechowuje zwykłe kolory szesnastkowe.
Pokaż przycisk w siatce pętli i karuzeli pętli
Jeśli używasz Elementor Pro, przycisk listy życzeń działa również w widżetach Siatka pętli i Karuzela pętli. Masz dwa sposoby, aby go tam umieścić.
Pozostaw to wtyczce. Umieszczenie przycisku na stronie sklepu już stosuje się do kart pętli, więc przycisk pojawia się na każdej karcie bez Twojej ingerencji.
Umieść go samodzielnie. Edytuj szablon elementu pętli, a następnie dodaj widżet Dodaj do listy życzeń do układu karty. Daje Ci to kontrolę nad tym, gdzie dokładnie na karcie znajduje się przycisk.
Kiedy samodzielnie umieszczasz widżet w elemencie pętli, wtyczka zatrzymuje renderowanie własnego automatycznego przycisku na tych kartach, dzięki czemu otrzymujesz jeden przycisk na kartę zamiast dwóch. Jedynym wyjątkiem jest sytuacja, gdy umieszczenie przycisku sklepu jest ustawione na Nie pokazuj. W takim przypadku wtyczka pozostawia karty w spokoju, ponieważ usunięcie automatycznego przycisku bez dodania nowego byłoby krokiem wstecz.
Której metody należy użyć?
SaveTo Wishlist oferuje trzy sposoby umieszczania funkcji listy życzeń na stronie, a każdy z nich pełni inne funkcje. Najważniejsza różnica: widżet Elementora umieszcza przycisk na produkcie, podczas gdy skrócony kod i blok wyświetlają samą listę życzeń. Większość sklepów używa obu.
Widżet Elementora umieszcza przycisk Zapisz do ulubionych tam, gdzie go umieścisz. Używaj go podczas tworzenia szablonów produktów w Elementorze. Jest to jedyny z trzech, który ma własne kontrolki stylizacji.
Krótki kod [saveto_wishlist] wyświetla listę ulubionych klienta. Używaj go, gdy lista ulubionych musi pojawić się poza układem Elementora, na przykład na stronie edytora klasycznego, w widżecie tekstowym lub w konstruktorze bez natywnego elementu. Zobacz Jak używać krótkiego kodu listy ulubionych.
Blok listy ulubionych wykonuje tę samą pracę co krótki kod, w edytorze bloków WordPress. Używaj go podczas edycji stron za pomocą bloków, a nie konstruktora stron. Zobacz Jak używać bloku Gutenberg listy ulubionych.
Rozwiązywanie problemów
Przycisk w ogóle się nie pojawia
Przejdź przez nie w tej kolejności.
- Brak produktu w kontekście. Widżet renderuje się tylko tam, gdzie WooCommerce ma produkt do pracy. Pusta strona lub szablon niezwiązany z produktem nie daje mu nic do wyrenderowania, więc pozostaje pusty. Umieść go w szablonie pojedynczego produktu, szablonie elementu pętli lub na stronie, która ustawia produkt.
- Listy ulubionych gości są wyłączone. Jeśli opcja Wyłącz listę ulubionych gości jest włączona w ustawieniach listy ulubionych, a Ty przeglądasz witrynę wylogowany, przycisk jest celowo ukryty. Zaloguj się lub wyłącz to ustawienie, aby go zobaczyć.
- SaveTo Wishlist jest starszy niż 1.1.3. Widżet nie istnieje w poprzednich wersjach. Zaktualizuj wtyczkę.
Na stronie produktu pojawiają się dwa przyciski listy ulubionych
Zwykle rozwiązuje się to samo. Kiedy Twój szablon produktu Elementora zawiera widżet, wtyczka dezaktywuje swoje własne umiejscowienie dla pojedynczego produktu, więc renderuje się tylko umieszczony przez Ciebie przycisk.
Produkty powiązane, dodatkowe i krzyżowe są celowo pozostawione w spokoju, ponieważ te karty są renderowane przez umiejscowienie w sklepie. Jeśli widzisz drugi przycisk na nich, to umiejscowienie w sklepie wykonuje swoją pracę. Zmień to w SaveTo Wishlist > Ustawienia > Umiejscowienie przycisku i style.
Selektory kolorów nie mają wpływu
Dwa ustawienia wyłączają kontrolki kolorów, a każde z nich wyświetla komunikat w panelu wyjaśniający dlaczego.
Jeśli tryb przycisku produktu jest ustawiony na Domyślny motyw, przycisk dziedziczy styl przycisku Twojego motywu, a wtyczka nie stosuje własnego koloru. Przełącz tryb przycisku produktu na Predefiniowany w ustawieniach listy ulubionych, aby kontrolować kolory.
Jeśli ikona listy ulubionych jest niestandardowym przesłanym obrazem, Kolor ikony i Kolor ikony (po najechaniu) nic nie robią, ponieważ przesłanego obrazu nie można zabarwić. Zamień go na wbudowany kształt ikony w ustawieniach listy ulubionych, jeśli chcesz kontrolować kolory.
Zamiast listy ulubionych pojawia się układ bloga
Jeśli otworzysz link do listy ulubionych i zobaczysz projekt archiwum swoich postów zamiast listy ulubionych, szablon archiwum Elementor Theme Builder przejmuje stronę. Dzieje się tak, gdy warunek wyświetlania tego szablonu dotyczy archiwum postów, które pasuje również do poszczególnych widoków listy ulubionych.
Aby to obejść:
- Otwórz Szablony > Kreator motywów i wybierz szablon archiwum.
- Otwórz jego Warunki wyświetlania.
- Usuń warunek, który dotyczy archiwum wpisów.
- Zbuduj swoje archiwum postów jako samodzielną stronę, a nie szablon Theme Builder.
Często zadawane pytania
Czy potrzebuję Elementor Pro, aby używać widżetu?
Nie. Widżet Save to Wishlist działa w darmowym Elementorze. Elementor Pro jest potrzebny tylko do widżetów Loop Grid i Loop Carousel oraz do szablonów Theme Builder.
Czy widżet nadpisze moje ustawienia listy życzeń?
Tylko osiem kolorów i tylko dla tego jednego widżetu. Typ przycisku i wyrównanie są również per widżet. Wszystko inne, w tym rozmiar, dopełnienie, szerokość obramowania i kształt ikony, nadal pochodzi z ustawień Twojej listy życzeń.
Czy mogę używać widżetu i automatycznego umiejscowienia razem?
Tak. Wtyczka zajmuje się nakładaniem się za Ciebie. W szablonie produktu zawierającym widżet wyłącza własne umieszczanie pojedynczego produktu, a w elementach pętli wyłącza się, aby każda karta wyświetlała jeden przycisk.
Dlaczego na selektorach kolorów nie ma suwaka przezroczystości?
Przycisk listy życzeń przechowuje tylko jednolite kolory szesnastkowe. Kolor przezroczysty lub globalny poprawnie wyświetlałby się w edytorze, a następnie powracał do zapisanego koloru na stronie na żywo, więc te opcje są wyłączone, zamiast wprowadzać w błąd.
Potrzebujesz pomocy?
Jeśli masz pytanie lub napotkasz jakiekolwiek problemy, jesteśmy tutaj, aby pomóc.
- Użytkownicy premium: Otwórz zgłoszenie wsparcia
- Użytkownicy darmowi: Odwiedź nasze forum społeczności
