Motyw Storefront: jak go zainstalować i skonfigurować

Opublikowany: 2018-01-12

Storefront to jeden z najbardziej elastycznych i rozszerzalnych motywów, jeśli chodzi o uruchomienie sklepu WooCommerce za pomocą WordPress.

Dzięki architekturze czystego kodu stał się niezwykle popularny wśród użytkowników, a obecnie ponad 100 000 sklepów internetowych używa Storefront jako motywu WordPress.

Instalowanie motywu witryny sklepu WooCommerce

Istnieją dwa sposoby zainstalowania motywu Storefront: przeszukując motyw z pulpitu nawigacyjnego WP lub ręcznie przesyłając motyw.

Instalacja za pomocą pulpitu WordPress

Najszybszym sposobem zainstalowania Storefront jest panel WordPress. Wykonaj poniższe czynności, aby zainstalować Storefront za pośrednictwem pulpitu WordPress.

  1. Przejdź do Wygląd > Motywy > Dodaj nowy
  2. Wpisz „ storefront ” w polu wyszukiwania i naciśnij Enter.
  3. Najedź na zrzut ekranu Storefront.
  4. Wybierz przycisk „ Zainstaluj ”.
  5. Kliknij Aktywuj

Ręczna instalacja Storefront

  1. Pobierz najnowszą wersję Storefront z wordpress.org
  2. Przejdź do Wygląd > Motywy > Dodaj nowy
  3. Kliknij Prześlij motyw i wybierz wcześniej pobrany plik zip.
  4. Kliknij Zainstaluj teraz
  5. Kliknij Aktywuj

Konfigurowanie strony głównej

Storefront ma wbudowany szablon strony głównej, który jest dobrze przemyślany. Jego przejrzysta struktura pomoże odbiorcom łatwo znaleźć produkty, które sprzedajesz.

W domyślnym szablonie strony głównej Storefront znajduje się 6 sekcji. Ale możesz dodać lub usunąć sekcję w zależności od potrzeb.

Sekcje domyślnej strony głównej:

  • Zawartość strony
  • Kategorie produktów
  • Najnowsze produkty
  • Polecane produkty
  • Popularne Produkty
  • Produkty w sprzedaży
  • Najlepiej sprzedające się produkty

Przypisywanie szablonu strony głównej

Aby skonfigurować szablon strony głównej, wykonaj następujące kroki:

  1. Przejdź do Pulpit -> Strony i utwórz stronę zatytułowaną „ Strona główna ” lub cokolwiek chcesz.
  2. Dodaj dowolną treść powitalną, która będzie wyświetlana nad produktami.
  3. Po prawej stronie znajdziesz pole zatytułowane „ Atrybuty strony ”
  4. Wybierz „ Strona główna ” z menu rozwijanego „ Szablon ”.
  5. Kliknij Opublikuj lub Aktualizuj , aby zapisać zmianę.

Wyświetlanie szablonu strony głównej

Po opublikowaniu strony, teraz musisz wyświetlić tę stronę główną jako stronę główną swojej witryny. Więc każdy, kto trafi na Twoją witrynę, najpierw zobaczy tę stronę. Aby to skonfigurować, wykonaj następujące kroki:

  1. Przejdź do Pulpit > Ustawienia > Czytanie
  2. W obszarze Wyświetlana strona główna wybierz Stronę statyczną (wybierz poniżej)
  3. Wybierz poprzednią stronę przypisania szablonu strony głównej w menu rozwijanym Strona główna .
  4. Kliknij Zapisz zmiany

Zamów ponownie sekcje strony głównej witryny sklepowej

Możesz zmienić kolejność sekcji strony głównej witryny Storefront za pomocą zaczepów lub wtyczki o nazwie Homepage Control. Wykonaj poniższe czynności, aby zmienić kolejność sekcji na stronie głównej:

  1. Pobierz i zainstaluj kontrolę strony głównej
  2. Przejdź do Wygląd -> Dostosuj -> Kontrola strony głównej
  3. Przeciągnij i zmień kolejność sekcji zgodnie z potrzebami.
  4. Kliknij Zapisz i opublikuj , aby zapisać zmiany.

Konfiguracja menu nawigacyjnego

W motywie Storefront możesz wyświetlić Menu w 3 lokalizacjach.

  1. Menu główne — pojawia się tuż pod logo witryny.
  2. Menu dodatkowe – obok logo obok pola wyszukiwania.
  3. Menu podręczne — menu dla urządzeń mobilnych.

Konfiguracja menu

