Samouczki i przewodniki WooCommerce dla użytkowników płaskich motywów

Opublikowany: 2022-09-01

Motyw przewodni sklepu to jeden z najważniejszych elementów, który pomaga utrzymać zainteresowanie odwiedzających. Jeśli chodzi o motyw dla Twojego sklepu WooCommerce, dostępne są tysiące opcji. Musisz jednak wybrać uniwersalny motyw z wysokimi możliwościami dostosowywania. Jednym z takich motywów WordPress WooCommerce jest Flatsome.

Więcej o motywie Flatsome

Flatsome to jeden z najpopularniejszych i najwyżej ocenianych motywów WordPress WooCommerce w repozytorium motywów ThemeForest. Został zaprojektowany i opracowany przez UX Themes. Celem było zaprojektowanie łatwego w użyciu spersonalizowanego motywu, idealnego dla początkujących i niekodujących.

Chociaż Flatsome jest uniwersalnym motywem skoncentrowanym na WooCommerce, może być używany do tworzenia dowolnej strony internetowej. Za pomocą tego motywu możesz tworzyć witryny blogów, witryny z osobistymi portfolio, witryny firmowe i wiele innych.

Statystyki BuiltWith pokazują , że przy użyciu Flatsome tworzonych jest ponad 500 000 stron internetowych na żywo. Powodem tak ogromnej popularności jest nic innego jak niesamowitość funkcji motywu i fantastyczne wrażenia użytkownika. Jest szybki, lekki, łatwy w użyciu i specjalnie stworzony dla użytkowników nietechnicznych.

Motyw zawiera pięknie zaprojektowane wersje demonstracyjne, aby szybko stworzyć stronę internetową. Wybór motywu Flatsome dla Twojego sklepu internetowego WooCommerce to doskonały pomysł.

Zespół WPCred od dłuższego czasu pisze samouczki skoncentrowane na Flatsome. Omówiliśmy już ponad 40 podstawowych samouczków na różne tematy Flatsome. Niektóre z nich w całości wykorzystują motyw Flatsome, a inne używają wtyczek lub narzędzi innych firm. Przejdźmy do samouczków motywu Flatsome WooCommerce.

Kup płaski motyw

1. Czy Flatsome jest najlepszym motywem WooCommerce?

flatosme najlepszy motyw woocommerce

Flatsome to uniwersalny motyw WooCommerce, któremu zaufało ponad 200 000 właścicieli witryn. To niesamowicie szybki motyw z doskonałym doświadczeniem użytkownika. Poza tym oferuje piękne wzornictwo, obsługuje dowolne urządzenie i wprowadza unikalne funkcje.

Dodatkowo Flatsome zredukował swój podstawowy plik JavaScript do 56kb, co uczyniło go niesamowicie zoptymalizowanym. Możesz poznać tajniki, czytając naszą dogłębną analizę recenzji Flatsome .

2. Jakościowy hosting WooCommerce

WordPress hosting woocommerce

Twoja witryna nie będzie szybsza, jeśli będzie hostowana na okropnym serwerze. Jego wydajność zależy od jakości hostingu. Do wyboru są setki dostawców hostingu WooCommerce. Wybór najlepszego hostingu dla WooCommerce znacznie ułatwi konfigurację i zarządzanie sklepem.

3. Płaskie instalacje tematyczne

Płaska instalacja

Instalacja motywu Flatsome WooCommerce jest bardzo łatwa. Odwiedź ThemeForest i kup motyw Flatsome (jeśli jeszcze go nie kupiłeś). Następnie pobierz plik i prześlij go do pulpitu WordPress. Następnie zainstaluj i aktywuj za pomocą klucza licencyjnego. Odwiedź link, jak zainstalować Flatsome w WordPressie, jak oficjalne demo Flatsome .

4. Utwórz motyw potomny

Płaski motyw potomny

