Jak edytować stronę sklepu WooCommerce bez Elementora?

Opublikowany: 2022-10-18

Zastanawiasz się, jak wyróżnić swoją stronę sklepu WooCommerce z tłumu? Jednym z najlepszych sposobów byłaby edycja strony, aby była bardziej przyjazna dla kupujących. Na przykład możesz dodać widżety produktów Elementora, aby uzyskać lepszą personalizację.

Ale ponieważ istnieje wiele sposobów edytowania strony sklepu WooCommerce, którego używasz? Cóż, wszystko zależy od tego, z jaką metodą czujesz się komfortowo. Możesz używać wtyczek, elementorów, kodów, a nawet kombinacji elementor i Shopready .

Bez zbędnych ceregieli dowiedzmy się, jak edytować stronę sklepu WooCommerce bez elementora, aby poprawić wrażenia użytkownika.

Jeśli chcesz zwiększyć sprzedaż w swoim biznesie online, powinieneś zacząć od edycji swojej strony sklepu WooCommerce. W ten sposób możesz uczynić go bardziej przyjaznym dla użytkownika. Poniżej przedstawiamy niektóre z najskuteczniejszych sposobów dostosowania strony sklepu .

Spis treści

Metoda pierwsza: edycja ręczna

Jeśli nie masz problemu z kodowaniem, możesz ręcznie edytować stronę sklepu WooCommerce. Poniżej znajduje się przewodnik krok po kroku, jak to zrobić.

Krok 1: Zdobądź motyw potomny i nazwij go

Kupując motyw witryny, powinien on zawierać motyw podrzędny. Ale jeśli nie możesz go znaleźć, zawsze możesz poprosić swojego programistę motywu, aby go dostarczył.

Aby nazwać motyw potomny, otwórz panel sterowania WordPress i kliknij Menedżer plików. Następnie wybierz WP-Content>Tematy>Twoja nazwa-motywu. Stąd możesz wybrać nazwę swojego motywu dziecka jako dwadzieścia dwadzieścia dzieci lub coś bliskiego.

Krok 2: Dodaj strukturę folderów w motywie potomnym

Po utworzeniu motywu potomnego następnym krokiem powinno być utworzenie w nim struktury folderów. Najpierw kliknij folder z motywem potomnym (dwadzieścia dwadzieścia dzieci), który można znaleźć pod motywami. Następnie utwórz pod nim nowy folder i nazwij go WooCommerce.

Krok 3: Utwórz podfolder

W folderze WooCommerce musisz utworzyć inny folder i nazwać go „archive-product-.php”. Ten folder szablonu archiwum produktów będzie służył jako plik szablonu strony sklepu.

Krok 4: Dodaj treść do pliku szablonu strony sklepu

Plik szablonu strony sklepu, który utworzyłeś w kroku trzecim, będzie pusty. Tak więc, aby był funkcjonalny, musisz dodać treść. Aby to zrobić, możesz użyć kodu. Ale jeśli nie masz wiedzy, jak się do tego zabrać, po prostu przejdź do następnego kroku.

Krok 5: Zaprojektuj szablon strony sklepu

Tutaj nie musisz projektować strony sklepu WooCommerce od zera. Zamiast tego możesz skorzystać z gotowego szablonu strony produktu . Następnie poszukaj motywu nadrzędnego i wybierz plik single.php lub index.php. Następnie skopiuj i wklej dowolny plik do folderu WooCommerce utworzonego w kroku 2.

Następnie usuń istniejący plik „archive-product.php”. Następnie nazwij swój nowy plik (single.php lub index.php) „archive-product.php”. Następnie będziesz musiał użyć skrótów do edycji strony.

Krok 6: Użyj skrótów

Pierwszym krokiem jest podzielenie stron produktów na wiersze lub kolumny. Na przykład możesz zdecydować się na umieszczenie dwóch produktów w jednym dwukolumnowym rzędzie. W takim przypadku możesz użyć skrótu:

Aby jednak wyświetlić produkty w dwóch kolumnach z limitem sześciu produktów w każdej kolumnie, użyj tego krótkiego kodu:

Wystarczy wpisać kody w pliku archive-product.php. Ale najpierw musisz usunąć istniejący kod. Możesz także wypróbować różne skróty, aż osiągniesz pożądany wygląd strony sklepu.

Metoda druga: Korzystanie z Elementora

Nie masz ochoty na kodowanie? Równie dobrze możesz dostosować domyślną stronę produktu WooCommerce za pomocą elementor. Ta metoda jest dość łatwa w użyciu. A oto proste kroki, które mogą Ci pomóc.

Krok 1: Włącz elementor WordPress

Jeśli nie masz elementora, przejdź do pulpitu WordPress i kliknij opcję Wtyczki, a następnie Dodaj nowy. W polu wyszukiwania poszukaj kreatora stron Elementor i wybierz go zainstalować. Na koniec naciśnij przycisk Aktywuj.

Krok 2: Zaprojektuj nowe archiwum produktów

Po zainstalowaniu elementuor po prostu tworzysz nowy szablon archiwum produktów . Możesz to zrobić, przechodząc do pulpitu administracyjnego WordPress i wybierając Moje szablony.

W sekcji Szablony kliknij kartę Dodaj nowy w lewym górnym rogu pulpitu nawigacyjnego i wybierz Archiwum produktów. Na koniec, korzystając z opcji Utwórz szablon, nazwij swój szablon.

Krok 3: Dostosuj swój szablon

Aby dostosować szablon strony produktu, możesz zrobić to od podstaw. W takim przypadku w panelu edycyjnym znajdziesz garść unikalnych widżetów, z których możesz skorzystać.

