Przełącznik języków w Shopify: jak go dodać i dostosować

Przełącznik języka Shopify to przydatna funkcja natywna dla sklepów wielojęzycznych. Urządzenie to pozwala klientom przeglądać Twoją witrynę w preferowanym języku, umożliwiając Twojej marce wejście na nowe rynki międzynarodowe. Możesz również dostosować tę funkcję za pomocą kodu, aby była bardziej zgodna z estetyką Twojej marki.

Jednak ta wbudowana funkcja ma swoje wady, w tym ograniczone możliwości dostosowania w porównaniu z rozwiązaniami innych producentów.

Dzięki zintegrowaniu dedykowanej aplikacji tłumaczeniowej Shopify właściciele sklepów mogą korzystać z dodatkowych funkcji, które poprawiają funkcjonalność, zwiększają zaangażowanie użytkowników i zajmują się samym tłumaczeniem. Na przykład nasza własna aplikacja tłumaczeniowa Shopify Weglot oferuje unikalne opcje projektowania i rozmieszczenia przełącznika języków, dzięki czemu można ją dostosować do każdego układu sklepu. Ponadto oferuje znacznie więcej niż tylko możliwość przełączania języków przez użytkowników. Ale o tym później.

W tym artykule pokażemy Ci, jak najlepiej wykorzystać natywny przełącznik języków Shopify, a następnie omówimy Weglot Shopify, przedstawiając najlepsze praktyki dotyczące tłumaczenia Twojego sklepu i zapewniania optymalnego doświadczenia użytkownika.

Kluczowe punkty

• Wbudowana funkcja zmiany języka w Shopify obsługuje wiele języków, ale oferuje ograniczone możliwości dostosowania w porównaniu z aplikacjami innych firm.
• Weglot automatyczne tłumaczenie stron internetowych oraz szerokie możliwości dostosowania przełącznika języków. Umożliwia również pełną edycję ręczną i poprawia wielojęzyczne SEO poprzez tworzenie adresów URL dostosowanych do konkretnego języka oraz wdrażanie tagów hreflang.

Przełącznik języków w Shopify: przegląd i konfiguracja

Na początek przyjrzyjmy się wbudowanemu przełącznikowi języków Shopify. Jak już wspomnieliśmy, funkcja ta pozwala właścicielom sklepów obsługiwać wiele języków, co w naturalny sposób poprawia komfort użytkowania (UX) dla klientów międzynarodowych.

Obsługiwane jest zarówno ręczne wybieranie języka, jak i automatyczne przekierowanie językowe oparte na ustawieniach przeglądarki odwiedzających. Automatyczne przekierowanie językowe oparte na ustawieniach przeglądarki odwiedzających można włączyć w sekcji Sklep internetowy > Ustawienia > Automatyczne przekierowanie > Język, pod warunkiem, że opublikowano odpowiednie wersje językowe i udostępniono je na rynkach docelowych.

Jeśli wbudowany przełącznik spełnia Twoje wymagania, oto jak go skonfigurować.

Konfigurowanie języków i metod tłumaczenia

Zanim w ogóle pojawi się przełącznik języków, Twój sklep Shopify musi faktycznie oferować więcej niż jeden język. Jeśli masz już skonfigurowane tłumaczenia, możesz przejść od razu do następnej sekcji. W przeciwnym razie oto jak zacząć…

Przejdź do Ustawienia > Języki > Dodaj język. Wybierz jedną z ponad 20 obsługiwanych opcji, od hiszpańskiego po japoński. Pamiętaj, że kliknięcie przycisku Opublikuj obok każdego języka jest konieczne, aby tłumaczenia były dostępne dla klientów. Jeśli pominiesz ten krok, Twój nowy przełącznik nie będzie miał nic do przełączenia.

Wbudowana aplikacja Shopify „Translate & Adapt” to jedna z opcji umożliwiających prowadzenie sklepu wielojęzycznego. Aplikacja ta automatycznie i bezpłatnie tłumaczy podstawowe treści na 2 języki (lub na 8, jeśli sklep ma siedzibę w Wielkiej Brytanii, Szwajcarii lub jednym z 10 krajów UE) – wystarczy dodać wybrane języki w sekcji „Ustawienia” > „Aplikacje ”.

Aby zarządzać danymi zbiorczo, wyeksportuj dane językowe swojej witryny w formacie CSV z sekcji Ustawienia > Języki > Eksportuj. Edytuj tłumaczenia zbiorczo, a następnie zaimportuj je ponownie – najważniejsze jest, aby nigdy nie zmieniać kodu Liquid znajdującego się w nawiasach klamrowych {{ }} lub {% %}. To silnik szablonów Shopify, a nie zwykły tekst.

Jeśli wolisz pełną kontrolę ręczną, Shopify umożliwia sklepom obsługę nawet 20 języków (30 w przypadku Shopify Plus). Przejdź do sekcji Ustawienia > Języki > Działania > Zamów tłumaczenia, aby zamówić profesjonalne usługi tłumaczeniowe bezpośrednio z panelu administracyjnego Shopify.

