Rozwiązywanie problemów z szablonem sklepu online

Obrazy mogą wyświetlać się inaczej, niż oczekujesz, ale może to być spowodowane tym, że sam obraz nie jest kompatybilny z jego zastosowaniem w szablonie. Sprawdź, czy używany obraz ma prawidłowe wymiary. Zapoznaj się z poniższą listą typowych problemów z wyświetlaniem, które mogą wystąpić podczas przesyłania niekompatybilnego obrazu:

• Jeśli nagłówek jest wyświetlany jako większy, a obraz logo jako mniejszy niż oczekiwano, może to być spowodowane pustą przestrzenią w pliku obrazu logo. Pusta przestrzeń w pliku obrazu logo może powodować, że logo będzie wyświetlane jako mniejsze, a nagłówek jako większy. Edytuj plik obrazu, aby upewnić się, że jest przycięty wokół logo i nie ma w nim pustej przestrzeni.
• Jeśli obraz w pokazie slajdów jest przycinany, jest to działanie celowe, które ma zapewnić, że obrazy będą wyświetlane tak samo na urządzeniach mobilnych, jak i na komputerach. Ponieważ zawartość na ekranie urządzenia mobilnego jest znacznie mniejsza, jej zmniejszenie mogłoby spowodować utratę wielu szczegółów. Zamiast tego zawartość jest przycinana w celu zapewnienia, że szczegóły nie zostaną utracone. Obraz w orientacji pionowej (wyższy niż szerszy) również może zajmować dużo miejsca na ekranie komputera. Dlatego właśnie obrazy w pokazie slajdów mają maksymalną wysokość. Możesz dodać punkt centralny do obrazów w pokazie slajdów, aby punkt centralny zawsze znajdował się na środku obrazu w pokazie slajdów.

  Opcja adaptacyjnej wysokości: wiele szablonów Shopify zawiera ustawienie adaptacyjnej wysokości dla pokazów slajdów, które dostosowuje wysokość pokazu slajdów do wysokości pierwszego slajdu, zmniejszając przycinanie na ekranach o różnych rozmiarach. Ta funkcja jest dostępna we wszystkich obecnie obsługiwanych szablonach opracowanych przez Shopify.

• Jeśli obraz GIF nie wyświetla się prawidłowo, a został dodany do witryny sklepu za pomocą edytora tekstu sformatowanego (np. w opisie produktu lub w poście na blogu), przyczyną może być rozmiar obrazu. Aby to naprawić, kliknij obraz GIF w edytorze tekstu sformatowanego, a następnie kliknij opcję Edytuj obraz. W menu rozwijanym Rozmiar obrazu wybierz opcję Oryginalny. Następnie możesz zmienić rozmiar obrazu GIF, klikając i przeciągając jego rogi do wewnątrz, aby go zmniejszyć, lub na zewnątrz, aby go powiększyć.
• Jeśli kolory obrazów w witrynie sklepu znacznie różnią się od kolorów oryginalnego obrazu, może to oznaczać, że obrazy nie mają standardowego profilu kolorów sRGB (standard Red Green Blue). Aby naprawić tę zmianę kolorów, zapisz plik w aplikacji do edycji zdjęć z profilem sRGB. Typowe określenia tej operacji to: „Optymalizuj dla stron WWW”, „Dostosuj obraz dla stron WWW” lub „Zapisz dla stron WWW”. Dowiedz się więcej o profilach kolorów.
• Jeśli obrazy produktów na stronach kolekcji nie są wyrównane, może być konieczne dostosowanie proporcji w plikach obrazów produktów, tak aby miały ten sam stosunek wysokości do szerokości, a następnie ponowne przesłanie obrazów. Możesz również użyć aplikacji do edycji obrazów z Shopify App Store.

Zapoznaj się z poniższymi problemami i krokami, które pomogą Ci je rozwiązać:

• Brakujące produkty: Jeśli w witrynie Twojego sklepu brakuje produktów, sprawdź Status i kanały sprzedaży w sekcji Publikowanie produktu w panelu administracyjnym Shopify. Upewnij się, że status produktu to Aktywny i że produkt jest dostępny w kanale Sklep online.
• Brakujące kolekcje: Jeśli w witrynie Twojego sklepu brakuje kolekcji, sprawdź kanały sprzedaży w sekcji Publikowanie kolekcji w panelu administracyjnym Shopify. Upewnij się, że kolekcja jest dostępna w kanale Sklep online i że została dodana do menu.
• Kolekcje są wyświetlane, ale brakuje produktów: Jeśli kolekcje są wyświetlane, ale brakuje w nich produktów, sprawdź filtry tagów dla danej kolekcji w ustawieniach Menu. Upewnij się, że w polu Filtruj kolekcję według tagów nie ma żadnych tagów, które mogłyby uniemożliwić wyświetlanie produktów.
• Nieprawidłowa waluta: Jeśli waluta nie jest wyświetlana prawidłowo dla produktów lub w kolekcjach, sprawdź opcję Wyświetlanie waluty w sekcji Domyślne ustawienia sklepu w menu Ustawienia > Ogólne, aby upewnić się, że nie ma tam żadnego dodatkowego kodu. Dowiedz się więcej o formatowaniu sposobu wyświetlania waluty klientom.
• Niektóre produkty wyświetlają się inaczej: Jeśli niektóre produkty lub kolekcje wyświetlają się inaczej niż pozostałe, sprawdź Szablon przypisany do tych produktów lub kolekcji w panelu administracyjnym Shopify.
• Nie można edytować szablonów produktów lub kolekcji: Jeśli domyślne szablony produktów lub kolekcji są wyszarzone i nie można ich wybrać w edytorze szablonów, musisz udostępnić co najmniej 1 produkt lub kolekcję w kanale sprzedaży Sklep online. Nie możesz edytować tych domyślnych szablonów bez produktów lub kolekcji dostępnych do podglądu zmian. Dowiedz się więcej o zmianie dostępności kolekcji i ustawianiu dostępności produktów w kanałach sprzedaży.

Jeśli przetłumaczona treść nie wyświetla się prawidłowo lub brakuje jej w witrynie sklepu, może to oznaczać, że tłumaczenia tej treści są nieaktualne lub ich brakuje. Treść może również znajdować się w określonym szablonie dla danego rynku. Za każdym razem, gdy dodajesz nową treść w języku domyślnym, pamiętaj o ponownym uruchomieniu automatycznego tłumaczenia lub ręcznym dodaniu nowych tłumaczeń.

Przetłumaczona treść może mieć następujące statusy:

• Przetłumaczono: treść ma dostępne tłumaczenia.
• Nieaktualne: treść w języku domyślnym została zaktualizowana, ale tłumaczenia nie odzwierciedlają żadnych aktualizacji.
• Nieprzetłumaczone: brak tłumaczeń dla tego typu treści.

Przeglądając przetłumaczoną treść, zaktualizuj wszystkie nieprzetłumaczone lub nieaktualne treści. Po wykonaniu tej czynności przetłumaczona treść powinna wyświetlać się prawidłowo.

Dowiedz się więcej o tłumaczeniu i lokalizacji swojego sklepu.

Jeśli w witrynie sklepu i w edytorze szablonów wyświetlane są inne informacje, sprawdź edytowany wzorzec szablonu. Może być konieczne wprowadzenie zmian w celu zaktualizowania wzorców szablonu, aby wyświetlały prawidłowe informacje.

Nadpisania rynków umożliwiają tworzenie różnych witryn sklepów dla różnych rynków i wyświetlanie przetłumaczonych treści. Możliwe, że podczas wprowadzania aktualizacji nieświadomie dokonano zmian dla określonego rynku lub w ramach B2B. Zlokalizuj treść za pomocą menu rozwijanego Rynek w edytorze szablonów, aby upewnić się, że znajduje się ona na właściwych rynkach.

Dowiedz się więcej o nadpisaniach rynków.

Wszystkie szablony dostępne w sklepie Shopify Theme Store są szablonami responsywnymi, co oznacza, że szablon dostosowuje się do wielkości ekranu. W edytorze szablonów można podczas edycji przełączać widok wielkości ekranu, aby sprawdzić, czy strony i obrazy wyświetlają się prawidłowo. Dowiedz się więcej o wyświetlaniu różnych wielkości ekranu w edytorze szablonów.

Wiele sekcji i bloków ma ustawienia dla urządzeń mobilnych, które możesz dostosować. Na przykład w sekcji Powiązane produkty możesz ustawić opcję Liczba kolumn na urządzeniach mobilnych. Możesz przejrzeć ustawienia sekcji związane z urządzeniami mobilnymi dla każdego wzorca, aby rozwiązać wszelkie problemy z wyświetlaniem na ekranach urządzeń mobilnych.

Niektóre funkcje szablonu mogą być wyświetlane inaczej na urządzeniach mobilnych niż na komputerach, aby zapewnić dostępność szablonu na ekranach o wszystkich wielkościach. Na przykład na ekranie komputera pokaz slajdów może mieć nakładkę tekstową, w której tekst jest wyświetlany na obrazie, często z przezroczystością koloru obrazu lub cieniem tekstu. Jednak na ekranach urządzeń mobilnych tekst może być wyświetlany pod pokazem slajdów. Jest to celowa funkcja ułatwiająca dostępność, która zapewnia czytelność tekstu na ekranie o dowolnej wielkości. Gdyby tekst był nakładką, na urządzeniach mobilnych byłby wyświetlany jako bardzo mały, co utrudniałoby jego odczytanie.