Dzięki motywowi podrzędnemu możesz modyfikować wygląd swojej witryny bez bezpośredniej edycji plików motywu. Oznacza to, że możesz wiedzieć, jak zaktualizować motyw WordPress bez utraty dostosowania . Kiedy aktywujesz motyw Flatsome po raz pierwszy, pojawi się opcja utworzenia motywu potomnego, a także będziesz mógł wiedzieć, jak łatwo utworzyć motyw potomny Flatsome na WordPress i użyć go do utworzenia nowego motywu potomnego.

5. Ustawienia dostosowywania motywu rodzica do motywu potomnego

konfigurator motywu nadrzędnego

Podczas korzystania z motywu potomnego w Flatsome może być konieczne skopiowanie ustawień dostosowywania z motywu nadrzędnego do motywu potomnego . To prosty proces, który składa się z kilku kroków. WordPress widzi motyw Twojego dziecka jako nowy motyw. Tak więc, nie robiąc tego, możesz stracić dostosowanie motywu nadrzędnego podczas przechodzenia do motywu potomnego.

6. Stwórz witrynę One Page za pomocą Flatsome

jednostronicowy konstruktor ux

Jak już wspomnieliśmy, Flatsome to uniwersalny motyw, który możesz wykorzystać do tworzenia sklepów internetowych w niemal każdej niszy. W dzisiejszych czasach jednostronicowa witryna internetowa zyskuje popularność z wielu powodów. Flatsome oferuje również specjalną funkcję o nazwie „Flatsome Studio”, która pomoże Ci dowiedzieć się, jak utworzyć witrynę jednostronicową za darmo.

7. Użyj Flatsome Studio do stworzenia sklepu internetowego

Mieszkanie typu studio

Flatsome Studio to bezpłatna obszerna biblioteka cyfrowa zawierająca obrazy, wstępnie zaprojektowane sekcje i układy. Możesz go po prostu zaimportować i używać za pomocą kilku kliknięć. Importując nowe elementy, możesz korzystać ze studia Flatsome na WordPressie i wybierać spośród ponad 100 elementów.

8. Prześlij swoje logo

prześlij logo do płaskiego motywu

Logo to podstawa tożsamości Twojej marki. Ale po aktywowaniu motywu domyślnie zauważysz logo Flatsome na swojej stronie. Możesz jednak łatwo pokazać markę swojej firmy i przesłać logo Flatsome na stronę WooCommerce.

9. Utwórz Mega Menu w Flatsome

mega menu Flatsome

Po wybraniu logo czas na ustawienie menu. Odwiedzający Twoją witrynę zawsze będzie chciał mieć łatwy dostęp do każdej strony w Twoim sklepie. Musisz pomóc im szybko znaleźć dokładnie to, czego chcą, dlatego możesz potrzebować mega menu. Możesz stworzyć mega menu Flatsome w kilku krokach.

10. Dodaj tło wideo

dodaj tło wideo Flatsome

Masz tylko kilka sekund, aby przyciągnąć uwagę odwiedzających. Ruchome tło może natychmiast przyciągnąć odwiedzających. Flatsome ma wbudowaną funkcję, która pozwala dodawać tła wideo dla WordPress w banerach wideo Flatsome .

11. Włącz nieskończone przewijanie na stronie sklepu

nieskończony zwój Flatsome

Nieskończone przewijanie zapewnia, że ​​możesz przewijać tak długo, jak chcesz. Łatwiej jest przeglądać więcej produktów, po prostu przewijając w dół. Tak więc dodanie nieskończonego przewijania dla WordPress na stronie sklepu Flatsome daje więcej możliwości dla Twojego sklepu internetowego w zakresie optymalizacji stronicowania WooCommerce.

12. Dodaj Lightbox do Flatsome

wyskakujące okienko lightbox

Lightbox często zawiera wezwanie do działania (CTA), aby poprosić użytkowników o podjęcie działania. Jest to całkiem skuteczne dla właścicieli witryn i marketerów z kilku powodów. Shortcode lightbox umożliwia otwieranie dowolnych treści w lightbox, klikając przycisk lub element nawigacyjny. Kroki dodawania wyskakującego okienka Flatsome do WordPressa są proste.

13. Utwórz automatyczne wyskakujące okienko biuletynu

wyskakujące okienko biuletynu