Po opublikowaniu języków i zastosowaniu tłumaczeń możesz zająć się przełącznikiem.

Znajdowanie i konfigurowanie wbudowanego przełącznika motywu

Wbudowany przełącznik języka w Shopify zazwyczaj znajduje się w edytorze motywu, w sekcji „Nagłówek ” lub „Stopka ”. Jego dokładna lokalizacja i opcje dostosowywania zależą od motywu i wersji.

Wykonaj następujące czynności:

1. W panelu administracyjnym Shopify przejdź do sekcji Sklep internetowy > Szablony > Edytuj szablon.
2. Otwórz sekcję „Nagłówek” lub „Stopka”, w zależności od tego, gdzie ma się pojawić przełącznik.
3. Poszukaj opcji o nazwie np. „Włącz selektor języka”, „Pokaż selektor języka” lub „Lokalizacja”.
4. Włącz selektor i kliknij „Zapisz”.

Gdy w Twoim sklepie pojawi się kilka opublikowanych wersji językowych dostępnych na rynku danego klienta, przełącznik powinien wyświetlać dostępne opcje językowe.

Darmowe szablony Shopify, w tym Dawn, Craft, Refresh, Sense i Studio, obsługują selektory języków zarówno w nagłówku, jak i stopce w aktualnych wersjach. Darmowe szablony Online Store 2.0 od wersji 9.0.0 oraz szablony z rodziny Horizon obsługują umieszczanie selektorów języków w nagłówku bez konieczności stosowania dodatkowego kodu.

W przypadku motywów premium opcje rozmieszczenia mogą się różnić. Na przykład motyw „Impulse” umożliwia wybór języka na pasku narzędzi w nagłówku oraz w stopce, podczas gdy inne motywy mogą oferować inne ustawienia lub lokalizacje. Jeśli nie możesz znaleźć tej opcji, zapoznaj się z dokumentacją twórcy motywu.

Starsze motywy mogą oferować mniej opcji dostosowywania. Jeśli dany motyw nie obsługuje preferowanego przez Ciebie rozmieszczenia, może być konieczna edycja szablonów Liquid, zmiana motywu na nowszy lub skorzystanie z aplikacji do tłumaczenia, która posiada własne narzędzia do sterowania rozmieszczeniem.

Wygląd przełącznika zależy również od wybranego motywu. Wbudowane selektory zazwyczaj wyświetlają nazwy języków i dostosowują się do czcionek, kolorów oraz stylu Twojego sklepu. Niektóre motywy oferują dodatkowe ustawienia stylistyczne, natomiast bardziej zaawansowane dostosowanie może wymagać użycia arkusza CSS.

Sprawdź również układ strony na urządzeniach mobilnych, korzystając z podglądu szablonu w Shopify. W zależności od szablonu przełącznik może znajdować się w stopce, nagłówku lub menu nawigacyjnym wersji mobilnej. Upewnij się, że klienci mogą go łatwo znaleźć i używać na mniejszych ekranach, a jeśli wyświetlasz oba elementy, umieść selektor kraju/regionu w pobliżu.

Jak dodać selektor języka do nagłówka Shopify?

Możesz dodać przełącznik języka do nagłówka sklepu Shopify za pomocą wbudowanych ustawień szablonu lub skorzystać z edytora przełączników na stronie Weglot, aby umieścić konfigurowalny przełącznik bez konieczności edytowania kodu szablonu.

Aby dodać natywny selektor języka Shopify, zgodnie z wcześniejszymi wskazówkami, przejdź do panelu administracyjnego Shopify > Sklep internetowy > Szablony > Edytuj szablon, otwórz sekcję „Nagłówek”, znajdź opcję „Włącz selektor języka” lub podobne ustawienie, włącz selektor, a następnie kliknij „Zapisz”.

Jeśli korzystasz z Weglot, otwórz Weglot : Pulpit nawigacyjny > Ustawienia > Przełącznik języka > Edytor przełącznika. Przeciągnij przełącznik w wybrane miejsce w nagłówku i kliknij „Zapisz”. Wybierz obszar, który pojawia się w tym samym miejscu na wszystkich stronach sklepu, aby przełącznik pozostawał na swoim miejscu podczas poruszania się klientów po stronie.

Aby zapewnić bardziej precyzyjne pozycjonowanie, Weglot obsługuje również następujący znacznik zastępczy HTML:

<div id="weglot_here"></div>

Możesz dodać go do sekcji lub bloku „Custom Liquid” w obszarze nagłówka motywu, o ile jest to obsługiwane, lub wstawić go do odpowiedniego pliku motywu. Następnie Weglot wyświetli przełącznik w miejscu, w którym pojawia się symbol zastępczy. Dokładne umiejscowienie zależy od układu motywu.

Po skonfigurowaniu zawsze przetestuj przełącznik na komputerze stacjonarnym i urządzeniu mobilnym, w tym na stronach produktów i kolekcji. Przetestuj również proces realizacji transakcji, ponieważ Shopify zarządza nim oddzielnie od nagłówka witryny sklepu, więc dodanie przełącznika w tym miejscu nie powoduje automatycznego dodania go do procesu realizacji transakcji. Jeśli korzystasz z integracji Shopify Markets oferowanej przezWeglot, Shopify dostosowuje język realizacji transakcji na podstawie wcześniejszego wyboru klienta, a sam przełącznik Weglot nie pojawia się podczas realizacji transakcji.

