Ustawienie przełącznika języka na Bubble .io może ułatwić użytkownikom zmianę języka. Funkcja ta jest szczególnie przydatna w przypadku aplikacji o globalnym zasięgu, umożliwiając użytkownikom interakcję z platformą w preferowanym języku. Bubble .io, popularna platforma programistyczna bez kodu, oferuje wbudowane funkcje lokalizacji, które umożliwiają programistom tworzenie aplikacji wielojęzycznych bez rozległej wiedzy z zakresu kodowania.
Aby wdrożyć przełącznik języka w Bubble.io, programiści zazwyczaj zaczynają od zdefiniowania języków, które chcą obsługiwać, w ustawieniach aplikacji. Następnie tworzą element rozwijany lub przycisk, za pomocą którego użytkownicy mogą zmieniać język. W tym artykule omówimy konfigurację przełącznika języka w Bubble.io za pomocą jednej z witryn oferujących automatyczne tłumaczenia.
Dlaczego przełącznik języka jest ważny na stronie Bubble.io?
Dodanie przełącznika języka na stronie internetowej nie jest bez powodu. Oto dlaczego warto go zainstalować na stronie Bubble .
- Ułatwia użytkownikom w innych krajach: Przełącznik języka umożliwia użytkownikom międzynarodowym przeglądanie witryny w ich ojczystym języku. Przykładowo, hiszpański użytkownik odwiedzający sklep internetowy może przejść na język hiszpański, co ułatwi zrozumienie szczegółów produktu i dokonanie zakupu. Badania CSA Research pokazują, że 76% kupujących online woli kupować produkty, gdy informacje są dostępne w ich języku, co podkreśla znaczenie tej funkcji dla wygody użytkownika i dostępności.
- Optymalizacja witryny w wynikach wyszukiwania w innych krajach: Dzięki przełącznikowi języka Twoja Bubble może uzyskać lepszą pozycję w wynikach wyszukiwania w innych językach. Na przykład, francuska wersja Twojej witryny ma większe szanse na pojawienie się w wynikach wyszukiwania Google po francusku. Ta lepsza widoczność może znacząco zwiększyć ruch międzynarodowy.
- Zwiększ konwersję sprzedaży: oferowanie treści w wielu językach może zwiększyć sprzedaż. Platforma kursów online umożliwiająca użytkownikom zmianę języka może przyciągnąć szerszą publiczność i zwiększyć liczbę zapisów. Takie podejście jest skuteczne, ponieważ konsumenci chętniej dokonują zakupów w witrynach zawierających informacje w ich ojczystym języku, co bezpośrednio wpływa na współczynniki konwersji.
- Poprawia zaangażowanie i utrzymanie użytkowników: zmiana języka może zatrzymać użytkowników w Twojej witrynie dłużej. Na przykład użytkownicy komunikujący się w preferowanym przez siebie języku w aplikacji sieci społecznościowej zwykle pozostają dłużej zaangażowani. To zwiększone zaangażowanie jest znaczące, ponieważ użytkownicy zazwyczaj spędzają dwa razy więcej czasu w witrynach w swoim ojczystym języku niż w witrynach w drugim języku, co prowadzi do lepszego utrzymania użytkowników.
Jak skonfigurować przełącznik języka w Bubble.io
Skoro rozumiemy już, jak ważna jest zmiana języka na wielojęzycznych stronach internetowych Bubble.io, omówmy, jak to zrobić. Usługi tłumaczeń stron internetowych zazwyczaj oferują tę funkcję, którą można dostosować do potrzeb użytkownika.
Jednak nie wszystkie usługi tłumaczeniowe oferują konfigurowalne i przyjazne dla użytkownika przełączniki języków. Dlatego bardzo ważny jest wybór usługi automatycznego tłumaczenia kompatybilnej z różnymi frameworkami i zapewniającej elastyczne funkcje zmiany języka.
Jedną z usług automatycznego tłumaczenia spełniającą te kryteria jest Linguise . Linguise oferuje wysoce konfigurowalną i łatwą w obsłudze funkcję przełączania języków, która integruje się z popularnymi systemami CMS i kreatorami stron internetowych, takimi jak Bubble .io.
Linguise zapewnia płynną integrację z platformą Bubble, umożliwiając programistom łatwe włączanie funkcji przełączania języków w aplikacjach wielojęzycznych. Wykorzystując zaawansowane funkcje Linguisei przyjazny interfejs użytkownika, możesz uprościć konfigurację i obsługę przełączników językowych na swojej stronie internetowej Bubble .
Poniżej przedstawiono kroki instalacji Linguise na Bubble .io i konfiguracji przełącznika języka.
Krok 1: Zarejestruj konto Linguise
Zacznij od utworzenia darmowego konta Linguise i dodania domeny swojej witryny. Przed wybraniem planu subskrypcji możesz skorzystać z 30-dniowego bezpłatnego okresu próbnego.
Następnie musisz zarejestrować swoją domenę, aby autoryzować tłumaczenie. Skopiuj nazwę domeny, w tym „https://” i wybierz „inną” jako platformę.
Następnie wybierz język źródłowy i docelowy.
Krok 2: Automatycznie dodaj DNS za pomocą Entri
Po zarejestrowaniu swojej witryny w panelu Linguise będziesz mieć dwie możliwości instalacji.
Aby automatycznie dodać rekord DNS, kliknij „Połącz swój DNS automatycznie”. Ta funkcja, zwana Entri, upraszcza proces instalacji, zarządzając rekordami DNS. Alternatywnie możesz ręcznie skopiować rekordy DNS do dostawcy domeny.
Kliknięcie przycisku powoduje, że Entri analizuje adres URL Twojej zarejestrowanej witryny i sprawdza Twoje publiczne rekordy DNS, identyfikując niezbędnego dostawcę i rekordy DNS.
Następnie kliknij „Autoryzuj u [dostawcy domeny]” (np. Cloudflare). Ta czynność przekieruje Cię na stronę logowania Twojego dostawcy domeny, gdzie możesz się zalogować i kontynuować.
Po zalogowaniu Entri automatycznie doda odpowiednie rekordy DNS – jeden DNS na język i jeden DNS TXT dla klucza weryfikacyjnego – do Twojej domeny.
Po autoryzacji Entri powiadomi Cię, że wszystkie ustawienia DNS zostały pomyślnie skonfigurowane. Funkcja tłumaczenia powinna być dostępna, gdy wszystkie wpisy DNS zostaną rozpropagowane w Twojej domenie, co zwykle zajmuje od 20 do 30 minut.
W przypadku instalacji ręcznej możesz wykonać kroki opisane poniżej.
Krok 3: Skopiuj rekordy DNS
W przypadku instalacji ręcznej zostaniesz przekierowany do ekranu wyświetlającego rekordy DNS potrzebne do skonfigurowania stron wielojęzycznych, takich jak fr.domain.com lub es.domain.com.
Skopiuj te elementy do konfiguracji DNS Bubble.io.
Następnie uzyskaj dostęp do menedżera domeny i przejdź do obszaru konfiguracji DNS. Postępuj zgodnie z instrukcjami, aby skopiować:
- Jeden rekord TXT do weryfikacji domeny
- Jeden lub kilka rekordów CNAME dla języków
Oto przykłady dla każdego typu rekordu (TXT i CNAME).
Po dodaniu wszystkich rekordów konfiguracja powinna wyglądać następująco.
Krok 4: Zweryfikuj DNS
Po dodaniu wszystkich rekordów do DNS domeny kliknij przycisk „Sprawdź konfigurację DNS”, aby zweryfikować propagację DNS.
Walidacja DNS trwa zazwyczaj od 30 minut do 1 godziny. Po jej zakończeniu obok listy DNS w panelu Linguise powinny pojawić się zielone wskaźniki. Jesteś już prawie gotowy do przetłumaczenia swojej witryny Bubble.io; pozostało tylko dodanie linku do przełącznika języków z flagami krajów.
Krok 5: Włącz i zmień język
Przełącznik języka to wyskakujące okienko z flagą, które pozwala użytkownikom wybrać preferowany język. Aby go wdrożyć, skopiuj kod podany na końcu procesu rejestracji domeny lub w ustawieniach domeny do nagłówka stron witryny Bubble. Przełącznik języka flagi automatycznie pojawi się na Twojej publicznej stronie internetowej.
Następnie przejdź do panelu swojej Bubble . Kliknij „Ustawienia” w menu po lewej stronie i wybierz „SEO / metatagi”.
Przewiń w dół do „Skrypt/metatagi w nagłówku” w „Ustawieniach zaawansowanych”. Wklej skopiowany wcześniej skrypt Linguise
Krok 5: Skonfiguruj główny wyświetlacz
Aby rozpocząć konfigurowanie przełącznika języka, przejdź do „Ustawienia” > „Wyświetlanie flag języków” w Linguise . Na tej stronie możesz dostosować kilka ustawień
- Styl ikony flagi: wybierz jedną z trzech opcji: wyświetlanie obok siebie, menu rozwijane lub wyskakujące okienko.
- Pozycja: Wybierz, gdzie w Twojej witrynie pojawi się przełącznik języka. Dostępne są różne opcje pozycji; zapewnić łatwy dostęp dla zwiedzających.
Można łączyć wyświetlanie flag i nazw języków, flag i skrótów języków lub samych nazw języków. Aby ułatwić rozpoznawanie użytkownika, zaleca się używanie zarówno flag, jak i nazw języków.
Krok 6: Ustaw projekt flagi
Po skonfigurowaniu głównego wyświetlacza dostosuj wygląd flag, które będą wyświetlane.
- Wyświetlaj nazwę języka: możesz wybrać wyświetlanie nazwy języka na podstawie nazwy kraju lub samej nazwy języka. Możesz na przykład wyświetlić „francuski” lub „français”.
- Typ flagi angielskiej: ta opcja jest przydatna w przypadku języków z wieloma odmianami, takich jak angielski amerykański lub brytyjski (dotyczy także hiszpańskiego, tajwańskiego, niemieckiego i portugalskiego).
- Styl flagi: wybierz kształt ikony flagi – okrągły lub prostokątny.
Krok 7: Dostosuj kolor i rozmiar
Po skonfigurowaniu projektu flagi możesz dodatkowo dostosować kolor i rozmiar flag. Oto ustawienia, które możesz dostosować:
- Promień obramowania flagi: dostosuj promień w pikselach dla prostokątnego stylu flagi.
- Kolor nazwy języka: wybierz domyślny kolor tekstu, w którym będzie wyświetlana nazwa języka.
- Kolor języka wyskakującego okienka: Ustaw kolor tekstu tytułu języka w wyskakującym okienku lub obszarze rozwijanym.
- Rozmiar flagi: dostosuj rozmiar ikon flag.
- Kolor najechania nazwą języka: ustaw kolor tekstu wyświetlanego, gdy użytkownik najedzie kursorem na nazwę języka.
- Kolor najechania na język wyskakującego okienka: ustaw kolor tekstu wyświetlanego, gdy użytkownik najedzie kursorem na tytuł języka w wyskakującym lub rozwijanym obszarze.
Krok 8: Ustawianie cienia pola flagi
Na koniec możesz dostosować ustawienia cienia pola flagi. Pierwsza opcja pozwala zastosować efekt cienia do każdej ikony flagi wyświetlanej na Twojej stronie. Następna opcja kontroluje efekt cienia, gdy użytkownik najedzie myszką na flagi języka.
Po wprowadzeniu wszystkich żądanych zmian kliknij przycisk „Zapisz”, aby je zastosować. Następnie odwiedź witrynę Bubble , aby sprawdzić, czy konfiguracja została pomyślnie zastosowana. Tak będzie wyglądać przełącznik języka.
Po zakończeniu konfiguracji możesz zobaczyć, jak działa przełącznik języka na Twojej wielojęzycznej stronie internetowej Bubble .
Następnie możesz przetłumaczyć witrynę na inne języki, np. hiszpański.
Najlepsze praktyki optymalizacji przełącznika języków w Bubble.io
Po pomyślnym skonfigurowaniu przełącznika języka na wielojęzycznej witrynie Bubble , ważne jest, aby wziąć pod uwagę wskazówki dotyczące optymalizacji przełącznika języka zarówno dla witryny, jak i odwiedzających.
Wykorzystaj łatwo rozpoznawalne logo flagi językowej
Podczas wdrażania przełącznika językowego na stronie Bubblekluczowe jest użycie łatwo rozpoznawalnych flag lub ikon językowych. Te wizualne wskazówki pomagają użytkownikom szybko zidentyfikować i wybrać preferowany język. Na przykład ikona globusa jest powszechnie rozumiana jako symbol dostępnych języków. Alternatywnie można użyć flag państw, ale należy pamiętać, że czasami może to być problematyczne, ponieważ języki nie zawsze są przypisane do jednego kraju.
Przykład: witryna Amazon używa małej ikony globusa obok aktualnie wybranego języka (np. „EN”) na górnym pasku nawigacyjnym. To proste, ale skuteczne podejście pozwala użytkownikom szybko zlokalizować opcje językowe, niezależnie od ich bieżącego ustawienia językowego.
Dołącz nazwy języków obok flag
Chociaż flagi mogą być pomocne, nie należy ich używać samodzielnie. Umieszczenie nazwy języka w jego natywnym piśmie obok flagi lub ikony zapewnia przejrzystość i pozwala uniknąć potencjalnych nieporozumień. Jest to szczególnie ważne w przypadku języków używanych w wielu krajach lub regionach.
Przykład: Przełącznik języka na stronie Airbnb wyświetla nazwę języka i flagę kraju. Na przykład pokazuje „English (US)” z flagą USA i „Français” z flagą francuską. Dzięki tej kombinacji użytkownicy mogą dokładnie określić preferowaną opcję językową.
Ustaw przycisk zmiany języka w przemyślany sposób
Umieszczenie przełącznika języka ma kluczowe znaczenie dla dostępności dla użytkownika. Typowe lokalizacje to prawy górny róg nagłówka, stopka lub główne menu nawigacyjne. Kluczem jest umożliwienie łatwego odnalezienia treści bez zaśmiecania głównego obszaru treści.
Przykład: Na stronie tiffany.com przełącznik języka znajduje się w prawym dolnym rogu strony, jest zawsze widoczny i dostępny. Dzięki temu spójnemu rozmieszczeniu użytkownicy mogą szybko znaleźć opcje językowe i skorzystać z nich niezależnie od tego, gdzie się znajdują w witrynie.
Zaprojektuj przełącznik języka tak, aby był responsywny
Upewnij się, że przełącznik języków działa dobrze na wszystkich urządzeniach, od komputerów stacjonarnych po smartfony. Na mniejszych ekranach może być konieczne dostosowanie projektu – na przykład użycie menu rozwijanego zamiast poziomej listy opcji.
Przykład: Przełącznik języka witryny UNESCO doskonale dostosowuje się do różnych urządzeń. Na pulpicie pojawia się jako pozioma lista w nagłówku. Na urządzeniach mobilnych przekształca się w kompaktowe menu rozwijane, zapewniając użyteczność bez uszczerbku dla układu mobilnego.
Upewnij się, że przełącznik języków jest spójny na wszystkich stronach
Zachowaj ten sam wygląd, funkcjonalność i położenie przełącznika języka na wszystkich stronach witryny Bubble. Taka spójność ułatwia użytkownikom sprawniejszą nawigację po witrynie, ponieważ wiedzą dokładnie, gdzie znaleźć dostępne języki, niezależnie od tego, na jakiej stronie się znajdują.
Przykład: w witrynie zastosowano opcję zmiany języka w stopce na wszystkich stronach, od strony głównej po strony produktów i proces realizacji transakcji. Ta spójność zapewnia użytkownikom możliwość łatwej zmiany języka w dowolnym momencie podczas przeglądania lub zakupów.
Skonfiguruj przełącznik języka na wielojęzycznej stronie internetowej Bubble za pomocą Linguise!
Teraz wiesz już, jak wybrać język dla wielojęzycznej witryny Bubble. Odczytanie selektora języka może przynieść wiele korzyści i prowadzić do dalszej optymalizacji w oparciu o wcześniej wspomniane punkty.
Skuteczna optymalizacja selektora języka może znacząco poprawić komfort użytkowania. Załóż Linguise , zintegruj je ze swoją Bubble i dostosuj selektor języka, aby poprawić komfort użytkowania.