Wyskakujące okienko to świetny sposób komunikowania się z odwiedzającymi. Możesz go użyć, aby połączyć się z większą liczbą odwiedzających i uczynić ich potencjalnymi klientami. Co więcej, może pomóc Ci w kampanii e-mail marketingowej i zwiększyć liczbę zarejestrowanych użytkowników Twojej witryny. Flatsome ma funkcję tworzenia automatycznego wyskakującego okienka subskrypcji biuletynu i możesz dowiedzieć się, jak utworzyć wyskakujące okienko biuletynu Flatsome, wykonując kilka prostych kroków . Podkreśli Twoje promocje i przyciągnie więcej subskrybentów do Twojego biuletynu.

14. Ustaw polecane produkty

zestaw polecany produkt Flatsome

Produkty fabularne pomagają odwiedzającym przeglądać najatrakcyjniejsze produkty Twojego sklepu WooCommerce. Dzięki temu możesz zaprezentować swoim klientom specjalne produkty. Mogą to być Twoje popularne lub popularne produkty, nowe produkty lub niektóre produkty sponsorowane, które chcesz pokazać. Istnieje wiele sposobów na ustawienie polecanych produktów w motywie Flatsome WooCommerce. Z tego artykułu dowiesz się, jak ustawić polecane produkty w WooCommerce.

15. Zastosuj bezpłatną wysyłkę dla określonych produktów

darmowa wysyłka woocommerce

Właściciele sklepów WooCommerce stosują różne strategie, aby zwiększyć sprzedaż. Wśród nich bezpłatna wysyłka jest powszechną strategią przyciągania klientów. Płaskie oferty, aby ustawić bezpłatną wysyłkę WooCommerce dla określonych produktów . Możesz dodać bezpłatną wysyłkę do poszczególnych produktów, produktów z określonej kategorii lub dowolnego innego rodzaju produktu.

16. Skonfiguruj poprawnie listę życzeń

skonfiguruj listę życzeń

Zwykle ludzie spędzają dużo czasu w witrynach eCommerce. Podczas dłuższego odwiedzania witryny bardzo często gubi się produkt, który zdecydowali się kupić. Dlatego lista życzeń jest niezbędna dla Twojej witryny eCommerce. Dzięki temu Twoi klienci mogą zapisać produkty do późniejszego zakupu. Tworzenie listy życzeń w Flatsome jest łatwe do wdrożenia. Możesz dodać go do swojej witryny bez kodowania.

17. Utwórz niestandardową stronę błędu 404

niestandardowe 404 flatsome

Jednym z najczęstszych błędów w sieci jest strona błędu 404. To frustrujące i mylące dla odwiedzających. Takie strony nie są przejrzyste i nie pomagają użytkownikom pozostać w witrynie. Z pewnością nie chcesz, aby użytkownicy trafiali na ogólną stronę błędu. Jeśli przypadkiem Twoi goście napotkają taką sytuację, nie martw się, Flatsome ma wbudowane niestandardowe strony błędów 404 WordPress . Możesz wybrać jedną z listy i poinformować odwiedzających, że nadal są na Twojej stronie.

18. Dodaj opinię klienta

referencje klientów

Skutecznym sposobem budowania zaufania kupujących jest dodawanie referencji klientów. To najczęściej pozytywne recenzje wystawiane przez zadowolonych klientów. Istnieje wiele różnych sposobów dodawania referencji klientów do motywu referencji Flatsome i można je łatwo zaprojektować samodzielnie . Znajdziesz kilka wstępnie zdefiniowanych stron z referencjami na temat motywu Flatsome do wyboru.

19. Utwórz nagłówek strony sklepu za pomocą UX Builder

nagłówek strony sklepu

Bez względu na rodzaj produktów, które sprzedajesz, strony Twojego sklepu WooCommerce są istotnymi częściami Twojego sklepu. Flatsome pozwala dodać projekt nagłówka strony internetowej za pomocą kreatora UX, aby strona sklepu Flatsome była bardziej użyteczna i atrakcyjna.

20. Utwórz suwak za pomocą UX Buildera

Utwórz suwak