Dodawanie przełącznika za pomocą kodu Liquid

Jeśli Twój motyw Shopify nie oferuje odpowiedniego miejsca na selektor języka ani opcji projektowych, których potrzebujesz, możesz stworzyć własny selektor za pomocą języka Liquid. Wymaga to edycji kodu motywu, więc przed rozpoczęciem pracy wykonaj kopię zapasową.

Aby skonfigurować i dostosować przełącznik języka Shopify, należy wykonać następujące czynności:

1. Na stronie administracyjnej Shopify przejdź do sekcji Ustawienia > Języki i dodaj języki, które chcesz obsługiwać. Upewnij się, że są one dostępne na Twoich rynkach docelowych oraz że dodałeś niezbędne tłumaczenia.
2. Przejdź do sekcji „Sklep internetowy” > „Motywy ” i kliknij opcję „Edytuj kod ” w menu z trzema kropkami swojego motywu.
3. Znajdź plik header.liquid w katalogu Sections. Dokładna nazwa pliku i odpowiednie miejsce wstawienia zależą od Twojego motywu, więc przed wprowadzeniem zmian sprawdź jego strukturę.
4. Znajdź odpowiednie miejsce w pliku header.liquid (zwykle w pobliżu menu nawigacyjnego) i wklej następujący snippet kodu Liquid:

{% if localization.available_languages.size > 1 %}
  <div class="page-width custom-language-topbar">
    {% form 'localization', id: 'header-language-form' %}
      <div class="shopify-language-switcher">
        <label for="header-language-selector">Language</label>

        <select
          id="header-language-selector"
          name="language_code"
        >
          {% for language in localization.available_languages %}
            <option
              value="{{ language.iso_code }}"
              {% if language.iso_code == localization.language.iso_code %}selected{% endif %}
            >
              {{ language.endonym_name | escape }}
            </option>
          {% endfor %}
        </select>

        <button type="submit">Apply</button>
      </div>
    {% endform %}
  </div>
{% endif %}

Położenie kodu Liquid decyduje o tym, gdzie na stronie sklepu pojawi się przełącznik języka. Na przykład umieszczenie go w obszarze nawigacji nagłówka może spowodować wyświetlenie go obok menu, natomiast umieszczenie go w oddzielnym kontenerze nad nawigacją może stworzyć osobny pasek wyboru języka.

Ten kod wykorzystuje formularz lokalizacji platformy Shopify do pobrania listy języków dostępnych dla klientów. Wyświetla każdy język pod jego rodzimą nazwą, np. „Français” dla języka francuskiego, i zaznacza bieżący język jako wybrany. Klienci wybierają język z listy rozwijanej i klikają przycisk „Zastosuj”, aby zmienić język.

Jeśli w Twoim motywie w tym samym miejscu znajduje się już selektor języka, wyłącz go za pomocą edytora motywów, aby uniknąć powtórzeń.

5. Za pomocą CSS można dostosować wyrównanie, kolory, odstępy i obramowania przełącznika. W edytorze motywów otwórz opcję „Ustawienia motywu” > „Niestandardowy CSS” i dodaj poniższy przykład:

.custom-language-topbar {
  display: flex;
  justify-content: flex-end;
  padding-top: 8px;
  padding-bottom: 8px;
}