Jeśli sekcja polecanej kolekcji lub strony kolekcji mają niespójne rozmiary lub nie są wyrównane podczas przeglądania witryny sklepu na urządzeniu mobilnym, może to być spowodowane niespójnymi proporcjami obrazów. Siatki obrazów, takie jak obrazy produktów wyświetlane w ramach kolekcji lub polecanej kolekcji, są tworzone jako responsywne dla danej wielkości ekranu. Jeśli obrazy w siatce mają niespójne proporcje, mogą być wyświetlane inaczej w zależności od wielkości ekranu. Kwadratowe obrazy produktów o wymiarach 2048 na 2048 pikseli zazwyczaj najlepiej sprawdzają się w siatkach produktów. Zaktualizuj obrazy, aby miały spójne proporcje, co zapewni optymalizację na wszystkich wielkościach ekranu. Dowiedz się więcej o proporcjach obrazu.

Czasami kod HTML dodany w edytorze tekstu sformatowanego jest w konflikcie z kodem szablonu. Jeśli problem występuje na jednej stronie, takiej jak strona produktu, strona lub post na blogu, może to być spowodowane dodatkowym kodem HTML. Czasami może on zostać dodany podczas kopiowania i wklejania tekstu z innej witryny.

Przejrzyj kod HTML

Możesz przejrzeć kod HTML w edytorze tekstu sformatowanego.

Kroki:

1. Przejdź do strony w panelu administracyjnym.
2. Kliknij przycisk Wyświetl HTML, aby przejrzeć kod HTML.
3. Znajdź kod HTML, który może powodować problemy z wyświetlaniem, i usuń go.
4. Kliknij Zapisz.

Wyczyść formatowanie

Możesz zaznaczyć fragment tekstu i wyczyścić formatowanie HTML.

Kroki:

1. Przejdź do strony w panelu administracyjnym.
2. Zaznacz tekst z problemami z formatowaniem.
3. Kliknij przycisk 🚫.
4. Kliknij Zapisz.

Dowiedz się więcej o edytorze tekstu sformatowanego.

Jeśli witryna sklepu zawiera kod, który przekierowuje użytkowników na adresy URL, które nie są połączone ze sklepem, sprawdź, czy przekierowanie zostało dezaktywowane podczas odwiedzania edytora szablonów.

Na przykład tego typu przekierowanie można dodać do witryny sklepu, aby kierować klientów do różnych sklepów Shopify w zależności od ich lokalizacji. Tego typu kod przekierowania może znajdować się w szablonie lub w zainstalowanej aplikacji.

Aby sprawdzić, czy przekierowanie nie zakłóca działania edytora, użyj odwołania do zmiennej window.Shopify.designMode w kodzie JavaScript, aby dezaktywować przekierowanie podczas odwiedzania edytora szablonów. Ta zmienna ma wartość true, gdy witryna sklepu jest ładowana w edytorze, a false, gdy nie jest.

Jeśli masz bloki zwijane lub inne bloki szablonu, które wyświetlają tę samą treść na wszystkich stronach produktów, musisz skonfigurować dynamiczne źródła za pomocą metapól. Zdarza się to często, gdy sprzedawcy dodają do jednego produktu informacje specyficzne dla produktu, takie jak składniki lub instrukcje pielęgnacji, ale są one wyświetlane na wszystkich produktach.

Zwijane bloki wyświetlają ten sam tekst na wszystkich produktach

Gdy dodasz treść bezpośrednio do zwijanego bloku w edytorze szablonów, treść ta będzie wyświetlana na wszystkich stronach produktów. Aby wyświetlić treść specyficzną dla produktu, musisz użyć dynamicznych źródeł z metapolami:

1. W panelu administracyjnym Shopify przejdź do opcji Ustawienia > Metapola > Produkty.
2. Kliknij opcję Dodaj definicję.
3. Wprowadź Nazwę metapola, a następnie kliknij opcję Wybierz typ zawartości.
4. Wybierz opcje Tekst i Tekst wielowierszowy.
5. Kliknij Zapisz.
6. Przejdź do strony produktu w panelu administracyjnym i przewiń do sekcji metapól na dole strony.
7. Dodaj treść specyficzną dla produktu do utworzonego metapola.
8. W edytorze szablonów przejdź do wzorca produktu i znajdź sekcję Zwijany wiersz.
9. W ustawieniu Zawartość wiersza kliknij przycisk .
10. Wybierz metapole z dostępnych opcji.
11. Zapisz zmiany.

Teraz każdy produkt będzie wyświetlać własną treść, gdy metapole zostanie wypełnione, a żadna treść nie będzie wyświetlana, jeśli metapole dla danego produktu jest puste.