Suwak może pomóc w wyeksponowaniu produktów w sposób ozdobiony i przyjazny dla użytkownika. W rezultacie Twoi goście będą mieli lepsze wrażenie. Ten motyw ułatwił tworzenie suwaka Flatsome dla WordPress za pomocą UX Builder .

21. Dostosuj stronę produktu WooCommerce

dostosuj stronę produktu

Twój fantastyczny produkt zasługuje na unikalną, dostosowaną stronę produktu WooCommerce. Musisz być w stanie dostosować stronę produktu WooCommerce , aby wyróżniał się Twój sklep e-commerce. Kreator Flatsome UX zapewnia elastyczność projektowania, umożliwiającą wizualne tworzenie i dostosowywanie niestandardowej strony produktu.

22. Szybko uzyskaj linki do podstron Google

linki do podstron google

Linki witryny Google to podlisty, które pojawiają się pod pierwszym wynikiem wyszukiwania, zwykle podczas wyszukiwania marek. Linki do podstron oszczędzają czas i zapewniają trafne wyniki wyszukiwania. Możesz postępować zgodnie z pewnymi procesami, aby zwiększyć swoje szanse na uzyskanie linków do witryn . Możesz dowiedzieć się, jak uzyskać linki do podstron Google w kilku prostych krokach.

23. Skonfiguruj i zainstaluj Menedżera tagów Google

Menedżer tagów Google

Menedżer tagów Google sprawia, że ​​zarządzanie tagami jest łatwe, proste i niezawodne, umożliwiając marketerom i webmasterom wdrażanie tagów witryn w jednym miejscu. Możesz sprawdzić nasz samouczek, jeśli zastanawiasz się , jak skonfigurować i zainstalować menedżera tagów Google WordPress .

24. Dodaj Google Search Console

konsola wyszukiwania google

Google Search Console, wcześniej znana jako Narzędzia dla webmasterów, pomaga zoptymalizować dane w celu monitorowania wydajności witryny w wyszukiwaniu. Zalety Search Console sprawiają, że jest ona niezbędna do poprawy wydajności wyszukiwania. Konfiguracja Google Search Console w witrynie opartej na Flatsome zajmuje tylko kilka minut, ale daje korzyści na całe życie. Możesz wiedzieć, jak dodać wgląd do konsoli wyszukiwania Google WordPress

25. Dodaj Google Analytics, aby śledzić ruch w sklepie

Google Analytics to bezpłatne narzędzie Google do śledzenia i analizowania odwiedzających Twoją witrynę. Ponadto zapewnia kluczowe informacje na temat tego, co możesz zrobić, aby osiągnąć swoje cele i jak działa Twoja witryna. Jeśli już znasz znaczenie, oto podsumowanie, jak dodać Google Analytics do WordPressa na Twoim motywie Flatsome WooCommerce.

26. Dodaj Google Recaptcha do formularza kontaktowego 7

Google recapcha

Wtyczka Contact Form 7 jest niezbędna dla każdej witryny opartej na WordPressie. Jeśli użyjesz go w swojej witrynie, prawdopodobnie zaczniesz otrzymywać posty spamowe za pośrednictwem swojego formularza. Aby Twoja skrzynka nie zawierała niepotrzebnych treści, musisz dodać Recaptcha do formularza kontaktowego 7 .

27. Dodaj metadane otwartego wykresu Facebook

Facebook otwarta metada

Metadane otwartego wykresu Facebooka zapewniają kontrolę nad tym, jak treść będzie wyglądać po udostępnieniu na Facebooku. Pobiera metadane z treści i pozwala wybrać sposób wyświetlania rzeczy. Możesz zastosować obie metody ręczne lub wtyczkę, aby dodać metadane otwartego wykresu do swojej witryny Flatsome.

28. Twórz produkty zmienne

stwórz zmienny produkt woocommerce

Zmienna w WooCommerce pozwala wybrać jedną z kilku opcji. Można go łatwo zdefiniować jako produkt dostępny w kilku kolorach, fasonach, rozmiarach i wielu innych. Dodawanie produktów zmiennych WooCommerce w motywie Flatsome jest proste.

