Jak dostosować stronę sklepu WooCommerce w 2 prostych krokach?

Opublikowany: 2021-10-14

WooCommerce zaoferuje Ci domyślną stronę sklepu dla Twojego wirtualnego sklepu. Ale mają ograniczone możliwości dostosowywania. Poza tym wstępnie zbudowana strona sklepu WooCommerce nie jest dobrze zoptymalizowana pod kątem współczynnika konwersji. Dobra konwersja zapewnia dobrze zaprojektowaną stronę sklepu WooCommerce.

Czy wiesz, że tylko 22% branż jest zadowolonych ze współczynnika konwersji?

Teraz chcę ci zadać pytanie. Czy chcesz być częścią 22% szczęśliwych branż lub nieszczęśliwych 78% branż? Decyzja jest twoja. Jeśli tak, konieczne jest dostosowanie strony sklepu za pomocą kodowania lub korzystania z kreatora WooCommerce. Nie używajmy tutaj kodowania, ponieważ potrzebujesz do tego dobrej wiedzy o kodowaniu. Przejdź więc do kreatora WooCommerce, aby dostosować stronę swojego sklepu. Oto kolejne zadanie, wybór najlepszego kreatora WooCommerce.

ShopEngine to pełne rozwiązanie dla Twoich stron WooCommerce, ponieważ po użyciu tej wtyczki nie potrzebujesz innych wtyczek. Ta jedna wtyczka zapewni rozwiązania do porównywania produktów, próbek odmian, listy życzeń, szybkiego podglądu, szybkiego kasy, zaległych zamówień, odznak, powiadomień o sprzedaży, płatności częściowych i wielu innych. Poza tym możesz całkowicie dostosować te opcje. Dlatego korzystanie z tej wtyczki jest opłacalne i przyjazne dla użytkownika.

Dlatego na tym blogu omówię, jak stworzyć własną stronę sklepu WooCommerce za pomocą ShopEngine , który jest najlepszym darmowym narzędziem dla WordPressa.

Ukryj zawartość
1 Co to jest strona sklepu WooCommerce?
2 Co jest nie tak z domyślną stroną sklepu WooCommerce?
3 korzyści, które otrzymasz z nowej, dostosowanej strony sklepu WooCommerce
4 Jak dostosować stronę sklepu WooCommerce za pomocą ShopEngine?
4.1 Krok #1: Utwórz szablon strony sklepu.
4.2 Krok #2: Dostosuj szablon strony sklepu WooCommerce za pomocą ShopEngine.
5 Dlaczego warto używać ShopEngine jako kreatora stron WooCommerce?
6 Gdzie szukać szablonu strony sklepu WooCommerce?
7 Zawijanie:

Co to jest strona sklepu WooCommerce?

Strona sklepu WooCommerce
Strona sklepu WooCommerce

Strona sklepu WooCommerce to najważniejsza strona Twojej witryny, na której zaprezentujesz wszystkie swoje produkty lub usługi. Gdy jakikolwiek klient trafi na Twoją witrynę, aby kupić produkty lub usługi, bezpośrednio odwiedzi stronę Twojego sklepu.

Możesz powiedzieć, że jest sercem Twojej witryny, ponieważ Twój sukces będzie zależał od tej strony. Ponieważ po odwiedzeniu tej strony i obejrzeniu produktów, zdecydują, czy kupić Twoje produkty, czy nie. Dlatego Twoja strona sklepu WooCommerce musi być przyjazna dla użytkownika i dobrze zaprojektowana.

Co jest nie tak z domyślną stroną sklepu WooCommerce?

Twoja strona sklepu WooCommerce odgrywa kluczową rolę w zwiększaniu współczynnika konwersji. Musisz więc zawsze pamiętać, że strona Twojego sklepu musi być dobrze zoptymalizowana. Oto kwestia korzystania z domyślnej strony sklepu WooCommerce. Ponieważ domyślna strona sklepu WooCommerce nie jest dobrze zoptymalizowana pod kątem zwiększania współczynnika konwersji .

Wyobraź sobie siebie na miejscu swojego klienta. Czego oczekujesz od strony internetowej jako klient w momencie zakupu produktu?

Oczywiście prosty i przejrzysty projekt, dzięki któremu można łatwo wyszukiwać i znajdować produkty. Twoja domyślna strona sklepu WooCommerce nie nadaje się do tego.

