Jak dostosować galerię produktów WooCommerce
Opublikowany: 2022-01-25Dostosowanie galerii produktów w sklepie internetowym może być świetnym sposobem na poprawę doświadczenia odwiedzających, widoczności produktów i współczynników konwersji. Aby Ci w tym pomóc, przygotowaliśmy nasz przewodnik dotyczący dostosowywania galerii produktów w WooCommerce .
Ale zanim przejdziemy do tego procesu, spójrzmy, dlaczego w skrócie trzeba dostosować galerię produktów w WooCommerce.
Po co dostosowywać galerię produktów w WooCommerce?
Jednym z głównych punktów sprzedaży internetowej firmy są zdjęcia produktów. A jeśli dodasz i dostosujesz galerię produktów, poprawisz wygląd swojego sklepu internetowego . Po ulepszeniu wyglądu, przyciąga on więcej potencjalnych nabywców .
Podobnie klient może chcieć ocenić produkt z kilku perspektyw. Mogą chcieć mieć jaśniejszą perspektywę, zanim je kupią, w którym galeria produktów może być przydatna. Dlatego dostosowanie galerii produktów może również pomóc w utrzymaniu lepszego doświadczenia klienta.
Jeśli więc chcesz zwiększyć swoje przychody, zalecamy dostosowanie galerii produktów WooCommerce. Teraz, gdy masz już pojęcie o jego znaczeniu, zobaczmy, jak możemy dostosować je do Twojej witryny WooCommerce.
Jak dostosować galerię produktów WooCommerce?
Możesz dostosować galerię produktów w WooCommerce za pomocą 2 metod :
- Z pulpitu nawigacyjnego WooCommerce
- Korzystanie z wtyczki
Omówimy szczegółowo każdy krok w obu poniższych metodach, abyś mógł wybrać preferowany sposób. Wcześniej upewnij się, że poprawnie skonfigurowałeś WooCommerce i zainstaluj jeden z kompatybilnych motywów WooCommerce.
1. Dostosuj galerię produktów z pulpitu nawigacyjnego WooCommerce
WooCommerce to najpopularniejsza platforma do tworzenia sklepu internetowego. Jednym z powodów, dla których WooCommerce jest tak popularny, jest niekończąca się personalizacja , kontrola nad projektem i zarządzaniem wirtualnym sklepem.
Możesz łatwo dostosować galerię produktu z samego pulpitu WooCommerce. Ale najpierw musisz otworzyć stronę edycji produktu, w której chcesz dostosować galerię produktów.
Przejdź do Produkty > Wszystkie produkty z pulpitu administracyjnego WordPress. Będziesz mógł zobaczyć listę wszystkich produktów na swojej stronie. Tutaj możesz dodać nowe produkty lub usunąć istniejący, importować lub eksportować produkty, a także indywidualnie dostosowywać jeden lub wiele produktów jednocześnie.
Następnie kliknij Edytuj dla produktu, w którym chcesz dostosować galerię produktów.
Zostaniesz przekierowany do strony edycji produktu danego produktu. Teraz możesz zacząć dostosowywać galerię produktów WooComemrce. Galerię produktów można dodać, zmienić kolejność lub usunąć z tego edytora tutaj.
1.1. Dodaj galerię produktów w WooCommerce
Po otwarciu strony edycji produktu, jeśli przewiniesz dalej, zobaczysz sekcję Galeria produktów na prawym pasku bocznym. Kliknij link Dodaj zdjęcia z galerii produktów, aby dodać galerię produktów.
Po kliknięciu zostaniesz przekierowany do modalu, w którym możesz przesłać nowe obrazy lub wybrać istniejące z biblioteki multimediów.
Możesz wybrać jeden lub wiele produktów, które chcesz dodać do galerii produktów. Po prostu wybierz obrazy, które chcesz dodać do galerii i kliknij Dodaj do galerii .
Po zakończeniu dodawania galerii produktów przejdź dalej i zaktualizuj stronę produktu.
Gdy odświeżysz stronę produktu, będziesz mógł zobaczyć galerię nowego produktu.
1.2. Zmień kolejność produktów w galerii
W niektórych przypadkach możesz chcieć zmienić kolejność produktów. Aby to zrobić, ponownie otwórz stronę edycji produktu produktu z pulpitu WordPress. Następnie po prostu przeciągnij i upuść produkty na pozycje, w których chcesz, aby produkt był wyświetlany.
Na koniec kliknij przycisk Aktualizuj po ponownym zamówieniu produktów.
1.3. Usuń produkty z galerii
Możesz także usunąć produkty z galerii jednym kliknięciem myszy. Po prostu ponownie przejdź do miniatur obrazów na stronie edycji produktu z pulpitu nawigacyjnego.
Gdy tylko przejdziesz do miniatury, nad miniaturą pojawi się ikona krzyżyka. Kliknij ikonę usuwania obrazu , aby usunąć dowolny produkt z galerii produktów.
Jeśli jednak chcesz usunąć całą galerię produktów, będziesz musiał usunąć wszystkie produkty z galerii jeden po drugim.
Otóż to! Są to wszystkie podstawowe dostosowania, które możesz zaimplementować w swojej witrynie za pomocą domyślnego pulpitu nawigacyjnego WooCommerce.
2. Dostosuj galerię produktów WooCommerce za pomocą wtyczki
Teraz wiemy, że naprawdę łatwo jest dodawać, usuwać i zmieniać kolejność produktów w galerii produktów. Ale to tylko niektóre podstawowe dostosowania oferowane przez WooCommerce. Mają bardzo ograniczone opcje dostosowywania i mogą nie zawsze wystarczać dla Twojej witryny.
Jeśli jednak potrzebujesz dodatkowych dostosowań do galerii produktów, możemy użyć niesamowitych wtyczek filtrów produktów.
Tutaj wymieniliśmy kilka wtyczek do dostosowywania galerii produktów w WooCommerce. Każdy z nich posiada unikalną cechę i funkcjonalność.
Suwak Galerii Produktów dla WooCommerce
Product Gallery Slider dla WooCommerce to najlepsza wtyczka freemium. Jak sama nazwa wskazuje, ta wtyczka umożliwia dodanie karuzeli w sekcji galerii WooCommerce. Oferuje ponad 10 opcji dostosowywania, a ta wtyczka działa z większością motywów WordPress.
Dodatkowo ta wtyczka obsługuje narzędzia do tworzenia stron Elementor i Visual Composer, które zapewniają całkowitą kontrolę nad projektem witryny WooCommerce. Możesz również otrzymać moduł lightbox, który pozwala dodawać efekty slajdów, powiększać obrazy i wyświetlać miniatury, aby przyciągnąć klientów.
Kluczowe cechy
- Dostępne są 3 różne układy galerii
- Obsługuje wideo w galerii produktów
- Obsługuje język RTL
- Gotowy na krótki kod
Cena £
Product Gallery Slider dla WooCommerce to wtyczka freemium, która kosztuje 39 USD rocznie.
Galeria wideo produktów WooCommerce
Za pomocą Galerii wideo produktów WooCommerce możesz osadzać filmy w galerii produktów wraz ze zdjęciami. Obsługuje zarówno filmy Youtube i Vimeo, jak i filmy w formatach MP4, WebM i Ogg. Ma świetny, przyjazny dla użytkownika interfejs do osadzania wideo w witrynie WooCommerce.
Ale haczyk polega na tym, że możesz użyć tylko jednego filmu na galerię produktów. Co więcej, możesz także zezwolić na odtwarzanie wideo w trybie powtarzania, który tworzy pętlę wideo.
Kluczowe cechy
- Pionowy i poziomy układ suwaków
- Dostosuj wysokość na podstawie obrazów
- Gotowy na krótki kod
- Kompatybilny z kreatorem Elementor i Divi
Cena £
Galeria wideo produktów WooCommerce to narzędzie freemium. Ma darmową wersję z podstawowymi funkcjami i 3 planami premium, które zaczynają się od 25 USD rocznie.
Teraz, gdy wymieniliśmy kilka opcji, przejdźmy dalej i zainstaluj jedną z nich, aby dostosować galerię produktów w WooCommerce.
W tej demonstracji użyjemy suwaka galerii produktów dla WooCommerce opracowanego przez Codeixer. Jest to wtyczka freemium, która zapewnia prezentację Twoich produktów w pięknym stylu.
2.1. Zainstaluj wtyczkę
Aby zainstalować wtyczkę, przejdź do pulpitu nawigacyjnego WP Admin i przejdź do Wtyczki> Dodaj nowy.
Wyszukaj słowa kluczowe wtyczki Product Slider for WooCommerce Następnie kliknij przycisk Zainstaluj teraz , aby zainstalować wtyczkę. Na koniec aktywuj go po zakończeniu instalacji.
Jeśli chcesz korzystać z wtyczki premium, musisz przesłać plik zip i zainstalować go na swojej stronie internetowej. Więcej informacji na ten temat znajdziesz w naszym przewodniku dotyczącym ręcznej instalacji wtyczki WordPress.
2.2. Dostosuj galerię produktów
Po aktywacji wtyczki możesz zacząć używać jej do dostosowywania galerii produktów. Po prostu przejdź do Codeixer > Opcje galerii z pulpitu WordPress.
Powinny być widoczne dwa ustawienia: Opcje ogólne i Opcje Lightbox .
Chociaż wszystkie opcje nie są dostępne w darmowej wersji wtyczki, zapewnia ona wystarczająco dużo, aby dostosować wszystko do swoich potrzeb.
2.2.1. Opcje ogólne
Opcje Ogólne obejmują wszystkie podstawowe dostosowania, które można wykonać w galerii produktów.
Dodaj suwak karuzeli
W opcjach ogólnych będziesz mógł zobaczyć Autoodtwarzanie suwaka . Wybierz opcję Tak z menu rozwijanego, aby automatycznie dodać suwak karuzeli bez żadnych dodatkowych poprawek.
Zdjęcie produktu Zoom
Posiadanie funkcji powiększania produktu pozwala klientowi zobaczyć szczegółowy widok towarów i zapewnia lepszą prezentację wizualną .
Aby włączyć funkcję powiększania dla swoich produktów w galerii produktów, po prostu wybierz Tak w menu rozwijanym z opcji Powiększenie obrazu .
Suwak Strzałki i przycisk
Możesz także dostosować strzałki i przycisk suwaka, zmieniając ich kolor, aby pasował do Twojej witryny WooCommerce.
Aby to zrobić, znajdziesz Kolor ikony w opcji Ogólne. Wybierz dowolny kolor z próbnika kolorów.
Po wybraniu koloru zapisz zmiany .
Oprócz tego w ustawieniach ogólnych możesz również ustawić:
- Włącz/wyłącz ikonę nawigacji
- Liczba miniatur do wyświetlenia
- Nieskończenie przesuwaj produkt
- Przesuń obraz podczas przeciągania myszą
2.2.2. Opcje Lightbox
W zakładce lightbox w wersji darmowej znajdują się dwa ustawienia.
Możesz wybrać wyświetlanie lub ukrywanie atrybutów obrazu jako podpisu w ustawieniu lightbox. Podobnie możesz ustawić kolor tła lightboxa, aby nadać swoim produktom profesjonalny wygląd.
Wszystkie te zmiany możesz zobaczyć w galerii produktów po podglądzie strony produktu.
Dobra robota! W ten sposób dostosowujesz galerię produktów w WooCommerce.
Bonus: Dodaj niestandardowe rozmiary obrazów w WordPress
Dodawanie obrazów do postów i stron na blogu jest łatwe dzięki WordPress. Należy jednak wybrać odpowiedni rozmiar obrazu , aby ogólny układ witryny wyglądał dobrze.
Bardzo ważne jest, aby zrozumieć, jak działają rozmiary obrazów w witrynach WordPress i jak dodawać niestandardowe rozmiary obrazów do witryny. Jeśli wybierzesz niewłaściwy rozmiar, Twoje obrazy mogą wyglądać na rozmyte, a jeśli Twoje obrazy są zbyt duże, mogą spowolnić działanie Twojej witryny. Nieprawidłowe rozmiary obrazu mogą również zepsuć układ strony lub posta na blogu i powodować niepotrzebne przewijanie strony.
Ale WordPress ma wbudowane ustawienie dla różnych rozmiarów obrazów. Oni są:
Rozmiar miniatury: 150 x 150 pikseli
Średni rozmiar: 300 x 300 pikseli
Największy rozmiar: 1024 x 1024 pikseli
Pełny rozmiar: domyślnie oryginalny rozmiar przesłanego obrazu.
Gdy przesyłasz obraz do WordPress, te cztery różne rozmiary obrazów są tworzone domyślnie.
Powód, dla którego WordPress tworzy te rozmiary obrazów, jest dwojaki. Po pierwsze, nie musisz ręcznie zmieniać rozmiaru obrazów. Po drugie, zapewnia wybór prawidłowego rozmiaru obrazu dla różnych lokalizacji w witrynie.
Jak zmieniać rozmiar i edytować obrazy w WordPress
Na szczęście WordPress pozwala również na zmianę rozmiaru domyślnych obrazów. Aby to zrobić, po prostu przejdź do Ustawienia > Multimedia .
Jak widać na zrzucie ekranu, są tam wymienione wszystkie standardowe rozmiary obrazów. Możesz je łatwo dostosować, wprowadzając preferowane wymiary.
Po dostosowaniu domyślnych rozmiarów obrazu WordPress do preferowanych wymiarów, kliknij Zapisz zmiany . W przyszłości wszystkie obrazy, które prześlesz do swojej witryny, zostaną dostosowane do nowych wymiarów.
To wszystko! Możesz teraz zmienić rozmiary obrazów w swojej witrynie WordPress. Ale jeśli chcesz uzyskać więcej informacji na ten temat, zapoznaj się z naszym obszernym postem na temat dodawania niestandardowych rozmiarów obrazów w WordPress.
Wniosek
Dostosowanie galerii produktów WooCommerce to jeden z najlepszych sposobów na przyciągnięcie uwagi klientów i przekształcenie ich w potencjalnych nabywców. Jeśli więc potrzebujesz dostosować galerię produktów, zrób to od razu, aby zwiększyć konwersję .
Podsumowując, możesz dostosować galerię produktów w WooCommerce na dwa główne sposoby:
- Z pulpitu nawigacyjnego WooCommerce
- Korzystanie z wtyczki
Możesz użyć wtyczki, jeśli potrzebujesz zaawansowanego dostosowania do kuchni produktu, ponieważ WooCommerce oferuje kilka i bardzo podstawowych opcji dostosowywania. W przypadku niektórych osób te funkcje mogą wystarczyć, jeśli chcesz tylko dodać lub usunąć produkty w galerii produktów.
Niemniej jednak wszystko sprowadza się do Twoich preferencji i potrzeb, ponieważ obie te metody można wykorzystać do dostosowania galerii produktów. Ale dla nas suwak produktu dla WooCommerce jest najlepszy, jeśli chodzi o dostosowywanie galerii produktów za pomocą wtyczki, ponieważ ma wiele przydatnych funkcji nawet w wersji darmowej.
Mamy nadzieję, że możesz z łatwością dostosować galerię produktów WooCommerce. Jeśli ten przewodnik okazał się pomocny, oto kilka artykułów, które mogą Cię zainteresować:
- Jak dostosować stronę produktu WooCommerce?
- Najlepsze wtyczki do dostosowania strony produktu WooCommerce
- Jak dostosować szablon strony produktu WooCommerce?
To tyle w tym artykule! Mamy nadzieję, że pomogliśmy Ci dostosować galerię produktów w WooCommerce. Jeśli wystąpiły jakieś problemy, daj nam znać w sekcji komentarzy. Chętnie Ci pomożemy.