.custom-language-topbar .shopify-language-switcher {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.shopify-language-switcher select {
  font: inherit;
  font-size: 16px;
  color: #007bff;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 8px;
}

.shopify-language-switcher select:hover {
  border-color: #555;
}

.shopify-language-switcher select:focus-visible {
  outline: 2px solid #0056b3;
  outline-offset: 2px;
}

6. Po wprowadzeniu zmian kliknij „Zapisz”, aby je zastosować. Przełącznik języka powinien teraz pojawić się w Twoim sklepie zgodnie z Twoimi preferencjami. Wyświetl podgląd strony sklepu na komputerze stacjonarnym i urządzeniu mobilnym.

Ulepszanie sklepów Shopify dzięki przełącznikowi języków Weglot

Weglot to oparte na sztucznej inteligencji narzędzie do tłumaczenia stron internetowych, które dodaje przełącznik języka do Twojego sklepu Shopify bez konieczności wprowadzania jakichkolwiek zmian w szablonie. Chociaż natywny przełącznik języka Shopify działa poprawnie, dedykowane aplikacje tłumaczeniowe dla Shopify, takie jak Weglot oferują większe możliwości dostosowania, a także dodatkowe funkcje tłumaczeniowe dla Shopify przeznaczone dla tych, którzy chcą naprawdę zlokalizować doświadczenie zakupowe dla swoich międzynarodowych klientów.

W przeciwieństwie do przełącznika języków Shopify, Weglot tłumaczy 100% treści witryny z ponad 110 języków, w tym strony płatności, powiadomienia e-mailowe i metadane SEO, optymalizując ją pod kątem wyszukiwarek.

Dzięki Weglot cały sklep Shopify korzysta z automatycznego tłumaczenia, przyspieszając projekty ekspansji. W porównaniu do zatrudniania indywidualnych tłumaczy dla każdego języka, automatyzacja Weglotznacznie skraca czas wprowadzania na rynek nowych wersji językowych.

Jednak możliwości Weglotnie kończą się na automatycznym tłumaczeniu. Dzięki Weglot masz pełną kontrolę nad edycją przetłumaczonych treści na swojej stronie. Możesz także zatrudnić profesjonalnych tłumaczy bezpośrednio za pośrednictwem platformy.

Możesz również błyskawicznie generować tłumaczenia zgodne z wizerunkiem marki dzięki modelowi tłumaczeniowemu opartemu na sztucznej inteligencji serwisu Weglot. Model ten uczy się na podstawie Twoich instrukcji, słownika terminów oraz historii dotychczasowych tłumaczeń, aby natychmiast dostarczać tłumaczenia uwzględniające kontekst, które brzmią tak, jakbyś to Ty je napisał.

Weglot integruje się również z istniejącymi funkcjami Shopify i popularnymi aplikacjami innych firm, w tym z dostosowywaniem motywów, takich jak Dawn i Prestige. Eliminuje to kłopoty związane z zarządzaniem wieloma sklepami lub ręcznymi tłumaczeniami, ponieważ można dodawać, publikować, cofać publikację lub usuwać języki w razie potrzeby.

Weglot zajmuje się nie tylko tłumaczeniami, Weglot wielojęzycznym pozycjonowaniem stron internetowych, które stanowi podstawę działania aplikacji. Platforma automatycznie tworzy subdomeny lub podkatalogi dla każdej wersji językowej i implementuje tagi hreflang, optymalizując witrynę pod kątem lokalnych wyszukiwarek. Ponadto nasz Visual Editor umożliwia łatwą personalizację tłumaczeń, umożliwiając dostosowanie ich do stylu Twojej marki.

A co najlepsze, skonfigurowanie Weglot dostosowanie przełącznika języków zajmuje tylko chwilę! Zobaczmy, jak to zrobić.

Konfiguracja Weglot w sklepie Shopify

Konfiguracja Weglot w sklepie Shopify jest naprawdę prosta. Oto przewodnik, który pomoże Ci zacząć:

1. Rozpocznij od odwiedzenia sklepu Shopify App Store:

• W pasku wyszukiwania wpisz Weglot i znajdź aplikację Weglot .
• Kliknij Zainstaluj i postępuj zgodnie z instrukcjami, aby dodać ją do swojego sklepu.

2. Po zainstalowaniu aplikacji należy skonfigurować konto:

• Otwórz aplikację Weglot z pulpitu nawigacyjnego Shopify.
• Wprowadź swój adres e-mail i wybierz hasło.

3. Skonfiguruj ustawienia języka:

• Następnie wybierz oryginalny język (język sklepu Shopify).
• Następnie wybierz języki docelowe, na które chcesz przetłumaczyć swoje treści.

Po wybraniu języków Weglot automatycznie przeskanuje całą zawartość sklepu, w tym metadane i treści z aplikacji innych firm. Automatyczne wykrywanie oznacza, że nie będziesz musiał ręcznie zbierać treści do tłumaczenia, ponieważ Weglot zrobi to wszystko za Ciebie!

Następnie Twoja strona zostanie natychmiast przetłumaczona przy użyciu wiodącej technologii tłumaczenia opartej na sztucznej inteligencji i wyświetlona w podkatalogach lub subdomenach językowych, w zależności od struktury wybranej w panelu administracyjnym Weglot .

Dostosowywanie przełącznika języków Weglot: opcje projektu i umiejscowienia

Przełącznik języków Weglotoferuje szerokie możliwości dostosowania, dzięki czemu można go dopasować do wizerunku marki Twojego sklepu, uzyskując niezwykle profesjonalny efekt końcowy. Oto jak go dostosować:

1. Dostęp do edytora wizualnego przełącznika języków: Przejdź do Weglot i przejdź do Ustawienia > Przełącznik języków.
2. Zmiana wyglądu: Wybierz jeden z różnych formatów, takich jak listy rozwijane, przyciski lub flagi, aby wyświetlić opcje językowe. Na przykład:
   • Używaj flag do szybkiego rozpoznawania.
   • Wybierz przyciski, aby uzyskać bardziej widoczny wyświetlacz.

3. Dostosuj pozycję: Możesz umieścić przełącznik w kluczowych obszarach, takich jak nagłówek, stopka lub pasek boczny, w zależności od tego, co najlepiej pasuje do Twojego układu.
4. Modyfikowanie kolorów i stylów: Dostosuj kolory i style w ustawieniach Weglot , aby dopasować je do marki swojego sklepu.

Co ważne, przełącznik języka można łatwo zmienić bez żadnych modyfikacji motywu, dzięki czemu pozostaje on dostępny i przyjazny dla użytkownika na różnych stronach Twojego sklepu. Aby uzyskać informacje na temat zaawansowanego rozmieszczenia, zapoznaj się z sekcją poniżej, zatytułowaną „Pokonywanie typowych wyzwań związanych z lokalizacją sklepu Shopify”.

Zaawansowana personalizacja: Wskazówki dotyczące kodowania dla programistów

Dla deweloperów, którzy chcą ulepszyć swoje sklepy Shopify za pomocą Weglot, dostosowanie może być kluczem do stworzenia dostosowanego wielojęzycznego doświadczenia. Elastyczność Weglotdaje programistom możliwość tworzenia niestandardowych wielojęzycznych doświadczeń, pozostając jednocześnie przyjaznym dla użytkowników nietechnicznych.

Oto kilka wskazówek dotyczących kodowania:

Wykorzystanie CSS do precyzyjnego dostosowania wyglądu przełącznika języków

Programiści mogą modyfikować style, takie jak kolor tła, rozmiar czcionki i wypełnienie, aby dopasować je do marki sklepu. Na przykład:

select {    
background-color: #f0f0f0;    
 border: 2px solid #007bff;    
 border-radius: 5px;    
 padding: 10px;
}

Implementacja JavaScript dla niestandardowej funkcjonalności

Programiści mogą używać JavaScript do wyzwalania określonych działań po wybraniu języka, takich jak aktualizowanie innych elementów na stronie lub śledzenie zmian języka do celów analitycznych. Można na przykład zaimplementować detektor zdarzeń:

document.addEventListener('DOMContentLoaded', function() {
var languageSelector = document.querySelector('select[name="language_code"]');    
 if (languageSelector) {        
  languageSelector.addEventListener('change', function(event) {            
    // Custom functionality here            
     // For example, track language change event            
     console.log('Language changed to: ' + event.target.value);
   });    
 }
});

Implementacja Weglot dla płynnych przejść między językami

Jedną z kluczowych funkcji Weglotjest automatyczne tworzenie adresów URL specyficznych dla danego języka, takich jak example.com/fr dla francuskich wersji witryny. Prawidłowa struktura adresów URL zapewnia, że wyszukiwarki mogą indeksować każdą wersję językową, poprawiając wielojęzyczne działania SEO.

Weglot pomaga klientom łatwo przełączać języki podczas zakupów, zarówno podczas przeglądania produktów, jak i dokonywania płatności. Gdy klient przełącza się z np. angielskiej strony produktu na jej (np. hiszpański) odpowiednik, doświadcza płynnego przejścia bez utraty swojego miejsca w podróży zakupowej. Takie funkcje mogą wpływać na kluczowe wskaźniki, takie jak czas spędzony na stronie i współczynniki konwersji, poprawiając zadowolenie klientów i ostatecznie napędzając globalny wzrost.

Aby dać przykład, Everyone.org - który wykorzystał Weglot do stworzenia wielojęzycznej strony internetowej w 12 językach - odnotował 40% wzrost całkowitej liczby odwiedzających, a francuskojęzyczni użytkownicy konwertowali prawie dwukrotnie więcej niż średni współczynnik konwersji w całej witrynie.

Optymalizacja wielojęzycznego SEO i utrzymanie spójności strony

Wielojęzyczne SEO zapewnia, że Twoje produkty są wykrywalne przez użytkowników wyszukujących w różnych językach, co zwiększa ruch online. Podstawowym aspektem wielojęzycznego SEO jest posiadanie odpowiedniej struktury adresów URL, a korzystanie z podkatalogów pomaga wyszukiwarkom identyfikować i klasyfikować strony w różnych językach.

Znaczniki Hreflang odgrywają znaczącą rolę w tym procesie, informując wyszukiwarki o języku i regionalnym ukierunkowaniu stron. Pomaga to skierować użytkowników do najbardziej odpowiedniej wersji witryny.

Przetłumaczone metadane, w tym tagi tytułowe i opisy, dodatkowo przyczyniają się do lepszej widoczności w wyszukiwarkach. Weglot automatyzuje większość technicznych prac SEO, automatycznie tworząc adresy URL specyficzne dla języka i wdrażając tagi hreflang bez konieczności ręcznej interwencji.

Ponadto Visual Editor Weglot Visual Editor słownik językowy pozwalają właścicielom sklepów zachować spójność tłumaczeń.

Aby pójść o krok dalej z wielojęzycznym SEO, właściciele sklepów Shopify mogą wykonać następujące czynności:

• Przeprowadź badania lokalnych słów kluczowych dla każdego rynku docelowego.
• Upewnij się, że cała zawartość, w tym metadane, jest dokładnie przetłumaczona.
• Regularny przegląd tłumaczeń w celu odzwierciedlenia zmian w trendach językowych.

Pamiętaj, że skuteczne wielojęzyczne SEO może przyczynić się do zwiększenia możliwości rynkowych! Po wdrożeniu rozwiązania „ Weglot ” w celu optymalizacji wielojęzycznej sklep Ron Dorff, działający na platformie Shopify, odnotował niesamowity wzrost liczby odwiedzin strony o 400%.

Pokonywanie typowych wyzwań związanych z lokalizacją sklepu Shopify

Lokalizacja sklepów Shopify wiąże się z pewnymi wyjątkowymi wyzwaniami, ale Weglot oferuje skuteczne rozwiązania, które ułatwią Ci ten proces.

Aby zmienić położenie przełącznika Weglot na stronie Shopify, możesz skorzystać z jednej z czterech poniższych metod:

1. Funkcja edytora przełączników

Skorzystaj z edytora przełącznika, aby przeciągnąć i upuścić przełącznik języka bezpośrednio na podgląd na żywo swojej witryny internetowej. Ta metoda wymaga, aby Twoja witryna była aktywna.

2. Dodaj do menu

Utwórz niestandardowy przełącznik języka w menu głównym, łącząc go z Weglot . Przejdź do Shopify Admin > Sklep internetowy > Nawigacja, dodaj pozycje menu dla każdego języka, używając formatuWeglot(np.Weglot dla języka angielskiego). Możesz również utworzyć menu rozwijane dla języków.

3. Opcja Weglot

Wstaw poniższy snippet kodu snippet pliku Theme.liquid w wybranym miejscu:

<div id="weglot_here"></div>

Ten kod umieści przełącznik języka w miejscu, w którym umieścisz kod, rozwiązując typowe ograniczenia dotyczące umiejscowienia omawiane na forach społecznościowych.

4. Opcja przełącznika

Ręcznie zintegruj przełącznik, modyfikując kod inicjalizacyjny Weglot w weglot.liquid. Dołącz opcję Switchers i określ docelowy selektor CSS dla miejsca, w którym ma pojawić się przełącznik:

Weglot.initialize({  
api_key: "YOUR_API_KEY",  
 switchers: [{     
  location: { target: ".header-nav" }   
 }]
});

Pamiętaj, aby zastąpić .header-nav selektorem CSS żądanego elementu.

Korzystanie z Weglot przynosi również następujące korzyści lokalizacyjne:

• Dynamiczne tłumaczenie treści: Weglot skutecznie tłumaczy zawartość generowaną przez JavaScript i elementy ładowane przez AJAX, zapewniając, że cała dynamiczna zawartość jest przechwytywana i tłumaczona.
• Wielojęzyczne SEO dla Shopify: Weglot automatyzuje wdrażanie tagów hreflang i tworzy mapy witryn dostosowane do języka. Uzupełnia to wbudowane funkcje SEO Shopify, umożliwiając wyszukiwarkom wyświetlanie użytkownikom prawidłowej wersji językowej.

• Tłumaczenie elementów charakterystycznych dla platformy Shopify: usługa „ Weglot ” obsługuje tłumaczenia całego sklepu, w tym stron realizacji zamówienia, powiadomień e-mailowych i pól meta, pokonując ograniczenia opisane w dokumentacji Shopify.

• Optymalizacja procesów tłumaczeniowych: Pamięć tłumaczeniowa Wegloti funkcje glosariusza pomagają zachować spójność w dużym katalogu produktów. Gwarantuje to, że terminy są jednolicie tłumaczone, zapewniając spójność przekazu marki w różnych językach.

Porównanie Weglot natywnego przełącznika języków Shopify

Shopify zapewnia użytkownikom podstawowe narzędzia potrzebne do tłumaczenia ich sklepów na wiele języków, ale istnieją pewne ograniczenia.

Weglot oferuje kompleksowe rozwiązanie tłumaczeniowe i wychodzi naprzeciw ograniczeniom Shopify. W rezultacie platforma ta jest bardziej odpowiednią opcją dla użytkowników, którzy chcą ręcznego podejścia do wielojęzycznego zarządzania treścią.

Pokonaj bariery językowe: Zaimplementuj Weglot w swoim sklepie Shopify

Jak widzieliśmy, Weglot wyjątkowe korzyści dla sklepów Shopify, co czyni go idealnym rozwiązaniem do pokonywania barier językowych w Internecie. Dzięki przełącznikowi języków Weglotzyskujesz dodatkowe możliwości dostosowywania, które poprawiają komfort użytkowania, a Visual Editor tłumaczenia w kontekście, pozwalając na udoskonalanie treści tam, gdzie jest to konieczne. Możesz nawet zamawiać profesjonalne tłumaczenia bezpośrednio z pulpitu nawigacyjnego, aby uzyskać większą dokładność.

Weglot integruje się z popularnymi aplikacjami Shopify, w tym z inteligentnymi narzędziami wyszukiwania i galeriami obrazów, zapewniając pełną funkcjonalność sklepu w wielu językach. Ponadto nasza platforma tworzy subdomeny lub podkatalogi specyficzne dla danego języka, znacznie zwiększając wysiłki SEO.

Co najlepsze, Weglot jest kompatybilny ze wszystkimi systemami zarządzania treścią, co oznacza, że jeśli odejdziesz od Shopify, nie musisz tracić korzyści płynących z Weglot.

Już dziś rozpocznij 14-dniowy bezpłatny okres próbny serwisu Weglot i ciesz się wielojęzyczną stroną internetową w ciągu kilku minut!

Najczęstsze problemy i szybkie rozwiązania

Przełączniki języków czasami znikają po aktualizacji motywu, zainstalowaniu aplikacji lub zmianie układu strony. Problemy te zazwyczaj wynikają z ustawień motywu lub umiejscowienia przełącznika. Przyjrzyjmy się czterem najczęstszym przyczynom tych problemów.

1. Dlaczego mam dwa przełączniki języka?

Wyświetlanie dwóch przełączników zazwyczaj oznacza, że zarówno natywny przełącznik Shopify, jak i wersja z Twojej aplikacji (np. Weglot) są aktywne jednocześnie. Być może masz również skonfigurowanych więcej niż jeden przełącznik typu „ Weglot ”.

Zacznij od otwarcia panelu administracyjnego Shopify > Sklep internetowy > Szablony > Edytuj szablon. Sprawdź, czy w nagłówku i stopce znajduje się wbudowany w Shopify selektor języka, wyłącz go, jeśli korzystasz z Weglot, a następnie zapisz zmiany. Dokładne ustawienia zależą od posiadanego szablonu. Ponadto pozostaw włączony selektor kraju/regionu, jeśli klienci potrzebują go do wyboru rynku.

Jeśli oba przełączniki należą do Weglot, otwórz Weglot Dashboard > Ustawienia > Przełącznik języka > Edytor przełącznika. Sprawdź, które przełączniki są skonfigurowane i czy są ustawione tak, aby wyświetlały się przy tych samych rozmiarach ekranu. Weglot obsługuje oddzielne przełączniki dla komputerów stacjonarnych i urządzeń mobilnych, więc upewnij się, że nie wyświetlają się one przypadkowo razem.

Jeśli dodałeś linki do języków w nawigacji Shopify, sprawdź, czy wyświetlają się one obok standardowego przełącznika języka w Weglot. Usuń zbędne pozycje menu, jeśli nie potrzebujesz obu tych opcji.

Więcej wskazówek dotyczących umieszczania i inicjalizacji niestandardowego przełącznika znajdziesz w oficjalnej dokumentacji przełącznika języków Weglot .

2. Dlaczego po aktualizacji motywu zniknął przełącznik języka?

Jeśli po aktualizacji motywu Shopify zniknie przełącznik języka, nie musi to oznaczać, że zniknęły Twoje tłumaczenia. Problem może leżeć w ustawieniach przełącznika lub jego umiejscowieniu w zaktualizowanym motywie.

Sprawdź jeden z przetłumaczonych adresów URL swojego sklepu, na przykład yourstore.com/fr/, jeśli w Twojej konfiguracji wykorzystujesz podkatalogi językowe. Jeśli strona wyświetla przetłumaczoną treść, ale brakuje przełącznika języka, problem może dotyczyć raczej wyświetlania przełącznika niż samych tłumaczeń.

Jeśli korzystasz z wbudowanego przełącznika języków w Shopify, sprawdź dokładnie, czy dodatkowe języki są nadal opublikowane w sekcji Ustawienia > Języki. Jeśli nie są oznaczone jako „Opublikowane”, nie będą wyświetlane nigdzie.

Jeśli korzystasz z serwisu Weglot:

1. Sprawdź, czy opcja „ Weglot ” jest włączona: otwórz sekcję „Sklep internetowy” > „Motywy” > „Edytuj motyw” > „Osadzone aplikacje”, znajdź opcję „ Weglot ” i włącz ją, jeśli jest wyłączona. Kliknij „Zapisz” i sprawdź wygląd swojego sklepu.
2. Zresetuj położenie przełącznika: Jeśli nadal go nie widać, otwórz Weglot Dashboard > Ustawienia > Przełącznik języka > Edytor przełącznika. W sekcji „Położenie” wybierz opcję „Przywróć domyślne położenie”. Spowoduje to przywrócenie przełącznika do prawego dolnego rogu.

3. W razie potrzeby wybierz nowe położenie: jeśli przełącznik pojawi się ponownie, jego poprzednie położenie może już nie pasować do zaktualizowanego motywu. Skorzystaj z edytora przełącznika, aby przeciągnąć go w nowe miejsce wewnątrz elementu, który pojawia się w różnych miejscach sklepu, a następnie kliknij „Zapisz”.

Jeśli ręcznie dodałeś przełącznik z Weglot do kodu swojego motywu, sprawdź, czy aktualizacja zachowała Twoje niestandardowe rozmieszczenie. Na przykład, jeśli wcześniej korzystałeś z <div id="weglot_here"></div>, sprawdź, czy nadal znajduje się w przewidzianym miejscu. Jeśli został usunięty, przywróć go z poprzedniej wersji motywu po upewnieniu się, że jego położenie jest zgodne ze zaktualizowanym układem.

Sprawdź też wygląd swojej witryny zarówno na komputerze stacjonarnym, jak i na urządzeniu mobilnym. Jeśli przełącznik działa na komputerze stacjonarnym, ale nie na urządzeniu mobilnym, przyczyną mogą być ustawienia widoczności związane z rozmiarem ekranu lub układ mobilny Twojego motywu. Temu zagadnieniu poświęcimy następną część.

3. Dlaczego przełącznik języka nie wyświetla się na urządzeniach mobilnych?

Jeśli przełącznik języka w Shopify wyświetla się na komputerze, ale znika na urządzeniach mobilnych, może to wynikać z tego, że jest on ukryty przez układ mobilny motywu lub skonfigurowany tak, by wyświetlać się wyłącznie na większych ekranach.

Jeśli korzystasz z wbudowanego przełącznika Shopify, otwórz sekcję „Sklep internetowy” > „Motywy” > „Edytuj motyw” i wybierz podgląd wersji mobilnej. Sprawdź, czy przełącznik języka pojawia się w stopce, nagłówku lub menu mobilnym – w zależności od motywu. Jeśli go brakuje, upewnij się, że odpowiednie ustawienie przełącznika języka jest włączone. Niektóre motywy mogą wymagać dodatkowego dostosowania, aby wyświetlać go w preferowanej lokalizacji na urządzeniach mobilnych.

Jeśli korzystasz z serwisu Weglot:

1. Otwórz pulpit nawigacyjnyWeglot > Ustawienia > Przełącznik języka > Edytor przełącznika.
2. Wybierz swój obecny przełącznik z listy rozwijanej w lewym górnym rogu. W sekcji „Zachowanie” > „Wyświetlanie na określonych rozmiarach ekranu” sprawdź, czy jest on skonfigurowany tak, aby wyświetlał się na urządzeniach mobilnych.
3. Jeśli chcesz uzyskać inny układ strony na urządzeniach mobilnych, wybierz widok mobilny w lewym dolnym rogu edytora, kliknij przycisk „+”, aby utworzyć osobny przełącznik, a następnie przeciągnij go w wybrane miejsce.
4. Kliknij „Zapisz”, a następnie sprawdź, czy przełączniki między wersjami na komputery stacjonarne i urządzenia mobilne wyświetlają się na ekranach o zamierzonych rozmiarach.

Jeśli w nagłówku strony mobilnej brakuje miejsca, możesz również dodać linki do języków w menu nawigacyjnym wersji mobilnej. Przejdź do Panel administracyjny Shopify > Treść > Menu, wybierz menu używane w nawigacji mobilnej i dodaj pozycję menu dla każdego języka, korzystając z formatu linków podanego na stronie Weglot, na przykład #Weglot-en dla języka angielskiego lub #Weglot-fr dla języka francuskiego. Możesz również zgrupować te linki w rozwijanym menu „Języki”, jeśli Twój motyw to obsługuje.

Jeśli przełącznik nadal nie jest widoczny, sprawdź, czy niestandardowy kod CSS nie ukrywa go na mniejszych ekranach lub czy nie znajduje się on wewnątrz elementu nawigacyjnego przeznaczonego wyłącznie dla komputerów stacjonarnych. Przeniesienie go w widoczne, stałe miejsce może rozwiązać ten problem.

4. Przełącznik działa po odświeżeniu, ale nie przy pierwszym załadowaniu strony?

Jeśli przełącznik języka w Weglot pojawia się dopiero po odświeżeniu strony, problem może wynikać ze sposobu, w jaki motyw Shopify ładuje treść, lub z położenia przełącznika.

Wypróbuj następujące rozwiązania:

1. Zresetuj położenie przełącznika tak samo, jak w drugim zadaniu powyżej. Jeśli przełącznik wyświetla się teraz poprawnie, przyczyną problemu może być jego poprzednie położenie. Serwis Weglot zaleca umieszczenie go wewnątrz elementu, który występuje na wszystkich stronach Twojego sklepu.
2. Sprawdź, jak działają przejścia między stronami w Twoim motywie. Niektóre motywy Shopify wykorzystują animacje lub nawigację AJAX do przechodzenia między stronami bez ich pełnego odświeżania, co może zakłócać działanie funkcji „ Weglot ”. Jeśli Twój motyw oferuje takie ustawienia, przejdź do sekcji „Sklep internetowy” > „Motywy” > „Edytuj motyw” > „Ustawienia motywu ” i poszukaj sekcji „Wydajność” lub „Animacje”. Serwis „Weglot ” zaleca wybranie opcji „Sport” zamiast „Ludicrous” oraz wyłączenie opcji „Animuj przejścia między stronami”, o ile są one dostępne.
3. Sprawdź kod dowolnego niestandardowego przełącznika. Jeśli ręcznie dostosowałeś położenie elementu Weglot, upewnij się, że wybrana lokalizacja istnieje w momencie ładowania przełącznika. Element nagłówka lub nawigacji, który pojawia się później, może wymagać dodatkowych prac integracyjnych.

Na koniec przetestuj swój sklep w prywatnym oknie przeglądarki, zaczynając od strony głównej i przechodząc do różnych stron produktów i kolekcji. Jeśli problem nadal występuje, skontaktuj się z pomocą techniczną Weglot , podając adres URL sklepu, nazwę szablonu oraz kroki niezbędne do odtworzenia błędu.