Dostosowywanie sklepu online za pomocą edytora szablonów
Za pomocą edytora szablonów można dostosowywać obszary szablonu, takie jak kolory, oraz zarządzać zawartością szablonu za pomocą sekcji i bloków. W edytorze szablonów dostępne są następujące sekcje:
- Pasek menu wyświetla narzędzia, dzięki którym można uzyskać więcej informacji o szablonie, przejść do różnych wzorców szablonu, takich jak strony produktów, dostosować wyświetlaną wielkość ekranu i zarządzać działaniami dostosowywania.
- Całą zawartość szablonu przeglądanego w danej chwili na pasku bocznym menu paska bocznego pokazuje w widoku drzewa. Sekcjami, blokami i ustawieniami można zarządzać w menu paska bocznego.
- Okno podglądu wyświetla szablon i uaktualnia się automatycznie po wprowadzeniu zmian. Możesz wybrać różne opcje wyświetlania na pasku menu, aby wyświetlić podgląd szablonu w wersji układu na komputer lub urządzenie mobilne. Można również aktywować inspektora podglądu, aby zarządzać zawartością wzorca szablonu w oknie podglądu.
Na tej stronie
- Dostęp do edytora szablonów
- Pasek menu
- Wyświetlanie dokumentacji, uzyskiwanie pomocy technicznej i sprawdzanie wersji szablonu
- Skorzystaj z pomocy w zakresie dostosowania
- Korzystanie ze skrótów klawiaturowych w edytorze szablonów
- Szablony
- Wyświetlanie podglądu szablonów z określonymi zasobami
- Inspektor podglądu
- Wyświetlanie różnych wielkości ekranu w edytorze szablonów
- Menu paska bocznego
- Sekcje i bloki
Dostęp do edytora szablonów
Dostęp do edytora szablonów można uzyskać w panelu administracyjnym Shopify.
W panelu administracyjnym Shopify przejdź do opcji: Sklep online > Szablony.
Obok szablonu, który chcesz edytować, kliknij opcję Dostosuj.
Pasek menu
Pasek menu zawiera informacje o szablonie, menu umożliwiające dostęp do dodatkowych informacji i różnych obszarów szablonu oraz elementy sterujące do dostosowywania szablonu.
Na pasku menu wyświetlane są następujące dodatkowe informacje i opcje nawigacji:
- Użyj przycisku
, aby powrócić do panelu administracyjnego Shopify. - Sprawdź nazwę szablonu.
- Sprawdź status szablonu. Twój opublikowany szablon wyświetla statusu Aktywny Label. Nieopublikowany szablon wyświetla wersję roboczą statusu Label.
- Użyj menu
, aby uzyskać dostęp do następujących dodatkowych opcji:
- Użyj 
Edytuj kod, aby otworzyć edytor kodu.
- Użyj opcji 
Edytuj zawartość domyślnego szablonu, aby edytować domyślną treść szablonu.
- Użyj opcji 
, aby otworzyć podgląd szablonu.
- Użyj opcji 
Wyświetl dokumentację, aby otworzyć dokumentację szablonu.
- Użyj opcji 
, aby przejrzeć wszystkie dostępne skróty klawiaturowe edytora szablonów.
- Użyj opcji 
Uzyskaj pomoc techniczną, aby uzyskać pomoc techniczną.
Dostęp do różnych szablonów i układów rynku można uzyskać w następujących menu:
Aby dostosować szablon, można użyć następujących elementów sterujących na pasku menu:
- Aktywuj lub dezaktywuj Sidekick.
- Aktywuj lub dezaktywuj inspektora podglądu.
- Zmień wielkość ekranu za pomocą elementów sterujących wielkością ekranu.
- Zarządzaj bieżącymi ustawieniami sesji za pomocą elementów sterujących cofaniem i ponawianiem.
- Użyj przycisku Zapisz, aby zapisać zmiany.
Wyświetlanie dokumentacji, uzyskiwanie pomocy technicznej i sprawdzanie wersji szablonu
Dostępne informacje o szablonie, takie jak wersja szablonu i informacje o programiście, a także łącza do dokumentacji szablonu i informacji pomocy technicznej, można wyświetlić w menu na pasku menu.
Skorzystaj z pomocy w zakresie dostosowania
Jeśli potrzebujesz pomocy w zakresie wprowadzania zmian w szablonie, możesz skontaktować się z twórcą Twojego szablonu.
Aby sprawdzić dostępność innych zasobów gotowych udzielić Ci pomocy w zakresie dostosowania szablonów, wyświetl Dodatkowe zasoby pomocy technicznej w zakresie szablonów.
Korzystanie ze skrótów klawiaturowych w edytorze szablonów
Do nawigacji i wykonywania czynności w edytorze szablonów można używać skrótów klawiaturowych.
| Kategoria | Czynność | Skrót w systemie Windows | Skrót w systemie macOS |
|---|---|---|---|
| Ogólne | Cofnij |
CTRL + Z
|
⌘ + Z
|
| Ponów |
CTRL + Y
|
⌘ + Y
| |
| Zapisz |
CTRL + S
|
⌘ + ⇧ + S
| |
| Zobacz wszystkie skróty |
CTRL + /
|
⌘ + /
| |
| Narzędzia | Inspektor podglądu |
CTRL + SHIFT + |
|
⌘ + ⇧ + |
|
| Tryb podglądu |
⊞ + CTRL + |
|
⌘ + ⌃ + |
| |
| Sidekick |
CTRL + .
|
⌘ + .
| |
| Nawigacja | Sekcje |
⊞ + CTRL + Z
|
⌘ + ⌃ + 1
|
| Ustawienia szablonu |
⊞ + CTRL + Z
|
⌘ + ⌃ + 2
| |
| Osadzenia aplikacji |
⊞ + CTRL + Z
|
⌘ + ⌃ + 3
| |
| Sekcje i bloki | Ukryj i wyświetl |
CTRL + SHIFT + H
|
⌘ + ⇧ + H
|
| Usuń |
SHIFT + ⭠
|
⇧ + ⌫
| |
| Wybierz poprzednie |
SHIFT + ←
|
⇧ + ▲
| |
| Wybierz następne |
SHIFT + →
|
⇧ + ▼
| |
| Otwórz wybrany element |
SHIFT + ENTER
|
⇧ + ▼
| |
| Rozwiń wszystkie sekcje |
CTRL + SHIFT + O
|
⌘ + ⇧ + O
| |
| Zwiń wszystkie sekcje |
CTRL + SHIFT + P
|
⌘ + ⇧ + P
|
Szablony
Do wszystkich wzorców szablonu można przejść, używając selektora strony znajdującego się w górnym pasku edytora szablonów.
Jeśli korzystasz z szablonu Online Store 2.0, masz również możliwość utworzenia nowego szablonu bezpośrednio poprzez selektor strony, klikając opcję Nowy szablon.
Wyświetlanie podglądu szablonów z określonymi zasobami
Można wyświetlić podgląd wyświetlania szablonu z dowolnym zgodnym zasobem w sklepie. Jeśli na przykład przeglądasz szablon produktu, możesz go przetestować z dowolnym produktem oferowanym w swoim sklepie.
Nadal konieczne jest przypisanie szablonu do zasobu w panelu administracyjnym Shopify.
Szablonów i zasobów można szukać również za pomocą paska wyszukiwania w selektorze strony w narzędziu Dodaj sekcję lub Dodaj blok lub w sekcji Osadzenia aplikacji.
Kroki:
W panelu administracyjnym Shopify przejdź do opcji: Sklep online > Szablony.
Obok szablonu, który chcesz edytować, kliknij opcję Dostosuj.
Z menu szablonów wybierz szablon, którego podgląd chcesz wyświetlić.
W menu bocznym, w sekcji Podgląd kliknij Zmień.
W menu Wybierz wskaż zasób, którego podgląd chcesz wyświetlić.
Inspektor podglądu
Inspektor podglądu pozwala na szybszą i bardziej intuicyjna nawigację do sekcji i bloków bezpośrednio z okna podglądu i znalezienie odpowiednich ustawień. Za pomocą inspektora podglądu możesz zmieniać kolejność lub ukrywać zduplikowane sekcje i bloki bezpośrednio z okna podglądu.
Inspektor podglądu jest dostępny dla wszystkich darmowych szablonów Shopify i jest domyślnie aktywowany. Kliknięcie przycisku 
spowoduje włączenie lub wyłączenie inspektora podglądu podczas sesji edycji.
Gdy inspektor podglądu jest włączony, możesz kliknąć dowolny opisany element, aby otworzyć odpowiednie ustawienie. Na urządzeniu mobilnym, gdy inspektor podglądu jest aktywowany, możesz kliknąć dowolny element, aby wybrać odpowiednie ustawienie. Możesz otworzyć dolny arkusz, aby dokonać zmian za pomocą tego wybranego ustawienia.
Inspektor podglądu wyświetla jedno z dwóch następujących obramowań wokół sekcji i bloków klikniętych w oknie podglądu:
- Niebieska linia ciągła wskazuje aktywną sekcję. Odpowiednie ustawienie w menu paska bocznego jest podświetlone na szaro.
- Niebieska linia wykropkowana wskazuje powiązany blok dla sekcji. Kliknięcie pozycji w oknie podglądu spowoduje otwarcie ustawień bloku lub sekcji.
Kliknięcie dowolnej części strony internetowej w oknie podglądu uruchamia ładowanie odpowiednich ustawień na pasku bocznym. Na urządzeniu mobilnym możesz kliknąć dwukrotnie, aby nawigować po witrynie, tak jak kupujący.
Dodaj sekcje i bloki w inspektorze podglądu
Korzystając z inspektora podglądu, możesz dodawać sekcje i bloki do swojego tematu bezpośrednio z okna podglądu. Aby użyć inspektora podglądu z aplikacji Shopify, naciśnij i przytrzymaj sekcję, aby nią zarządzać.
| Narzędzie | Opis |
|---|---|
| Dodaj sekcję | Przycisk Dodaj sekcję pojawia się na górze i na dole wybranej sekcji. Kliknij przycisk Dodaj sekcję, aby wstawić nową sekcję powyżej lub poniżej wybranej sekcji. |
| Dodaj blok | Przycisk Dodaj blok pojawia się po najechaniu kursorem na istniejący blok. Aby dodać blok, wskaż kursorem przycisk  . W wyskakującym okienku pojawi się menu z blokiem szablonu i aplikacji, które można dodać do wybranej sekcji. Kliknij blok, który chcesz dodać. Okno ustawień nowego bloku ładuje się w prawym pasku bocznym.
|
Narzędzia inspektora podglądu
Za pomocą inspektora podglądu możesz ukrywać, duplikować lub usuwać sekcje i bloki w edytorze szablonów.
| Narzędzie | Czynność | Opis |
|---|---|---|
 | Przenieś do poprzedniej pozycji | Kliknij ten przycisk, aby przenieść sekcję lub blok do następnej pozycji lub do poprzedniej pozycji za pomocą ikon strzałek w inspektorze podglądu. Jeśli wybrana sekcja znajduje się na górze strony, przycisk zostanie wyszarzony. Jeśli Twoja sekcja znajduje się na dole strony, nie możesz użyć przycisku  . |