76% Twoich klientów chce mieć prosty projekt strony internetowej zamiast złożonego i mylącego projektu. Nazwa źródła — HubSpot.com

To pokazuje, jak ważne jest to dla Twoich klientów. Teraz spójrz na domyślną stronę WooCommerce i sprawdź ją. Czy zarabia Twoje docelowe przychody? Jeśli nie, przygotuj się na dostosowanie strony sklepu WooCommerce za pomocą wtyczki do strony sklepu Elementor i WooCommerce o nazwie ShopEngine .

Ale wcześniej sprawdźmy dokładnie, jakie korzyści uzyskasz po zmianie strony sklepu WooCommerce.

Korzyści, które otrzymasz z nowej dostosowanej strony sklepu WooCommerce

Nadszedł czas, aby sprawdzić korzyści, zanim włożysz swój czas i ciężką pracę. Zobacz, dlaczego musisz dostosować stronę sklepu WooCommerce:

  • Strona sklepu o wysokiej konwersji, która znacząco zmieni Twój ROI.
  • Doskonałe wrażenia użytkownika.
  • Dobrze zoptymalizowany pod kątem SEO i różnych urządzeń.
  • Szansa na zwiększenie liczby użytkowników.
  • Strona sklepu, która dobrze wyróżnia się w konkurencyjnym świecie eCommerce.
  • Szybkie ładowanie strony sklepu.

Są to korzyści, które uzyskasz dzięki dobrze zoptymalizowanej stronie sklepu. Teraz, gdy znasz już korzyści, nadszedł czas, aby przejść do głównego tematu. Jak edytować stronę sklepu WooCommerce, aby uzyskać lepsze wrażenia użytkownika?

Kontynuuj kopanie, aby się dowiedzieć.

Jak dostosować stronę sklepu WooCommerce za pomocą ShopEngine?

Gdy nadejdzie personalizacja strony WooCommerce, nic nie przebije ShopEngine. ShopEngine to najlepsza wtyczka do tworzenia stron WooCommerce typu „przeciągnij i upuść” dostępna w WordPress. Jest dobrze znany ze względu na przyjazne dla użytkownika iw pełni konfigurowalne funkcje. Poza tym dostarcza zaawansowane moduły i widżety, które nadają się do zbudowania strony internetowej bez kodowania.

Oznacza to, że nie musisz zajmować się programowym dostosowywaniem strony sklepu WooCommerce. Teraz możesz pomyśleć o tym, gdzie znaleźć szablon strony sklepu WooCommerce?

ShopEngine zawiera również szablony stron sklepu WooCommerce i ponownie możesz je tworzyć. Więc bez obaw. Wystarczy wykonać następujące kroki, aby edytować stronę sklepu WooCommerce za pomocą ShopEngine, najłatwiejszego i najskuteczniejszego narzędzia do tworzenia stron WooCommerce:

Krok 1: Utwórz szablon strony sklepu.

Aby dostosować stronę sklepu WooCommerce, musisz utworzyć szablon strony sklepu. Przejdź do ShopEngine >> szablon kreatora, aby utworzyć nowy szablon strony sklepu WooCommerce.

Dostosowywanie strony sklepu WooCommerce
Tworzenie szablonu strony sklepu

Następnie kliknij przycisk Dodaj nowy, a następnie pojawi się pasek ustawień szablonu wyskakującego. Aby ustawić szablon strony sklepu, musisz podać następujące informacje:

  • Nazwa: Tutaj wpisz nazwę swojego sklepu Woo, którą wybrałeś dla swojej strony sklepu WooCommerce.
  • Typ: W tej luce musisz wybrać rodzaj szablonu, który chcesz utworzyć. Musisz wybrać sklep podczas tworzenia szablonu strony sklepu.
  • Ustaw domyślny: Włącz przycisk domyślny, jeśli chcesz dodać szablon domyślny. Włączam to, ponieważ użyję domyślnego.
  • Przykładowe projekty: Tutaj masz dwa projekty. Jeśli wybierzesz lewy, możesz edytować stronę swojego sklepu WooCommerce od podstaw. A jeśli wybierzesz właściwy, otrzymasz domyślny projekt szablonu strony sklepu. Nie musisz go edytować od zera. Tutaj wybieram domyślny przykładowy projekt. Następnie, aby go edytować, kliknij przycisk Edytuj za pomocą Elementora.