Domyślnie, jeśli określone menu główne nie jest ustawione, WordPress wyświetla wszystkie Twoje strony jako menu główne. Czasami dezorientuje użytkowników i sprawia im trudność w zorientowaniu się, w jaki sposób te strony znalazły się w menu.

Tworzenie nowego menu i dodawanie do niego stron

  1. Przejdź do panelu administracyjnego, Wygląd > Menu
  2. Na górze znajdziesz pole Nazwa menu. Wpisz tutaj nazwę swojego menu.
  3. Z lewej strony kliknij Strony (zakładając, że chcesz dodać strony do menu)
  4. Kliknij Wyświetl wszystko, aby wyświetlić listę wszystkich opublikowanych stron.
  5. Zaznacz strony, które chcesz wyświetlić w menu.
  6. Po wybraniu strony kliknij przycisk Dodaj do menu.
  7. Przeciągnij i upuść element menu, aby zmienić ich kolejność zgodnie z własnymi upodobaniami.
  8. Kliknij Zapisz Menu

Przypisywanie menu

Po utworzeniu menu przypisz menu do miejsca, w którym chcesz je wyświetlić. Przejdź do Wygląd > Menu > Ustawienia menu i zaznacz lokalizację w polu wyboru Wyświetl lokalizację .

Dodawanie kategorii produktów do menu

  1. Przejdź do panelu administracyjnego, Wygląd > Menu
  2. Kliknij Opcje ekranu w lewym górnym rogu i sprawdź Kategorie produktów
  3. Teraz w lewym okienku pojawi się zakładka Kategorie produktów.
  4. Kliknij kartę Kategorie produktów, aby rozwinąć, wybierz kategorie
  5. Po wybraniu kliknij przycisk Dodaj do menu .
  6. Przeciągnij i upuść element menu, aby zmienić ich kolejność zgodnie z własnymi upodobaniami.
  7. Kliknij menu Zapisz

Ustawienia widżetu

Storefront umożliwia wyświetlanie sześciu regionów widżetów w 3 różnych obszarach.

  1. Pasek boczny – po lewej lub po prawej stronie głównej zawartości witryny,
  2. Poniżej nagłówka — tuż pod nagłówkiem witryny i nad treścią.
  3. Stopka Kolumna 1 – Obszar stopki
  4. Kolumna stopki 2 – Obszar stopki
  5. Kolumna stopki 3 – Obszar stopki
  6. Kolumna stopki 4 – Obszar stopki

Konfiguracja WooCommerce

Instalowanie WooCommerce

  1. Przejdź do Pulpit > Wtyczki > Dodaj nowe > Wyszukaj wtyczki
  2. Wyszukaj „WooCommerce”.
  3. Kliknij Zainstaluj teraz .
  4. Kliknij Aktywuj .

Konfiguracja WooCommerce

Po aktywacji WooCommerce zostaniesz poproszony o zainstalowanie WooCommerce za pomocą kreatora. Zajmie się wszystkimi początkowymi ustawieniami. Podzielony jest na 6 części.

  • Ustawienia strony – Automatycznie konfiguruje najważniejsze strony (Sklep, Koszyk, Kasa, Moje konto).
  • Lokalizacja sklepu — skonfiguruj lokalizację sklepu, walutę i podatek od sprzedaży
  • Wysyłka – Skonfiguruj jednostkę wagi i jednostkę wymiaru
  • Płatności – Skonfiguruj bramkę płatności.
  • Motyw — zainstaluj zgodny motyw WooCommerce.
  • Gotowy – (opcjonalnie) Zezwól WooCommerce na zbieranie informacji o użytkowaniu.

Możesz wszystkie te ustawienia, kiedy tylko chcesz, z pulpitu nawigacyjnego WooCommerce.

Dodaj produkt do WooCommerce

  1. Przejdź do pulpitu WordPress
  2. Kliknij Produkty > Dodaj nowy
  3. Wpisz nazwę lub tytuł produktu w polu Nazwa produktu .
  4. Napisz opis produktu w poniższym edytorze.
  5. Teraz musisz przesłać jeden polecany obraz swojego produktu i dodatkowy obraz do galerii produktów.
  6. Po prawej stronie znajdziesz pole zatytułowane Zdjęcie produktu i galeria produktów
  7. Prześlij polecane zdjęcie do zdjęcia produktu i dodatkowe zdjęcia do galerii produktów
  8. Kliknij Opublikuj .

Konfigurowanie ceny i atrybutu produktu

