Przejrzane przez Otwierasz swoją stronę z listą życzeń w UX Builderze Flatsome, aby dopasować ją do reszty sklepu. Dodajesz wiersz, nagłówek, może baner. Następnie klikasz Aktualizuj, ładujesz stronę i lista życzeń znika.
Nic się nie dzieje, żadne błędy ani ostrzeżenia. Kupujący, którzy zapisali produkty na później, trafiają na pustą stronę i mogą Ci o tym nie powiedzieć. Łatwo to przeoczyć i dlatego stworzyliśmy element listy życzeń w Flatsome.
Jest on dostępny w darmowej wtyczce SaveTo Wishlist Lite jako natywny element Save to Wishlist dla UX Builder. Poniżej pokażę Ci, dlaczego strona staje się pusta i jak umieścić element. Omówię również jedno miejsce, do którego nie może dotrzeć.
Przejdź do:
- Dlaczego Twoja strona z listą życzeń w Flatsome staje się pusta w UX Builder
- Co tak naprawdę robi integracja SaveTo Wishlist z Flatsome
- Czego potrzebujesz przed rozpoczęciem
- Jak dodać listę życzeń do strony Flatsome za pomocą UX Builder
- Która strona powinna zawierać element listy życzeń
- Jedno miejsce do unikania: bloki UX
- Jak potwierdzić, że Twoja lista życzeń w Flatsome działa
- A co z przyciskiem Zapisz do listy życzeń w Flatsome?
- Często zadawane pytania
- Gotowy do dodania listy życzeń do Flatsome?
Dlaczego Twoja strona z listą życzeń w Flatsome staje się pusta w UX Builder
Strona listy życzeń dociera do przeglądarki w dokładnie jeden sposób. WordPress uruchamia krótki kod [saveto_wishlist] zapisany w treści strony, a ten krótki kod wyświetla listę życzeń.
Strona UX Builder przechowuje własny układ. Po zapisaniu UX Builder zapisuje ten układ jako własne skrócone kody, takie jak [row] i [col]. Odbuduj stronę listy życzeń bez naszego elementu, a zapisany układ nie będzie zawierał żadnych skróconych kodów listy życzeń.
To normalne zachowanie page-buildera, a nie błąd Flatsome. Każdy builder, który zarządza treścią strony, decyduje, co tam się wyświetla, więc lista życzeń potrzebuje elementu, który builder rozumie.
Flatsome to popularny motyw, więc takie ustawienie jest powszechne. Według listy Flatsome na ThemeForest, motyw sprzedał się 270 319 razy. Lista określa go jako najlepiej sprzedający się motyw WooCommerce. Pojawia się również w zestawieniach motywów, w tym na liście motywów WooCommerce dla sklepów hurtowych Wholesale Suite.
Pusta strona listy życzeń kosztuje więcej, niż się wydaje. Według badań Baymard Institute dotyczących stron produktów, 21% z 1193 respondentów badania polega na funkcjach „Zapisz”. Te same badania wykazały, że 89% witryn nie ułatwia dostępu do funkcji Zapisz i ich używania. Strona, która nic nie wyświetla, jest skrajnym przypadkiem tego problemu. Niweczy to wartość konwersji, jaką dodaje lista życzeń.
Co tak naprawdę robi integracja SaveTo Wishlist z Flatsome
Integracja dodaje jedną rzecz: element Zapisz do listy życzeń w selektorze elementów UX Builder. Jest dostępny w SaveTo Wishlist Lite 1.1.3 i nowszych. Nie ma strony ustawień ani przełącznika do włączenia.
- Ten sam skrócony kod pod spodem: Element przypisuje opcje UX Builder do istniejącego skróconego kodu
saveto_wishlistzamiast tworzyć nowy. Dzięki temu wyświetla się dokładnie tak samo jak skrócony kod, z tym samym obsługą gości, klientów i wspólnych list. - Dwa opcjonalne ustawienia: ID listy życzeń i Pokaż tylko domyślną listę życzeń. Odpowiadają one bezpośrednio własnym atrybutom skróconego kodu
ididefaultonly, więc nic nie może się między nimi różnić. - Bezpieczny symbol zastępczy w edytorze: Wewnątrz UX Builder widzisz statyczne pole, a nie swoją aktywną listę życzeń. W ten sposób przypadkowe kliknięcie w edytorze nie zmieni Twoich zapisanych elementów.
- Skrypty ładowane tam, gdzie są potrzebne: Wtyczka skanuje zawartość strony w poszukiwaniu skróconego kodu przed załadowaniem swojej aplikacji listy życzeń. Ponieważ element używa tego samego tagu, każda strona, która go zawiera, otrzymuje potrzebne skrypty i style.
To sprawdzenie zapobiega ładowaniu pełnej aplikacji listy życzeń na strony, które nie wyświetlają listy życzeń. Nasz test szybkości mierzy, co SaveTo Wishlist dodaje do strony produktu. Na każdym innym motywie integracja nic nie robi. Jej hak buildera aktywuje się tylko podczas żądania UX Builder, a symbol zastępczy najpierw sprawdza Flatsome.
Czego nie robi integracja
Zakres jest celowo wąski. Tutaj kończy się zadanie elementu.
| Obszar | Objęte integracją Flatsome? |
|---|---|
| Lista życzeń na stronie edytowanej w UX Builder | Tak, za pomocą elementu Zapisz do listy życzeń |
| Lista życzeń w bloku UX dodanym do stopki, menu lub układu produktu | Nie. Skrypty i style listy życzeń tam się nie ładują |
| Stylizacja przycisku Zapisz na liście życzeń specyficzna dla Flatsome | Nie. Przycisk jest zgodny z Twoimi standardowymi ustawieniami Umiejscowienia przycisku i stylów |
| Zakładka listy życzeń w Moje konto | Niepotrzebne. Flatsome nie tworzy tej zakładki za pomocą UX Builder |
| Strona ustawień lub przełącznik włącz/wyłącz | Brak. Element jest dostępny, gdy tylko Flatsome jest aktywny |
To inny kształt niż nasze integracje motywów dla Woostify i Blocksy, które zmieniają styl samego przycisku. Integracja z Flatsome dotyczy strony listy życzeń. Jest najbliższa naszemu modułowi Divi Builder, który umieszcza listę życzeń w układach Divi w ten sam sposób.
Czego potrzebujesz przed rozpoczęciem
Potrzebujesz trzech rzeczy, a prawdopodobnie masz już dwie z nich.
- Motyw Flatsome: Z włączonym UX Builder dla strony, którą chcesz edytować.
- SaveTo Wishlist Lite 1.1.3 lub nowszy: Obecna wersja to 1.1.6, więc najpierw zaktualizuj, jeśli masz starszą wersję.
- Strona do zbudowania: Zazwyczaj strona listy życzeń, którą wtyczka utworzyła po jej aktywacji.
Element jest częścią darmowej wtyczki. Nie potrzebujesz do niego SaveTo Wishlist Pro, chociaż sklepy Pro też go otrzymują.
Szybka, szczera uwaga na temat wersji. Nasi programiści ręcznie zweryfikowali element na Flatsome 3.15.5, a Flatsome ma wersję 3.20.11 w momencie pisania. Flatsome jest płatnym motywem, więc nie jest częścią naszej zautomatyzowanej strony testowej. Element wykorzystuje własne funkcje budowania Flatsome, ale sprawdź go szybko po każdej dużej aktualizacji motywu.
Jak dodać listę życzeń do strony Flatsome za pomocą UX Builder
Oto pełna konfiguracja. Wykonujesz ją raz na stronę i nie wymaga żadnego kodu. Kroki odpowiadają naszemu przewodnikowi po bazie wiedzy Flatsome.
- Otwórz swoją stronę listy życzeń w UX Builder.
- Kliknij Dodaj elementy, a następnie znajdź Zapisz na liście życzeń w grupie Treść. Poszukaj ikony serca lub wpisz „zapisz na liście życzeń”, aby wyszukać.
- Przeciągnij element do wiersza lub kolumny, w której powinna pojawić się lista życzeń.
- Kliknij element, aby otworzyć jego panel opcji.
- Pozostaw obie opcje na domyślnych, chyba że potrzebujesz konkretnej listy. Poniższa tabela wyjaśnia każdą z nich.
- Kliknij Zastosuj, a następnie Zaktualizuj, aby zapisać stronę.
- Otwórz stronę poza kreatorem, aby zobaczyć listę życzeń na żywo.
Ustaw dwie opcje elementu
Możesz zostawić obie bez zmian. Wtedy element działa dokładnie tak samo jak skrócony kod [saveto_wishlist] na standardowej stronie listy życzeń.
| Opcja | Co robi | Domyślnie |
|---|---|---|
| Wishlist ID | Przypina element do jednej konkretnej listy życzeń, według jej identyfikatora liczbowego. Pozostaw puste dla normalnej strony listy życzeń. | Pusty |
| Show the default wishlist only | Gdy ustawione na Tak, zalogowany klient widzi jedną listę, swoją domyślną, zamiast pełnej tabeli wielu list. Bez ustawionej domyślnej listy, wyświetla pierwszą opublikowaną listę. | Nie |
Obie opcje kształtują to, co widzą zalogowani klienci. Gość zawsze otrzymuje widok listy życzeń dla gości, niezależnie od ustawień. Udostępnione linki do list życzeń zachowują się inaczej dla każdej opcji, co przedstawia poniższy schemat.
Istnieje jedna pułapka, o której warto wiedzieć. Powiązany identyfikator listy życzeń ma pierwszeństwo przed udostępnionym linkiem. Otwarcie udostępnionej listy na tej stronie spowoduje wyświetlenie zamiast niej listy przypiętej. Pozostaw pole Wishlist ID puste na swojej głównej stronie listy życzeń, gdzie otwierają się udostępnione linki.
Wyświetlanie tylko domyślnej listy życzeń jest tą samą funkcją co atrybut shortcode'u defaultonly="yes". Wyjaśniliśmy dlaczego strona z jedną listą pasuje większości klientów, gdy ten atrybut został wprowadzony.
Co zobaczysz wewnątrz edytora
W edytorze element rysuje zwykłe pole z informacją, że lista życzeń pojawi się na stronie na żywo. Jest to oczekiwane i nie jest to problem ze stylizacją.
Prawdziwa lista życzeń to aplikacja na żywo, która zapisuje się na Twoim koncie. Wyświetlenie jej na kanwie pozwoliłoby przypadkowemu kliknięciu dodać lub usunąć elementy z Twojej własnej listy. Dlatego pole zastępcze jest wyświetlane tylko w edytorze i tylko dla zalogowanych użytkowników, którzy mogą edytować posty.
🔍️ Co zaobserwowaliśmy: Pole zastępcze łatwo pomylić z uszkodzoną lub nieustylizowaną listą życzeń. Kuszące jest rozpoczęcie rozwiązywania problemów z poziomu UX Builder, ale element prawdopodobnie działa poprawnie. Sprawdź zamiast tego stronę na żywo i sprawdź ją dwukrotnie: raz jako wylogowany użytkownik i raz jako klient.
Która strona powinna zawierać element listy życzeń
Dla większości sklepów odpowiedzią jest strona listy życzeń utworzona przez wtyczkę podczas aktywacji. Jest ona już połączona z resztą wtyczki, więc nic innego nie wymaga zmian.
Możesz również umieścić element na nowej stronie lub na więcej niż jednej. Działa on na każdej stronie, którą UX Builder edytuje bezpośrednio. Nasi deweloperzy sprawdzili specjalnie stronę, która nie była stroną listy życzeń, i lista życzeń załadowała się również tam.
Jeśli przeniesiesz listę życzeń na nową stronę, zaktualizuj jedno ustawienie. W sekcji SaveTo Wishlist > Ustawienia, wskaż pole listy rozwijanej Strona przekierowania na nową stronę. Tam trafiają klienci po zapisaniu produktu, gdy przycisk jest ustawiony tak, aby ich przekierować.
Utrzymaj adres URL strony listy życzeń stabilny, gdy klienci zaczną z niej korzystać. Niektórzy dodadzą ją do zakładek, a inni wkleją udostępnione linki do list życzeń w wiadomościach do przyjaciół i rodziny.
Jedno miejsce do unikania: bloki UX
Umieść element bezpośrednio na stronie. Nie umieszczaj go wewnątrz wielokrotnego użytku bloku UX, który jest pobierany przez inną część Twojej witryny.
Flatsome może osadzić blok UX pośrednio za pomocą odniesienia [block id="..."]. Znajdziesz je w stopkach opcji motywu, stopkach dla poszczególnych stron, blokach elementów menu i niestandardowych układach produktów.
Wtyczka decyduje, czy załadować aplikację listy życzeń, skanując własną zawartość strony. Nie może jednak zajrzeć do bloku przechowywanego gdzie indziej. Element nadal jest drukowany, ale skrypty i style listy życzeń nie ładują się razem z nim. Bez nich lista życzeń nie może działać poprawnie.
Chcesz listę życzeń w widocznym miejscu na stronie, takim jak nagłówek lub stopka? Zamiast tego dodaj link do menu na stronie listy życzeń. To jeden element menu i działa na każdej stronie.
Jak potwierdzić, że Twoja lista życzeń w Flatsome działa
Przeprowadź te kontrole raz po konfiguracji, a następnie ponownie po każdej dużej aktualizacji Flatsome. Odzwierciedlają one scenariusze, które nasi deweloperzy zweryfikowali ręcznie.
- Wylogowany: Otwórz stronę w oknie prywatnym. Powinieneś zobaczyć listę życzeń gościa, o ile listy życzeń gości są włączone.
- Jako klient: Zaloguj się na konto klienta testowego, zapisz produkt, a następnie otwórz stronę. Produkt powinien być na liście.
- Jako administrator, poza kreatorem: Powinieneś zobaczyć aktywną listę życzeń, nigdy pole zastępcze.
- Moje konto: Otwórz zakładkę Lista życzeń w sekcji Moje konto. Powinna ona również wyświetlać aktywną listę życzeń.
- Udostępniony link: Uczyń testową listę publiczną, udostępnij ją, a następnie otwórz link wylogowany. Powinna wyświetlić tę listę.
Jeden przypadek brzegowy jest już dla Ciebie obsłużony. Linki podglądu kreatora UX zawierają parametr URL. Klient, który podąża za jednym z nich, nadal widzi swoją listę życzeń. Pole zastępcze jest wyświetlane tylko użytkownikom, którzy mogą edytować posty.
Gość, który jeszcze niczego nie zapisał, widzi pusty stan, co jest normalne. Jeśli goście w ogóle nie otrzymują listy życzeń, sprawdź, czy opcja Wyłącz listę życzeń gościa jest wyłączona. Możesz również dostosować stronę listy życzeń gościa, jeśli wydaje się zbyt pusta.
A co z przyciskiem Zapisz do listy życzeń w Flatsome?
Przycisk Zapisz do listy życzeń nie wymaga integracji. Łączy się ze standardowymi szablonami produktów WooCommerce, a szablony Flatsome uruchomiły te haki podczas naszych testów.
Nasz deweloper testował to na Flatsome 3.15.5. Przycisk renderował się na wszystkich 12 kartach sklepu i na stronie pojedynczego produktu. Na tym testowym sklepie przycisk sklepu znajdował się w obszarze ceny Flatsome na każdej karcie. Tam właśnie umieszcza się przycisk nad przyciskiem Dodaj do koszyka.
W przeciwieństwie do Woostify i Blocksy, Flatsome nie otrzymuje stylizacji przycisków specyficznych dla motywu. Wybierz swoje umiejscowienie w sekcji SaveTo Wishlist > Ustawienia > Umiejscowienie i style przycisków. Nie testowaliśmy każdego umiejscowienia na Flatsome, więc sprawdź swoje na stronie sklepu, stronie produktu i telefonie.
Poprawne umiejscowienie przycisku ma znaczenie, ponieważ większość koszyków nie dociera do kasy. Według badań Baymard Institute nad porzucaniem koszyków, średni udokumentowany wskaźnik porzucania wynosi 70,22% w 50 badaniach. Widoczny przycisk listy życzeń daje tym kupującym miejsce do odłożenia produktu. Daje to Tobie sposób na odzyskanie części tych sprzedaży.
Czy umiejscowienie zagraca Twoje karty Flatsome? Możesz ukryć przycisk na jednym typie strony i zachować go na drugim.
Często zadawane pytania
Czy integracja SaveTo Wishlist wymaga SaveTo Wishlist Pro?
Nie. Element Zapisz do listy życzeń jest dostarczany w darmowej wtyczce SaveTo Wishlist Lite, wersji 1.1.3 i nowszych. Zainstaluj lub zaktualizuj darmową wtyczkę. Element pojawi się wtedy w grupie Treść kreatora UX, gdy Flatsome jest aktywny.
Dlaczego moja strona z listą życzeń jest pusta po edycji w UX Builder?
Strona UX Buildera zapisuje własny układ, składający się z krótkich kodów shortcode. Jeśli przebudujesz stronę bez naszego elementu, ten układ nie będzie miał krótkiego kodu [saveto_wishlist] do wyświetlenia listy życzeń. Dodaj element Save to Wishlist z selektora elementów, a następnie ponownie zapisz stronę.
Czy nadal mogę używać krótkiego kodu listy życzeń w sklepie Flatsome?
Tak, na stronach, których nie edytujesz za pomocą UX Buildera. Krótki kod shortcode działa w edytorze bloków jak zwykle, zgodnie z naszym przewodnikiem po krótkich kodach shortcode dla list życzeń. W układzie UX Buildera użyj zamiast tego elementu. Działa on pod spodem z tym samym krótkim kodem shortcode, z odpowiednim panelem opcji.
Czy moi klienci kiedykolwiek zobaczą zastępczy element budowniczego?
Nie. Zastępczy element pojawia się tylko w UX Builder i tylko dla zalogowanych użytkowników, którzy mogą edytować posty. Każdy, kto przegląda stronę na żywo, w tym Ty, widzi prawdziwą listę życzeń.
Gotowy do dodania listy życzeń do Flatsome?
Strona listy życzeń jest warta swojej ceny tylko wtedy, gdy faktycznie się renderuje. W Flatsome sprowadza się to do jednego wyboru. Zbuduj stronę za pomocą elementu Save to Wishlist, a nie krótkiego kodu shortcode, który UX Builder nadpisze.
- Dowiedz się, dlaczego strona staje się pusta, zanim cokolwiek przebudujesz.
- Dodaj element Save to Wishlist do swojej strony listy życzeń w UX Builderze.
- Nie umieszczaj go w blokach UX i zamiast tego połącz się ze stroną ze swojej stopki.
- Przeprowadź pięć kontroli jako gość, klient i administrator.
Twoja lista życzeń w Flatsome jest o jeden element od poprawnego działania. Zainstaluj lub zaktualizuj SaveTo Wishlist Lite i dodaj ją do swojej strony listy życzeń już dziś.