Dowiedz się więcej o wyświetlaniu metapól w sklepie online i używaniu metapól oraz metaobiektów z dynamicznymi źródłami.

Jeśli w kodzie szablonu występuje błąd składni, w edytorze szablonów wyświetli się komunikat ostrzegawczy Znaleziono błąd HTML lub Błąd szablonu. Komunikat o błędzie wskazuje plik Liquid, który zawiera błąd.

Komunikat ostrzegawczy Nie można odnaleźć szablonu, którego szukasz może zostać wyświetlony w przypadku uszkodzonego kodu HTML. Strona może nie wczytać się w edytorze szablonów z wielu powodów, takich jak:

• problemy z połączeniem sieciowym
• nieprawidłowy kod Liquid w szablonie

Możesz zlokalizować zmiany w kodzie szablonu i go poprawić. Jeśli potrafisz zidentyfikować istniejący plik, którego dotyczy problem, możesz przywrócić jego dostępną poprzednią wersję w widoku Oś czasu edytora kodu.

Kroki:

1. Kliknij plik sekcji .liquid, do którego prowadzi link w komunikacie o błędzie, lub przejrzyj pliki pod kątem ostatnich zmian. Spowoduje to przejście do strony Edytuj HTML/Kaskadowe arkusze stylów (CSS), a plik otworzy się w edytorze kodu.
2. Przejrzyj kod w pliku i spróbuj znaleźć nieprawidłowy kod HTML lub Liquid. Edytor kodu wyświetla potencjalne błędy składni na czerwono. Do typowych problemów należą:
   • Nadmiarowe zamykające tagi HTML, na przykład zamykający </div> bez otwierającego <div>
   • Nadmiarowe niezamknięte tagi HTML, na przykład otwierający <div> bez zamykającego </div>
   • Nieprawidłowo sformatowane tagi HTML, na przykład <div class="my-class" bez znaku >
   • Nieprawidłowo sformatowany kod Liquid
   • Uszkodzony kod HTML w dołączonym pliku fragmentu szablonu
3. Po znalezieniu problemu popraw kod w pliku szablonu. Jeśli użyjesz widoku Oś czasu edytora kodu do wyboru poprzedniej wersji i klikniesz Przywróć zawartość, cała zawartość pliku zostanie zastąpiona. Najpierw skopiuj obecną zawartość pliku w bezpieczne miejsce, jeśli chcesz zachować ewentualne zmiany.
4. Kliknij Zapisz.
5. Kliknij opcję Edytuj szablon, aby wrócić do edytora szablonów i upewnić się, że komunikat o błędzie zniknął.
6. Przejdź do witryny sklepu, aby sprawdzić, czy wyświetla się zgodnie z oczekiwaniami.

Błąd „Przekroczono maksymalną liczbę unikalnych identyfikatorów”

Jeśli na stronie głównej wyświetla się komunikat o błędzie Liquid, taki jak „Przekroczono maksymalną liczbę unikalnych identyfikatorów dla all_products”, zazwyczaj oznacza to, że dodano zbyt wiele sekcji Polecany produkt do strony głównej (zazwyczaj więcej niż 20 sekcji w większości szablonów).

Aby rozwiązać ten problem:

1. W panelu administracyjnym Shopify przejdź do opcji Sklep online > Szablony.
2. Znajdź bieżący szablon i kliknij opcję Edytuj szablon.
3. Przejdź do strony głównej.
4. Usuń niektóre sekcje Polecany produkt, aby nie przekroczyć limitów szablonu.
5. Zamiast tego rozważ użycie sekcji Polecana kolekcja, które mogą wyświetlać wiele produktów w bardziej wydajny sposób i poprawić wydajność sklepu.

Ikony płatności są zazwyczaj domyślnie umieszczane w stopkach większości szablonów, aby pokazać klientom, które metody płatności akceptujesz. Jeśli ikony płatności nie pojawiają się w stopce szablonu, możesz sprawdzić następujące kwestie:

1. W edytorze szablonów przejdź do sekcji Stopka i sprawdź, czy ustawienie Pokaż ikony płatności jest aktywne.
2. W panelu administracyjnym Shopify przejdź do opcji Ustawienia > Płatności i sprawdź, czy jest co najmniej jedna aktywna metoda płatności. Niektóre metody płatności mogą wymagać ukończenia konfiguracji konta, zanim ich ikony zostaną wyświetlone.
3. Jeśli używasz zewnętrznej bramki płatniczej, ikony płatności mogą się nie wyświetlać ze względu na ograniczenia platformy.

Jeśli mimo sprawdzenia tych ustawień ikony płatności nadal się nie wyświetlają, być może musisz get support for your theme.