Aby ustawić cenę produktu Przejdź do Pulpit > Produkty i wybierz dowolny produkt. Następnie przewiń w dół do sekcji Dane produktu. Oto krótki opis wszystkich ustawień sekcji danych produktów:

Rodzaj produktu

  • Prosty produkt : Prosty pojedynczy produkt.
  • Produkt zgrupowany : produkt, który jest częścią kolekcji.
  • Produkt zewnętrzny/powiązany : produkt, który jest wymieniony w Twoim sklepie, ale rzeczywisty produkt jest sprzedawany gdzie indziej.
  • Produkt zmienny : Produkt z odmianami (rozmiar, kolory)
  • Produkt wirtualny : produkt, który nie wymaga wysyłki.
  • Produkt do pobrania : produkt, w którym należy dostarczyć plik do pobrania.

Ogólny

  • Normalna cena : Normalna cena produktu.
  • Cena promocyjna: Obniżona cena produktu.

Spis

  • SKU : Jednostka przechowywania zapasów (SKU) śledzi produkty
  • Zarządzaj zapasami : Włącz zarządzanie zapasami
  • Stan zapasów : czy produkt jest w magazynie, czy nie.
  • Sprzedawane pojedynczo : Można sprzedawać w jednym zamówieniu.

Wysyłka

  • Waga: Waga produktu.
  • Wymiary: długość, szerokość i wysokość produktu.
  • Klasa wysyłki: Grupuj produkty podobnego typu do określonej metody wysyłki.

Połączone produkty

  • Promocje : wyświetlaj powiązane produkty pod stroną szczegółów produktu.
  • Sprzedaż krzyżowa : Wyświetlaj powiązane produkty na stronie koszyka.
  • Atrybuty : wybierz atrybut globalny swoich produktów.

Zaawansowany

  • Notatka dotycząca zakupu : Notatka do wysłania klientowi po dokonaniu zakupu.
  • Kolejność menu : Niestandardowa pozycja zamówienia dla tego produktu.
  • Włącz recenzje : Włącz lub wyłącz recenzje produktów.

Dostosowywanie witryny sklepowej

Jak dodać logo

Wykonaj poniższe czynności, aby dodać i wyświetlić logo w swojej witrynie:
1. Przejdź do WordPress Admin, a następnie Wygląd > Dostosuj
2. Następnie przejdź do Tożsamość witryny > Logo
3. Kliknij Wybierz logo, aby przesłać obraz logo. (Zalecany rozmiar obrazu: 470 pikseli x 110 pikseli)
4. Kliknij Opublikuj.

Gdzie przesłać faviconę witryny

Wykonaj poniższe czynności, aby dodać i wyświetlić favicon w swojej witrynie:
1. Przejdź do WordPress Admin, a następnie Wygląd > Dostosuj
2. Następnie przejdź do Tożsamość witryny > Ikona witryny
3. Kliknij Wybierz obraz, aby przesłać obraz logo. (Zalecany rozmiar obrazu: 512 pikseli x 512 pikseli)
4. Kliknij Opublikuj.

Jak zmienić archiwum postów lub układ bloga

  1. Przejdź do Wygląd > Dostosuj > Dostosowywanie bloga > Archiwa postów
  2. Wybierz układ z Układu archiwum postów
  3. Kliknij Opublikuj

Jak zmienić archiwum postów lub kolumnę bloga

  1. Przejdź do Wygląd > Dostosuj > Dostosowywanie bloga > Archiwa postów
  2. Wybierz numer kolumny (pełna szerokość, 2 kolumny, 3 kolumny i 4 kolumny) z kolumny archiwum postów
  3. Kliknij Opublikuj

Jak zmienić układ pojedynczego posta lub artykułu

  1. Przejdź do Wygląd > Dostosuj > Dostosowywanie bloga > Pojedynczy post
  2. Wybierz układ z układu pojedynczego posta
  3. Kliknij Opublikuj

Jak zmienić czcionkę

  1. Przejdź do Wygląd > Dostosuj > Style ogólne > Typografia
  2. Wybierz czcionkę z Parowanie czcionek
  3. Kliknij Opublikuj

Dostosowanie WooCommerce

Jak zmienić układ strony Sklepu

  1. Przejdź do Wygląd > Dostosuj > WooCommerce > Strona sklepu – Listy produktów
  2. Wybierz układ z Układu archiwum produktów
  3. Kliknij Opublikuj

Jak zmienić układ strony szczegółów produktu

  1. Przejdź do Wygląd > Dostosuj > WooCommerce > Strona sklepu – Listy produktów
  2. Wybierz układ z Układu archiwum produktów
  3. Kliknij Opublikuj