| Przenieś do następnej pozycji | |
 | Duplikuj sekcję lub blok | Kliknij ten przycisk, aby powielić sekcję lub blok i ich zawartość. |
 | Ukryj sekcję lub blok | Kliknij ten przycisk, aby ukryć sekcję lub blok. Jeśli sekcja lub blok są ukryte, nie będzie można ich pokazać w inspektorze podglądu. Aby pokazać ukrycie sekcji lub bloku, możesz kliknąć przycisk  na pasku menu lub kliknąć przycisk w menu bocznym obok sekcji lub bloku. |
 | Usuń sekcję lub blok | Ten przycisk usuwa wybraną sekcję lub blok w inspektorze podglądu. |
Wyświetlanie różnych wielkości ekranu w edytorze szablonów
W edytorze szablonów można wyświetlać różne wielkości ekranu. Możesz zmienić edytor szablonów tak, aby wyświetlał rozmiary komputera, telefonu komórkowego lub pełnego ekranu, aby upewnić się, że edycje szablonów są optymalne dla różnych wielkości ekranu i sprawdzić alternatywne układy dla komputerów stacjonarnych i urządzeń mobilnych. Aby zmienić wielkość ekranu, kliknij poniższy przycisk na pasku menu:
- Kliknij przycisk
, aby przejść do wersji dla komputerów. - Kliknij przycisk
, aby przejść do wersji dla urządzeń mobilnych. - Kliknij przycisk
, aby przejść do trybu pełnoekranowego.
Cofanie i ponawianie czynności
Za pomocą przycisków i 
możesz cofnąć lub ponowić niezapisane zmiany. Po zapisaniu zmian nie można ich już przywrócić ani cofnąć. Po zapisaniu zmian nie można ich już przywrócić ani cofnąć.
Jeśli nie ma niezapisanych dostosowań do ponowienia, cofnięcia lub obu czynności, odpowiedni przycisk jest wyszarzony.
Menu paska bocznego
Całą zawartość szablonu przeglądanego w danej chwili na pasku bocznym menu paska bocznego pokazuje w widoku drzewa. Sekcjami, blokami i ustawieniami można zarządzać w menu paska bocznego.
Tryby paska bocznego
Edytor szablonów zawiera dwa tryby, dzięki którym można wykorzystywać całą przestrzeń na ekranie.
Tryb podwójnego paska bocznego jest dla szerszego okna przeglądarki i większych ekranów, a Tryb jednego paska bocznego jest dla węższych okien przeglądarki i mniejszych ekranów. Tryb paska bocznego określa, w którym miejscu edytora pojawia się panel ustawień.
Tryb podwójnego paska bocznego
W przypadku ekranu o rozdzielczości powyżej 1600 pikseli w poziomie i okna przeglądarki rozwiniętego do maksimum lub co najmniej na szerokość 1600 pikseli, zobaczysz dwa paski boczne. Pasek boczny po lewej stronie zawierać będzie panel nawigacji, a pasek po prawej stronie – panel ustawień.
Aby wyświetlić edytor szablonów w trybie jednego paska bocznego na dużym ekranie, zwęź okno przeglądarki do momentu, aż panel ustawień przesunie się nad pasek boczny nawigacji lub zniknie.
Tryb jednego paska bocznego
Węższe przeglądarki mają tylko jeden pasek boczny, aby zapewnić miejsce na podgląd szablonu. Po kliknięciu sekcji lub bloku w celu edycji sekcji panel ustawień otworzy się na pasku bocznym nad panelem nawigacji.
Sekcje i bloki
Na liście sekcji i bloków domyślnie wyświetlane są wszystkie bloki dla sekcji na stronie.
Sekcje, które zawierają nagłówek lub stopkę, są domyślnie zwinięte. Aby wyświetlić zawartość sekcji, kliknij przycisk 
znajdujący się obok nazwy sekcji.
Grupy sekcji
Sekcje są pogrupowane w następujących obszarach w każdym szablonie strony w edytorze szablonów:
- Obszar Nagłówek obejmuje nagłówek, pasek ogłoszeń i wszelkie aplikacje lub niestandardowy kod Liquid.
- Obszar Szablon obejmuje sekcje, które składają się na główną część Twojej strony. Na przykład sekcje szablonu mogą zawierać posty na blogu, kolaż, listy kolekcji lub niestandardowy kod Liquid.
- Obszar Stopka obejmuje stopkę, rejestrację w celu otrzymywania e-maili oraz wszelkie aplikacje lub niestandardowy Liquid.
Twój nagłówek i stopka są udostępniane na wszystkich stronach Twojego sklepu online. Na przykład, jeśli dodasz blok niestandardowego kodu Liquid do nagłówka, będzie on wyświetlany na wszystkich stronach produktów, stronie głównej i na wszystkich innych stronach.
Rozwijanie i zwijanie sekcjo oraz bloków
Rozwiń węzeł sekcji za pomocą przycisku , aby wyświetlić jej bloki, lub zwiń ją za pomocą przycisku 
, aby ukryć bloki. Z kolei ustawienia sekcji lub bloku wyświetlać można, klikając daną sekcję lub blok.
Przenoszenie sekcji i bloków
Możesz przenieść sekcję lub blok z jednego obszaru strony do innego za pomocą przycisku 
, umożliwiającego kliknięcie i przeciągnięcie sekcji lub bloku i upuszczenie w innej dostępnej lokalizacji.
Jeśli spróbujesz przenieść sekcję lub blok w miejscu, w którym nie jest to dozwolone, sekcja lub blok wróci do pierwotnej lokalizacji.
Usuwanie sekcji i bloków
Sekcję lub blok można usunąć z szablonu na dwa następujące sposoby:
Ustaw kursor obok nazwy sekcji, a następnie kliknij przycisk
: 
Kliknij nazwę sekcji, a następnie kliknij opcję Usuń sekcję w szczegółach ustawień sekcji:
Kroki:
W panelu administracyjnym Shopify przejdź do opcji: Sklep online > Szablony.
Obok szablonu, który chcesz edytować, kliknij opcję Dostosuj.
Na pasku bocznym edytora szablonów kliknij sekcję lub blok, który chcesz usunąć.
Kliknij opcję Usuń sekcję lub Usuń blok.
Kliknij Zapisz. Jeśli edytujesz opublikowany temat, kliknij Publikuj, aby zapisać swoje zmiany i uaktywnić je w swoim sklepie.
Ukrywanie sekcji i bloków
Dowolną sekcję lub blok można ukryć za pomocą przycisku :