29. Dodaj wiele wariacji obrazów i filmów

wariacje obrazów i filmów

Wiele zdjęć produktu ułatwia kupującym wybór produktu. Ale domyślnie WooCommerce pozwala dodać tylko jeden obraz na odmianę produktu. Jednak dodatkowa galeria obrazów odmian dla wtyczki WooCommerce pozwala wyświetlać produkty z różnych punktów widzenia lub perspektyw. Ponadto możesz dodawać filmy do swojej galerii obrazów produktów WooCommerce.

30. Pokaż próbki odmian na stronie sklepu/archiwum

próbka odmiany

Domyślnie WooCommerce oferuje menu rozwijane dla produktów wariacyjnych. Jednak wyświetlenie wymaga więcej kliknięć i nie zapewnia odwiedzającym bezproblemowej obsługi. Wtyczka WooCommerce Variation Swatches konwertuje domyślne listy produktów w piękne próbki.

Dodanie próbek kolorów WooCommerce to jeden z najlepszych sposobów na ożywienie Twoich produktów. Z drugiej strony atrybuty produktów WooCommerce zapewniają przyjemny sposób na wyświetlanie odmian.

Alternatywnie możesz chcieć dostosować próbki przycisków radiowych do różnych celów. W porównaniu do listy rozwijanej Select, przyciski radiowe są bardziej przyjazne dla klienta.

31. Przetłumacz Flatsome za pomocą wtyczki Loco Translate

przetłumacz płaski motyw

Każdego dnia tracisz dużo ruchu w witrynie, ponieważ nie można jej przetłumaczyć. Jeśli Twoja witryna oparta na motywie Flatsome musi być wielojęzyczna, możesz łatwo tłumaczyć za pomocą wtyczki Loco Translate i możesz wiedzieć, jak tłumaczyć strony internetowe na angielski lub dowolny inny język za pomocą tej wtyczki.

32. Wyłącz recenzje w Flatsome

wyłącz recenzję produktu

W większości przypadków nie zaleca się wyłączania recenzji WooCommerce. Istnieje jednak kilka powodów, dla których warto rozważyć wyłączenie recenzji produktów . Czasami właścicielom sklepów trudno jest nadążyć za spamem w sekcji recenzji produktów.

33. Dodaj użytkowników do zespołu wsparcia

dodaj użytkownika do zespołu wsparcia

WordPress posiada wbudowany system zarządzania użytkownikami. Możesz mieć zespół ludzi współpracujących ze sobą, aby zarządzać różnymi aspektami Twojej witryny, takimi jak pomoc techniczna, autorzy treści, eksperci SEO i wiele innych. Platforma umożliwia natychmiastowe dodawanie nowych użytkowników i zapewnianie różnych ról i uprawnień. Tutaj znajdziesz artykuły na temat dodawania użytkowników do WordPressa.

34. Dodaj własną etykietę menu osobistego

Dodaj osobistą etykietę menu

Menu to ogólny sposób na łatwe przeglądanie witryny. Wiele motywów WordPress ma wstępnie zdefiniowane lokalizacje i układy menu. Na szczęście Flatsome ma doskonałą, czystą, gotową etykietę menu, aby przyciągnąć odwiedzających. Ponadto tworzysz również własną osobistą etykietę menu .

35. Dodaj ikony płatności do stopki

ikona płatności płaski

Maksymalne strony internetowe oparte na Flatsome są oparte na WooCommerce. Przed zakupem produktu w sklepie internetowym klienci chcą wiedzieć, w jaki sposób będą mogli go kupić. Dlatego niezbędne jest posiadanie obsługiwanych ikon płatności. Poinformuj o tym swoich klientów, wyświetlając ikony płatności w stopce .

36. Wyłącz szybki podgląd produktu

wyłącz szybki podgląd Flatsome

Szybki podgląd produktu umożliwia kupującym „szybkie spojrzenie” na Twoje produkty. Motyw Flatsome zawiera tę funkcję. Jeśli jednak z jakiegoś powodu chcesz wyłączyć szybki podgląd WooCommerce , możesz to zrobić szybko.