Tworzenie szablonu dla strony sklepu WooCommerce
Ustawienia szablonu strony sklepu

Teraz tworzenie szablonu strony sklepu jest zakończone. Czas więc przejść do właściwej części dostosowywania.

Krok #2: Dostosuj szablon strony sklepu WooCommerce za pomocą ShopEngine.

Po utworzeniu szablonu strony sklepu nadszedł czas na jego edycję. Aby go edytować, kliknij tytuł archiwum i dostosuj następujące opcje zgodnie z własnymi pragnieniami:

  • Znacznik HTML: wybierz znacznik, którego chcesz użyć do zarchiwizowania tytułu.
  • Wyrównanie: Tutaj możesz wybrać wyrównanie tytułu archiwum.
  • Kolor: wybierz odpowiedni kolor tytułu swojego archiwum.
  • Typografia: Edytuj typografię tytułu swojego archiwum. Tutaj możesz zmienić rodzinę, rozmiar czcionki, wysokość linii, wagę, przekształcić.
Edytuj tytuł archiwum w celu dostosowania strony sklepu

Następnie dostosuj kolejny widżet strony archiwum, czyli filtr produktu na stronę . Możesz dostosować następujące obszary dla swojego produktu na filtr strony:

  • Listy: Wpisz liczbę swoich stron do niego na stronie sklepu.
  • Typografia: Edytuj typografię produktu według filtra strony.
  • Odstępy: Dostosuj odstępy między liczbami.
  • Wyrównanie: Wybierz wyrównanie produktu według filtra strony.
  • Kolor: Tutaj możesz wybrać kolor widżetu.
  • Aktywny kolor: Możesz wybrać inny kolor dla aktywnej strony.
dostosuj stronę sklepu za pomocą widżetu

Teraz czas na edycję wyglądu Twoich archiwalnych produktów . Tutaj możesz edytować:

  • Ustawienia układu: Możesz włączyć lub wyłączyć ustawienia układu dla produktów archiwalnych.
  • Produkty w wierszu: wybierz liczbę produktów, które chcesz wyświetlić w każdym wierszu.
  • Wiersze na stronę: wybierz liczbę wierszy, które chcesz wyświetlić na każdej stronie.
Edytuj produkty archiwalne, aby dostosować stronę sklepu WooCommerce

Następnie możesz włączać i wyłączać wiele opcji produktów archiwalnych. Na przykład:

  • Błyskawiczne odznaki sprzedaży.
  • Pokaż kategorie.
  • Pokaż opis.
  • Ocena.
  • Pokaż cenę regularną.
  • Pochwal się ceną.
  • Grupa przycisków.
  • Stopka po najechaniu na styl.

Jeśli włączysz te opcje, będą one wyświetlane wraz z produktami archiwalnymi.

Edytuj zawartość archiwum produktu, aby dostosować stronę sklepu

Następnie edytuj pojemnik produktu, na przykład:

  • Wyrównanie.
  • Kolor tła.
  • Typ obramowania.
  • Szerokość.
  • Kolor ramki.
  • Luka produktowa.
  • Cień pola po najechaniu.
  • Rozstaw wierszy.
  • Wyściółka.
Dostosowanie strony sklepu WooCommerce

Możesz również edytować następujące obszary produktów archiwalnych:

  • Obraz produktu.
  • Kategorie produktów.
  • Tytuł produktu.
  • Cena produktu.
  • Opis produktu.
  • Z dala od tagu.
  • Dodaj do koszyka przycisk.
  • Ocena.
  • Wyprzedaż błyskawiczna.
  • Grupa przycisków itp.
Personalizacja strony sklepu za pomocą widżetu archiwalnego produktu

Możesz także dostosować więcej, przeciągając i upuszczając widżety, które są wyświetlane po lewej stronie. Na koniec, po przeciągnięciu i upuszczeniu widżetów oraz dostosowaniu ich, kliknij przycisk aktualizacji.

Zaktualizuj dostosowaną stronę sklepu
Tworzenie dostosowanej strony sklepu

Rzeczy, które warto wiedzieć:

Przed rozpoczęciem dostosowywania upewnij się, że dodałeś produkty do swojej witryny. Nie zobaczysz żadnych produktów bez ich dodania. Przeczytaj , jak dodawać produkty w WooCommerce , jeśli nie wiesz, jak to zrobić.

Teraz spójrz na swoją dostosowaną stronę sklepu WooCommerce:

Dostosowana strona sklepu WooCommerce
Strona sklepu WooCommerce
Dostosuj swoją stronę sklepu WooCommerce za pomocą ShopEngine

Notatka:

Chcesz dowiedzieć się więcej o ShopEngine Pro? Przeczytaj artykuł Przedstawiamy ShopEngine Pro: rewolucyjny kreator WooCommerce .

Dlaczego warto używać ShopEngine jako kreatora stron WooCommerce?

Po zapoznaniu się z prostym procesem nadal możesz mieć inne pytanie. Po co używać ShopEngine do dostosowywania strony sklepu bez korzystania z innych kreatorów stron WooCommerce?

Odpowiedź brzmi: ShopEngine odblokuje wiele nowych funkcji w swojej nadchodzącej wersji ( ShopEngine Pro ), których nie dostaniesz, jeśli użyjesz innych kreatorów WooCommerce. Nie tylko to, ShopEngine zapewnia również wiele innych funkcji, które zapewniają najlepsze wrażenia użytkownika. Poniżej znajduje się szybkie porównanie z innymi kreatorami WooCommerce:

Cechy SklepSilnik ShopEngine Pro WooLentor JetWooBuilder
Porównanie produktów
Odliczanie do wyprzedaży!
Kategorie produktów
Opis produktu
Lista życzeń
Szybki podgląd
Próbki
Zaległe zamówienie
Odznaki
Powiadomienie o sprzedaży
Częściowa płatność
Przed Sprzedaż
Szybka płatność
Dodatkowe pole kasy
Dodaj do koszyka
Bułka tarta
Fragment produktu
Filtry produktów
Szczegóły Konta
Tagi produktów
Tytuł archiwum
Liczą się wyniki archiwalne
Nawigacja po koncie
Odblokuj nowe opcje dostosowywania dzięki ShopEngine Pro

Gdzie szukać szablonu strony sklepu WooCommerce?

W ShopEngine znajdziesz gotowy szablon strony sklepu WooCommerce. Możesz także stworzyć szablon strony sklepu i dostosować go do swoich potrzeb. Nie ma ograniczeń co do dostosowywania tych szablonów, ponieważ ShopEngine zapewnia wszystkie opcje dostosowywania.

Poza tym otrzymasz szablony stron produktów WooCommerce wraz z wieloma innymi rodzajami szablonów. Pozwolą Ci one zbudować strony produktów, kategorii, koszyka itp. WooCommerce w kilka sekund, co jest niewiarygodne.

Najlepsze jest to, że bezpłatna wersja ShopEngine udostępnia gotowe szablony. Możesz go łatwo użyć do stworzenia strony sklepu WooCommerce. Zapoznaj się z darmowymi szablonami stron sklepu WooCommerce, które zapewnia ShopEngine:

Szablony strony sklepu
Szablon strony sklepu

Podsumowanie:

Twoja strona sklepu WooCommerce jest najważniejszą stroną wśród twoich stron WooCommerce. Przychody będą zależeć od tego, jak prezentujesz swoje produkty na stronie sklepu. Aby prezentacja była dobra, musisz dostosować tę stronę. Ze względu na ograniczone opcje dostosowywania w WooCommerce potrzebujesz innego narzędzia.

ShopEngine to najbardziej elastyczne narzędzie, które możesz wypróbować. Nie ma prawie żadnego narzędzia, które może zaoferować tak ogromną ilość personalizacji. Poza tym wydano również nową wersję ShopEngine pro. Tutaj możesz dostosować swoje strony od podstaw za pomocą ponad 63 widżetów, 12 modułów i sprawić, by Twoja strona działała płynnie w tym konkurencyjnym świecie.

Co więcej, znajdziesz 16 szablonów dla swoich stron, a bardziej atrakcyjne szablony zostaną wkrótce wydane dla Twojego produktu WooCommerce, koszyka, kategorii i innych stron. Korzystając z nich, możesz łatwo dostosować stronę swojego sklepu i skutecznie wyróżnić swoją witrynę.

Zacznij korzystać z ShopEngine Pro