Instalacja
Ważne informacje
Wtyczka daje możliwość ustawienia zniżki tylko dla głównej waluty sklepu.
Sekcję Quick Cross-Sells można dodawać tylko w produktach o typach Prosty i Produkt z wariantami.
W sekcji Quick Cross-Sells można promować tylko produkty Proste oraz konkretne warianty Produktu z wariantami.
Możliwości wtyczki
Wtyczka pozwala na wybranie produktów promowanych w sekcji cross-sellingowej. Tzn. polecanie na stronie produktu towarów uzupełniających względem niego.
Sekcja Quick Cross-Sells wyświetla się na stronie produktu, tuż nad przyciskiem Dodaj do koszyka. W sekcji możemy wskazać dowolną ilość produktów uzupełniających.
Wtyczka umożliwia również oferowanie rabatów na produkty z sekcji Quick Cross-Sells, przyznawanych klientowi, gdy doda do koszyka produkt główny wraz z produktem uzupełniającym.
Rodzaje rabatów
Rabat można skonfigurować dla każdego podpiętego produktu osobno.
- Dostępne opcje:
- Procentowy rabat,
- Kwotowy rabat,
- Brak rabatu – opcja, która oferuje produkt po jego normalnej cenie.
Ustawienia główne
Konfiguracja wtyczki zlokalizowana jest w menu WooCommerce > Ustawienia > Produkty > WooCommerce Quick Cross-Sells. Link do tej strony znajduje się również na liście zainstalowanych wtyczek.
Domyślny tytuł sekcji Quick Cross-Sells
Funkcja pozwala na ustawienie wspólnego tytułu sekcji dla wszystkich produktów, w których sekcja Quick Cross-Sells jest aktywna. Ponadto, z poziomu każdego z produktów, można wybrać indywidualny tytuł, nadpisując tę domyślną wartość.
Jeśli pozostawisz to pole puste, tytuł sekcji nie będzie się wyświetlał w żadnym produkcie (o ile nie zostanie wskazany dla konkretnego produktu).
Obrazki produktów
W zależności od potrzeb i układu elementów na stronie produktu możemy włączyć lub wyłączyć widoczność obrazków produktów w sekcji Quick Cross-Sells.
Jest to opcja globalna.
Przykład z włączonymi oraz wyłączonymi obrazkami.
Włącz rabaty z kuponami
Domyślnie rabaty z wtyczki Quick Cross-Sells nie są udzielane w momencie gdy, w koszyku zostanie wprowadzony kupon rabatowy. Jednak, jeśli istnieje taka potrzeba, można globalnie zezwolić na stosowanie rabatów z wtyczki razem z rabatami z kuponów rabatowych WooCommerce.
Ustawienia na stronie produktu
Wybieranie promowanych produktów
Aby dodać produkt uzupełniający do sekcji Quick Cross-Sells na stronie danego produktu, należy przejść do ustawień tego produktu.
Konfiguracja sekcji Quick Cross-Sells na stronie produktu znajduje się w panelu Dane produktu, w zakładce Powiązane produkty.
Konfigurację rozpoczynamy od kliknięcia przycisku Dodaj produkt.
Pole Produkt skonfigurowane jest jak jako wyszukiwarka. Należy wpisać co najmniej trzy znaki szukanego produktu.
Zarządzanie kolejnością wyświetlanych produktów
Możemy również zarządzać kolejnością produktów, zmieniając ich pozycję metodą Drag & Drop. W tym celu najedź na belkę z tytułem produktu, a następnie kliknij i przeciągnij kartę produktu w górę lub w dół.
Kolejność wybrana na stronie edycji produktu odzwierciedla kolejność ich wyświetlania, którą klient widzi na stronie produktu.
Ponadto, po najechaniu na belkę z tytułem produktu, wyświetla się przycisk usuwania danego produktu z sekcji Quick Cross-Sells.
Call-to-action produktu – podtytuł dla produktu dodanego do sekcji Quick Cross-Sells
Dla każdego z podpiętych produktów można ustawić dodatkowy tytuł – call-to-action. Pomaga to wzmocnić przekaz marketingowy lub wytłumaczyć, dlaczego warto dokupić także ten produkt.
Przykładowo, sklep sprzedający soczewki kontaktowe proponuje, dodatkowo do nich, jeszcze płyn.
Nad płynem pojawi się tytuł CTA "67% klientów wybiera płyn do soczewek przy zakupie soczewek":
Konfiguracja rabatu
Wtyczka pozwala na ustawienie rabatu procentowego lub kwotowego.
Zatem, aby ustawić rabat procentowy należy najpierw ustawić wartość pola Typ rabatu na Procentowy rabat. Analogicznie, chcą ustawić stałą wartość rabatu należy wybrać opcję Kwotowy rabat.
Następnie należy podać wartość udzielanego rabatu. Nie należy wpisać żadnych dodatkowych znaków oprócz wartości liczbowej rabatu.
Jeśli nie chcemy udzielać rabatu dla tego produktu, to wystarczy ustawić opcję Brak. W takim wypadku, produkt będzie oferowany po swojej normalnej cenie.
Algorytm obliczania rabatu w koszyku
Wtyczka modyfikuje cenę produktów w koszyku podpiętych pod segmenty Cross Sells. Jeśli udzielamy rabatu na produkt, to będzie on udzielany bez względu na to, czy produkty zostały dodane do koszyka jednocześnie, czy też osobno. Liczy się ich wspólna obecność w koszyku.
Poniżej przedstawiamy kilka przykładów dla różnych par produktów w koszyku. Rodzic to produkt główny, do którego dopina się Dzieci.
Algorytm zawsze oblicza zniżki na korzyść klienta. W przypadku krzyżowania się zniżek z różnych produktów typu rodzic, gdy dwa produkty mają ustalone rabaty wzajemnie na siebie, w koszyku zostanie przydzielony jeden, najkorzystniejszy rabat ze wszystkich dostępnych rodziców.
- Przykłady kombinacji rabatów w koszyku:
- Rodzic A x1, Rodzic B x1, Dziecko C x2 – w obu produktach jest ustawiona różna cena Dziecka C. Jaka jest suma? – Jedna cena dziecka z Rodzica A, druga z Rodzica B
- Rodzic A x1, Rodzic B x1, Dziecko C x1 – w obu produktach jest ustawiona różna cena Dziecka C. Jaka jest suma? – Na korzyść klienta, z tańszego wariantu dziecka
- Rodzic A x1, Rodzic B x1, Dziecko C x3 – w obu produktach jest ustawiona różna cena Dziecka C. Jaka jest suma? – Jedna cena z Rodzica A, druga cena z Rodzica B, a nadwyżki ilości produktów są po cenie standardowej
Jak na stronie Koszyka wygląda udzielona zniżka?
Jeśli dostępna jest zniżka na jeden z produktów, to dany produkt będzie miał przekreśloną cenę normalną, a nowa, niższa cena będzie wyróżniona obok.
Najczęstsze pytania
Czy jeśli produkt ma wskazaną cenę promocyjną, to zadziała również zniżka przyznawana przez wtyczkę Quick Cross-Sells?
Tak. W takim przypadku zniżki są obliczane od ceny promocyjnej. Natomiast w koszyku przekreślona jest pierwotna cena produktu.
Czy zniżki się powtarzają?
Tak. Jeśli mamy Rodzica A x2 i Dziecko C x2, to rabat przyzna się dla obu dzieci, bo liczba rodziców odpowiada liczbie dzieci.
Zatem zniżka na produkt Dziecko doda się tyle razy, ile w koszyku równocześnie znajduje się produktów Rodziców.
Przykłady konfiguracji – usecase
Wtyczka Quick Cross-Sells pomaga zwiększać średnią wartość koszyka, poprzez zwiększanie ilości produktów w zamówieniu. By zwiększyć swoje obroty, dobierz produkty komplementarne do siebie. Np.
Sprzedając telefon komórkowy dodaj do sekcji kartę pamięci, ładowarkę do samochodu, etui oraz power bank. W skrócie wszystko to, co może okazać się przydatne razem z nowym telefonem.
Sprzedając produkty spożywcze, możesz proponować do produktu głównego składniki, które razem stworzą zestaw na obiad.
Konfiguracja: Modyfikacja tytułu sekcji tylko dla tego produktu. Brak zniżki na produkt dodany do sekcji Quick Cross Sells
Przykłady stylowania sekcji Quick Cross-Sells
Wygląd sekcję Quick Cross-Sells można dostosowywać przy pomocy własnego kodu CSS.
We wtyczce korzystamy ze standardowych modułów WooCommerce, dzięki czemu sekcja Quick Cross-Sells będzie od razu wyglądała spójnie ze stroną produktu w Twoim motywie.
Możesz nadać dowolny styl dla sekcji QCS, zmieniając np. kolory, krój pisma, itp.
Jeśli nie wiesz, jak modyfikować kod CSS Twojego motywu lub motywu potomnego, możesz skorzystać z wbudowanej w WordPressa funkcji dodania własnego kodu CSS.
W tym celu wejdź w zakładkę Wygląd > Dostosuj > Dodatkowy CSS.
Zmiana wielkości tekstów w sekcji Quick Cross-Sells
Wklejony kod CSS zmieni wielkości tytułu produktu w sekcji Quick Cross-Sells do 14px.
.single-product div.product table.shop_table.wcqcs-cross-sells a.wcqcs-cross-sell-item-name {
font-size: 14px;
}
Zmiana wielkości ceny regularnej.
.single-product div.product table.shop_table.wcqcs-cross-sells p.price del,
.single-product div.product table.shop_table.wcqcs-cross-sells p.price del span {
font-size: 14px;
}
Zmiana wielkości nagłówka sekcji Quick Cross-Sells.
.single-product div.product h3.wcqcs-cross-sells-section-title {
font-size: 14px;
}
Zmiana wielkość CTA konkretnego produktu
.single-product div.product table.shop_table.wcqcs-cross-sells h4.wcqcs-cross-sell-item-cta {
font-size: 14px;
}
Podobnie, modyfikując powyższe przykłady, w miejsce linii font-size: 14px; możesz przykładowo wstawić np. color: #ff0000;, aby nadać elementowi czerwony kolor tekstu.
Usunięcie obramowania tabeli produktów w segmencie Quick Cross-Sells
.single-product div.product table.shop_table.wcqcs-cross-sells,
.single-product div.product table.shop_table.wcqcs-cross-sells td {
border: none;
}