37. Utwórz link „Przewiń do”

przewiń, aby połączyć

Możesz pomóc odwiedzającemu witrynę przejść do określonej sekcji strony, włączając element „przewiń, aby połączyć” . Może zaoszczędzić cenny czas i ułatwić nawigację.

38. Użyj niestandardowych ikon

niestandardowa ikona

Prawdopodobnie zastanawiasz się, dlaczego chcesz dodać niestandardowe ikony do swojej witryny. Odpowiedź jest dość prosta; dla „ lepszej reprezentacji wizualnej ”. Chociaż Flatsome ma kilka atrakcyjnych ikon, nadal możesz chcieć używać niestandardowych ikon w swojej witrynie i możesz łatwo dostosować ikony samodzielnie.

39. Zwiń/rozwiń listę kategorii produktów na pasku bocznym

rozwiń kategorię paska bocznego

Lista kategorii produktów na pasku bocznym ma kluczowe znaczenie dla każdego sklepu internetowego. W witrynie WooCommerce zasilanej przez Flatsome możesz zwinąć / rozwinąć menu paska bocznego na liście kategorii WooCommerce, aby odwiedzający mogli łatwo poruszać się po witrynie.

40. Skonfiguruj serwer SMTP WordPress za pomocą Gmail API

Gmail API płaski

WordPress używa funkcji poczty PHP do wysyłania powiadomień e-mail. Jednak ta funkcja nie działa zgodnie z oczekiwaniami z kilku powodów. Gmail udostępnia usługę SMTP, której możesz używać do wysyłania e-maili. W tym celu musisz skonfigurować serwer SMTP za pomocą integracji Gmaila .

41. Utwórz wyskakujące okienko z przewodnikiem po rozmiarach

tabela rozmiarów flatsome

Jeśli kupujący będą mieli trudności ze znalezieniem odpowiedniego produktu dla swoich potrzeb, prawdopodobnie opuszczą Twój sklep i przejdą do konkurencji. Lepiej będzie pokazać proste okienko z przewodnikiem po rozmiarach w swoim sklepie internetowym i dowiedzieć się, jak stworzyć tabelę rozmiarów. Bez tego Twoi klienci będą zdezorientowani co do odpowiedniego rozmiaru, którego potrzebują. Jest to konieczne, jeśli Twoje produkty są zorientowane na rozmiar, takie jak ubrania, buty itp.

42. Wyczyść pamięć podręczną elementów Instagram

wyczyść element instagrama

Pamięć podręczna to tymczasowe dane, które pomagają przeglądarce ładować rzeczy szybciej. Czasami te dane z pamięci podręcznej mogą wygasnąć lub ulec uszkodzeniu i powodować problemy z korzystaniem z Instagrama. Najlepszą praktyką jest wyczyszczenie danych pamięci podręcznej elementów Instagrama . Jeśli nie wiesz, jak wyczyścić pamięć podręczną Instagrama, możesz się tego dobrze nauczyć stąd.

43. Przyspiesz swój sklep WooCommerce
Przyspiesz sklep WooCommerce

Mamy nadzieję, że na tym etapie możesz stworzyć swój sklep internetowy za pomocą motywu Flatsome, ale możesz napotkać problemy z optymalizacją prędkości. Im szybciej ładuje się Twoja witryna, tym lepsze wrażenia z zakupów. Oto kilka wskazówek, dzięki którym Twoja witryna WooCommerce ładuje się szybciej dzięki najlepszym praktykom optymalizacji szybkości WordPress .

Zawijanie

Mamy nadzieję, że ten przewodnik będzie pomocny dla każdego, kto korzysta z motywu Flatsome WooCommerce. Pomoże Ci ulepszyć witrynę, zwiększyć liczbę odwiedzających witrynę, a jednocześnie zwiększyć sprzedaż.

Jeśli chcesz, abyśmy omówili więcej tematów na Flatsome, daj nam znać w sekcji komentarzy. Będziemy stale aktualizować ten artykuł, aby zapewnić lepsze rozwiązania dla Twojego sklepu WooCommerce.