de idiomas no Bubble pode facilitar a troca de idiomas para os usuários. Esse recurso é particularmente valioso para aplicativos com público global, permitindo que os usuários interajam com a plataforma em seu idioma preferido. Bubble , uma popular plataforma de desenvolvimento sem código, oferece recursos de localização integrados que permitem aos desenvolvedores criar aplicativos multilíngues sem a necessidade de conhecimento avançado em programação.
Para implementar um seletor de idiomas no Bubble, os desenvolvedores geralmente começam definindo os idiomas que desejam oferecer suporte nas configurações do aplicativo. Em seguida, criam um menu suspenso ou um botão com o qual os usuários podem interagir para alterar o idioma. Neste artigo, discutiremos a configuração de um seletor de idiomas no Bubbleusando um dos sites de serviço de tradução automática.
Por que um seletor de idiomas é importante no site Bubble?
Adicionar um seletor de idiomas a um site não é sem motivo. Aqui estão os motivos pelos quais você precisa configurar um em um site Bubble .
- Facilita para usuários de outros países: Um alternador de idioma permite que usuários internacionais visualizem o site em seu idioma nativo. Por exemplo, um usuário espanhol que visita uma loja online pode mudar para o espanhol, facilitando a compreensão dos detalhes do produto e a conclusão das compras. Estudos da CSA Research mostram que 76% dos compradores online preferem comprar produtos quando a informação está disponível no seu idioma, destacando a importância desta funcionalidade para o conforto e acessibilidade do utilizador.
- Otimizando o site nos resultados de busca de outros países: Com um seletor de idiomas, seu Bubble pode ter uma classificação melhor em buscas em idiomas estrangeiros. Por exemplo, uma versão em francês do seu site tem mais chances de aparecer em buscas do Google em francês. Essa visibilidade aprimorada pode aumentar significativamente o tráfego internacional.
- Aumente a conversão de vendas: Oferecer conteúdo em vários idiomas pode impulsionar as vendas. Uma plataforma de cursos on-line que permite aos usuários trocar de idioma pode atrair um público mais amplo e aumentar o número de matrículas. Essa abordagem é eficaz porque os consumidores são mais propensos a comprar em sites que fornecem informações em seu idioma nativo, impactando diretamente nas suas taxas de conversão.
- Melhora o envolvimento e a retenção do usuário: um alternador de idioma pode manter os usuários em seu site por mais tempo. Por exemplo, os usuários que interagem em seu idioma preferido em um aplicativo de rede social tendem a permanecer engajados por mais tempo. Esse aumento no envolvimento é significativo, já que os usuários normalmente passam duas vezes mais tempo em sites em seu idioma nativo do que em sites em um segundo idioma, levando a uma melhor retenção de usuários.
Como configurar um seletor de idiomas no Bubble
Agora que entendemos a importância da troca de idiomas em sites multilíngues Bubble, vamos discutir como implementá-la. Os serviços de tradução de sites geralmente oferecem esse recurso, que pode ser personalizado de acordo com as necessidades do usuário.
No entanto, nem todos os serviços de tradução oferecem alternadores de idiomas personalizáveis e fáceis de usar. Portanto, é muito importante escolher um serviço de tradução automática compatível com várias estruturas e que forneça recursos flexíveis de troca de idioma.
Um serviço de tradução automática que atende a esses critérios é Linguise . Linguise oferece um recurso de troca de idiomas altamente personalizável e fácil de usar, que se integra a sistemas de gerenciamento de conteúdo (CMS) e construtores de sites populares, como Bubble .
Linguise oferece integração perfeita com o Bubble, permitindo que os desenvolvedores incorporem facilmente a troca de idiomas em seus aplicativos multilíngues. Ao aproveitar os recursos avançados e a interface amigável da Linguise, você pode simplificar a configuração e a manutenção dos seletores de idioma em seu site Bubble .
Aqui estão os passos para instalar Linguise em um site Bubble e configurar o seletor de idiomas.
Etapa 1: registrar uma conta Linguise
Comece conta Linguise gratuita e adicionando o domínio do seu site. Você pode utilizar o teste gratuito de 30 dias antes de escolher um plano de assinatura.
Depois, você precisará registrar seu domínio para autorizar a tradução. Copie o seu nome de domínio, incluindo “https://” e selecione “outro” como plataforma.
Em seguida, selecione seus idiomas de origem e de destino.
Etapa 2: adicionar DNS automaticamente usando Entri
Após cadastrar seu site no painel Linguise , você terá duas opções de instalação.
Para adição automática de registros DNS, clique em “Conectar seu DNS automaticamente”. Esse recurso, chamado Entri, simplifica o processo de instalação gerenciando os registros DNS para você. Alternativamente, você pode copiar manualmente os registros DNS para o seu provedor de domínio.
Clicar no botão solicita que Entri analise o URL do seu site registrado e examine seus registros DNS públicos, identificando o provedor e os registros DNS necessários.
Em seguida, clique em “Autorizar com [seu provedor de domínio]” (por exemplo, Cloudflare). Esta ação redireciona você para a página de login do seu provedor de domínio, onde você pode fazer login e prosseguir.
Uma vez logado, o Entri adicionará automaticamente os registros DNS apropriados – um DNS por idioma e um DNS TXT para a chave de validação – ao seu domínio.
Após a autorização, o Entri irá notificá-lo de que todas as configurações de DNS foram configuradas com sucesso. O recurso de tradução deverá poder ser usado assim que todas as entradas DNS forem propagadas em seu domínio, normalmente levando de 20 a 30 minutos.
Para instalação manual, você pode seguir as etapas fornecidas abaixo.
Etapa 3: copiar registros DNS
Para instalação manual, você será redirecionado para uma tela que exibe os registros DNS necessários para configurar suas páginas multilíngues, como fr.domain.com ou es.domain.com.
Copie esses elementos para a sua configuração de DNS Bubble.
Em seguida, acesse seu gerenciador de domínio e navegue até a área de configuração de DNS. Siga as instruções para copiar:
- Um registro TXT para verificação de domínio
- Um ou vários registros CNAME para os idiomas
Aqui estão exemplos para cada tipo de registro (TXT e CNAME).
Depois de adicionar todos os seus registros ao DNS do seu domínio, clique no botão “Verificar configuração do DNS” para verificar a propagação do DNS.
Etapa 4: verificar o DNS
Depois de adicionar todos os seus registros ao DNS do seu domínio, clique no botão “Verificar configuração do DNS” para verificar a propagação do DNS.
A validação de DNS geralmente leva de 30 minutos a 1 hora. Após a conclusão, você deverá ver indicadores verdes ao lado da lista de DNS no painel Linguise . Você está quase pronto para traduzir seu site Bubble; tudo o que resta é adicionar o link para o seletor de idiomas com as bandeiras dos países.
Etapa 5: ativar e alternar idioma
O seletor de idioma é um pop-up com uma bandeira que permite aos usuários selecionar seu idioma preferido. Para implementá-lo, copie o código fornecido ao final do processo de registro do domínio ou nas configurações do domínio e cole no cabeçalho das páginas do seu site Bubble. O seletor de idioma com a bandeira aparecerá automaticamente em seu site público.
Em seguida, acesse o painel de controle do seu Bubble . Clique em "Configurações" no menu lateral esquerdo e selecione "SEO / metatags".
Etapa 7: personalize a cor e o tamanho
Etapa 5: configurar a tela principal
Para começar a configurar o seletor de idioma, navegue até a “Configurações”> “Exibição de sinalizadores de idioma” no painel Linguise Nesta página, você pode ajustar várias configurações
- Estilo do ícone da bandeira: escolha entre três opções: exibição lado a lado, menu suspenso ou pop-up.
- Posição: selecione onde o seletor de idioma aparecerá em seu site. Várias opções de posição estão disponíveis; garantir que seja facilmente acessível aos visitantes.
Você pode combinar a exibição de bandeiras e nomes de idiomas, bandeiras e abreviações de idiomas ou apenas nomes de idiomas. O uso de sinalizadores e nomes de idiomas é recomendado para facilitar o reconhecimento do usuário.
Passo 6: Defina o design da bandeira
Após configurar o display principal, personalize ainda mais o design das bandeiras que serão mostradas.
- Exibir nome do idioma: você pode optar por mostrar o nome do idioma com base no nome do país ou no próprio nome do idioma. Por exemplo, você pode exibir “Francês” ou “Français”.
- Tipo de bandeira inglesa: esta opção é útil para idiomas com múltiplas variações, como inglês americano ou britânico (e também se aplica a espanhol, taiwanês, alemão e português).
- Estilo da bandeira: Escolha o formato do ícone da bandeira, redondo ou retangular.
Etapa 7: personalize a cor e o tamanho
Depois de configurar o design da bandeira, você pode personalizar ainda mais a cor e o tamanho das bandeiras. Aqui estão as configurações que você pode ajustar:
- Raio da borda da bandeira: personalize o raio em pixels para o estilo da bandeira retangular.
- Cor do nome do idioma: escolha a cor de texto padrão para exibir o nome do idioma.
- Cor do idioma pop-up: defina a cor do texto do título do idioma na área pop-up ou suspensa.
- Tamanho da bandeira: ajuste o tamanho dos ícones da bandeira.
- Cor de foco do nome do idioma: defina a cor do texto que aparece quando o usuário passa o mouse sobre o nome do idioma.
- Cor de foco do idioma pop-up: defina a cor do texto que aparece quando o usuário passa o mouse sobre o título do idioma no pop-up ou na área suspensa.
Etapa 8: definir a sombra da caixa de sinalização
Finalmente, você pode ajustar as configurações de sombra da caixa de sinalização. A primeira opção permite aplicar um efeito de sombra a cada ícone de bandeira exibido em seu site. A próxima opção controla o efeito de sombra quando os usuários passam o mouse sobre as bandeiras de idioma.
Depois de fazer todos os ajustes desejados, clique no botão Salvar para aplicar as alterações de personalização. Em seguida, acesse seu site Bubble para verificar se a configuração foi aplicada com sucesso. O seletor de idiomas ficará assim.
Após a configuração, você poderá ver como o seletor de idiomas funciona no seu site multilíngue Bubble .
A seguir, você pode traduzir o site para outros idiomas, como o espanhol.
Melhores práticas para otimizar o seletor de idiomas no Bubble
Após configurar com sucesso o seletor de idiomas em um site multilíngue Bubble , é importante considerar dicas para otimizar o seletor de idiomas tanto para o seu site quanto para os visitantes.
Utilize um logotipo de bandeira de idioma facilmente identificável
Ao implementar um seletor de idiomas no seu site Bubble, é crucial usar bandeiras ou ícones de idiomas facilmente reconhecíveis. Esses recursos visuais ajudam os usuários a identificar e selecionar rapidamente o idioma de sua preferência. Por exemplo, um ícone de globo terrestre é universalmente compreendido como representação das opções de idioma. Como alternativa, você pode usar bandeiras de países, mas esteja ciente de que isso pode ser problemático, já que os idiomas nem sempre estão vinculados a um único país.
Exemplo: o site da Amazon usa um pequeno ícone de globo próximo ao idioma atualmente selecionado (por exemplo, “EN”) na barra de navegação superior. Esta abordagem simples, mas eficaz, permite que os usuários localizem rapidamente as opções de idioma, independentemente da configuração de idioma atual.
Incorpore nomes de idiomas ao lado de bandeiras
Embora os sinalizadores possam ser úteis, eles não devem ser usados sozinhos. Incluir o nome do idioma em sua escrita nativa ao lado da bandeira ou ícone fornece clareza e evita possíveis confusões. Isto é particularmente importante para línguas faladas em vários países ou regiões.
Exemplo: O seletor de idioma no site do Airbnb exibe o nome do idioma e a bandeira do país. Por exemplo, mostra “English (US)” com a bandeira dos EUA e “Français” com a bandeira francesa. Essa combinação garante que os usuários possam identificar com precisão sua opção de idioma preferida.
Posicione o botão de troca de idioma com cuidado
O posicionamento do seu seletor de idioma é fundamental para a acessibilidade do usuário. Os locais comuns incluem o canto superior direito do cabeçalho, o rodapé ou o menu de navegação principal. O segredo é torná-lo facilmente detectável sem sobrecarregar a área de conteúdo principal.
Exemplo: No site tiffany.com, o seletor de idioma fica no canto inferior direito da página, sempre visível e acessível. Esse posicionamento consistente garante que os usuários possam encontrar e usar rapidamente as opções de idioma, independentemente de onde estejam no site.
Projete o alternador de idioma para ser responsivo
Certifique-se de que seu alternador de idioma funcione bem em todos os dispositivos, de computadores desktop a smartphones. Em telas menores, pode ser necessário adaptar o design – por exemplo, usando um menu suspenso em vez de uma lista horizontal de opções.
Exemplo: O seletor de idioma do site da UNESCO adapta-se perfeitamente a vários dispositivos. Na área de trabalho, aparece como uma lista horizontal no cabeçalho. No mobile, ele se transforma em um menu suspenso compacto, garantindo usabilidade sem comprometer o layout mobile.
Certifique-se de que o alternador de idioma seja consistente em todas as páginas
Mantenha o mesmo design, funcionalidade e posição do seletor de idiomas em todas as páginas do seu site Bubble. Essa consistência ajuda os usuários a navegar pelo seu site com mais eficiência, pois eles sabem exatamente onde encontrar as opções de idioma, independentemente da página em que estão.
Exemplo: o site mantém seu seletor de idioma consistentemente no rodapé de todas as páginas, desde a página inicial até as páginas de produtos e o processo de checkout. Essa consistência garante que os usuários possam alternar facilmente os idiomas a qualquer momento durante a navegação ou experiência de compra.
Configure um seletor de idiomas no site multilíngue do Bubble usando Linguise!
Agora você já entende como selecionar o idioma para o site multilíngue Bubble. Consultar o seletor de idiomas pode trazer diversos benefícios e levar a otimizações adicionais com base nos pontos mencionados anteriormente.
Otimizar o seletor de idiomas de forma eficaz pode melhorar significativamente a experiência do usuário. Cadastre-se para obter uma conta Linguise integre-a ao seu Bubble e personalize o seletor de idiomas para aprimorar a experiência do usuário.