Alternatywnie możesz użyć dowolnego wstępnie zaprojektowanego szablonu. Elementor pozwala wybrać różne układy i style stron produktów. Wystarczy więc wybrać styl, a następnie dostosować go do swojej marki.

Krok 4: Skorzystaj z widżetów produktów

Aby jeszcze bardziej dostosować stronę sklepu WooCommerce, musisz dodać widżety. Na pulpicie WordPress Elementor kliknij kartę Elementy. Zobaczysz wiele widżetów do wyboru, w tym koszyk menu, produkty, niestandardowy dodatek do koszyka i wiele innych.

Krok 5: Podgląd swojej niestandardowej strony sklepu

Zanim klikniesz przycisk publikowania, musisz wyświetlić podgląd strony swojego produktu. W lewym dolnym panelu zobaczysz ikonę w kształcie oka. Kliknij ikonę i wybierz Ustawienia podglądu. Następnie wybierz konkretny produkt do podglądu.

Krok 6: Zapisz i opublikuj

Gdy skończysz edytować stronę sklepu i będziesz zadowolony z dostosowań, kliknij przycisk Opublikuj. Pojawi się pole Dodaj warunek z pytaniem, gdzie ma być wyświetlany szablon produktu.

Wybierz opcję Strona sklepu, a następnie kliknij przycisk Zapisz i zamknij. Twoja niestandardowa strona sklepu WooCommerce powinna już być aktywna.

Metoda trzecia: używanie wtyczek

Możesz użyć dowolnej wtyczki, ponieważ jest ich wiele. Jednak w tym poście skupimy się na połączeniu wtyczek elementor i Shopready . Wystarczy wykonać te kroki, aby edytować stronę swojego sklepu.

Krok 1: Zainstaluj Shopready

Na pulpicie WordPress kliknij kartę Wtyczki i wybierz opcję Dodaj nowy. Następnie w polu wyszukiwania w prawej górnej części panelu wyszukaj Shopready i kliknij przycisk Aktywuj.

Krok 2: Dodaj szablon strony sklepu

Następnie powinieneś opracować szablon strony sklepu, aby dostosować domyślną stronę produktu WooCommerce . Aby to zrobić, znajdź swoją wtyczkę Shopready, a następnie w Dashboard, wybierz Szablony. Tutaj znajdziesz szereg gotowych szablonów, które możesz wybrać, aby pasowały do ​​stylu Twojej marki.

Wybierz szablon i przesuń przełącznik w prawo, aby aktywować szablon. Na koniec kliknij przycisk Zapisz zmiany.

Krok 3: Dostosuj swój szablon

Po wybraniu szablonu strony Shopready nadszedł czas, aby dostosować go za pomocą elementor. Możesz dostosować za pomocą narzędzia do tworzenia stron ze szczegółami produktu, narzędzia do tworzenia stron koszyka, narzędzia do tworzenia stron archiwum, a nawet narzędzia do tworzenia stron konta. Shopready zapewnia tak wiele funkcji dostosowywania. Po zakończeniu edycji strony sklepu WooCommerce po prostu kliknij przycisk Aktualizuj.

Dlaczego warto korzystać z Shopready do edycji strony sklepu WooCommerce?

Nie wiesz, dlaczego powinieneś używać Shopready, a nie żadnej innej wtyczki do edycji strony swojego sklepu? Oto kilka powodów.

Łatwość użycia

Shopready jest nie tylko łatwy w użyciu do edycji strony sklepu WooCommerce, ale także oferuje łatwe w obsłudze funkcje dostosowywania. Co więcej, zawiera wstępnie zaprojektowane opcje szablonu strony produktu . Dlatego nie musisz być technicznym guru, aby korzystać z tej wtyczki.

Kompletny zestaw wtyczek

Innym powodem, dla którego powinieneś rozważyć użycie kombinacji elementor i Shopready, jest to, że ta wtyczka jest kompletnym zestawem. Mówiąc najprościej, zawiera wszystko, czego potrzebujesz, aby dostosować stronę sklepu WooCommerce, w tym narzędzie do tworzenia sklepów.

Świetna obsługa klienta

Kiedy używasz Shopready do edycji swojej strony sklepu WooCommerce, masz zapewnione 24-godzinne wsparcie oraz bezpłatne szkolenie. Jeśli więc gdzieś utkniesz, zawsze możesz skontaktować się z obsługą klienta w celu uzyskania pomocy.

Dostępne w wersji darmowej i płatnej

Jeśli masz napięty budżet, możesz skorzystać z bezpłatnej wersji Shopready, która oferuje wiele opcji dostosowywania. Ale jeśli chcesz więcej licencji na witrynę, możesz wybrać wersję Startup, Business lub Agency Shopready.

Wniosek

Sposób, w jaki prezentujesz swoje produkty w witrynie eCommerce, może mieć znaczący wpływ na Twoją sprzedaż. Z tego powodu bardzo sensowne jest dostosowanie domyślnej strony sklepu WooCommerce. Musisz jednak zdecydować, czy chcesz edytować swoją stronę ręcznie, za pomocą Elementora czy wtyczek.

Ogólnie rzecz biorąc, jeśli masz podstawową wiedzę na temat kodowania, zalecamy ręczną edycję strony sklepu. Ale jeśli potrzebujesz szybkiego i łatwego sposobu na dostosowanie, możesz rozważyć użycie elementora. Tymczasem, jeśli chcesz metody, która oferuje unikalne funkcje dostosowywania, powinieneś użyć kombinacji elementor i Shopready .