Como configurar um alternador de idioma no Bubble.io

por Aorinka Anendya
1º de agosto de 2024

Blog > Guia > Como configurar um alternador de idioma no Bubble.io

Definir um alternador de idioma no Bubble.io pode facilitar a troca de idiomas pelos usuários. Este recurso é particularmente valioso para aplicações com público global, permitindo aos usuários interagir com a plataforma no idioma de sua preferência. Bubble.io, uma popular plataforma de desenvolvimento sem código, oferece recursos de localização integrados que permitem aos desenvolvedores criar aplicativos multilíngues sem amplo conhecimento de codificação.

Para implementar um alternador de idiomas no Bubble.io, os desenvolvedores normalmente começam definindo os idiomas que desejam oferecer suporte nas configurações do aplicativo. Eles então criam um menu suspenso ou elemento de botão com o qual os usuários podem interagir para alterar o idioma. Neste artigo, discutiremos a configuração de um alternador de idioma no Bubble.io com um dos sites de serviço de tradução automática.

Por que um alternador de idioma é importante no site Bubble.io?

Adicionar um alternador de idioma em um site não é sem motivo. Veja por que 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 pesquisa de outros países: Com um alternador de idioma, seu site Bubble.io pode ter uma classificação melhor em pesquisas em idiomas estrangeiros. Por exemplo, é mais provável que uma versão francesa do seu site apareça nas pesquisas do Google em francês. Esta visibilidade melhorada 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.

Quebrar barreiras linguísticas

Diga adeus às barreiras linguísticas e olá ao crescimento ilimitado! Experimente nosso serviço de tradução automática hoje mesmo.

Comece a traduzir agora

Como configurar um alternador de idioma no Bubble.io

Agora que entendemos a importância de mudar de idioma em sites Bubble.io multilíngues, vamos discutir como implementá-lo. Os serviços de tradução de sites geralmente oferecem esse recurso, que pode ser adaptado às 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 idioma altamente personalizável e fácil de usar que se integra a CMS populares e construtores de web como Bubble.io.

Linguise fornece integração perfeita com o Bubble, permitindo que os desenvolvedores incorporem facilmente a troca de idioma em seus aplicativos multilíngues. Ao aproveitar os recursos avançados e a interface amigável do Linguise , você pode simplificar a configuração e manutenção de alternadores de idioma em seu site Bubble.

Aqui estão as etapas para instalar Linguise em um site Bubble.io e configurar o alternador de idioma.

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 sua configuração DNS do Bubble.io.

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 cerca de 30 minutos a 1 hora. Depois de concluído, você deverá ver indicadores verdes próximos à lista de DNS no painel Linguise . Você está quase pronto para traduzir seu site Bubble.io; tudo o que resta é vincular ao alternador de idioma com as bandeiras dos países.

Etapa 5: ativar e alternar idioma

O alternador de idioma é um pop-up de sinalização que permite aos usuários selecionar seu idioma preferido. Para implementá-lo, copie o código fornecido no final do processo de registro do domínio ou nas configurações do domínio para o cabeçalho das páginas do site Bubble.io. O alternador de idioma da bandeira aparecerá automaticamente em seu site público.

Em seguida, vá para o painel do site Bubble. Clique em ‘Configurações’ no menu da barra lateral esquerda 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, visite o site do Bubble para verificar se a configuração foi aplicada com sucesso. É assim que o alternador de idioma aparecerá.

Após a configuração, você pode ver como o alternador de idioma funciona em seu site multilíngue Bubble.

A seguir, você pode traduzir o site para outros idiomas, como o espanhol.

Melhores práticas para otimizar o alternador de idioma no Bubble.io

Depois de configurar com sucesso o seletor de idioma em um site multilíngue Bubble, é importante considerar dicas para otimizar o seletor de idioma tanto para o seu site quanto para os visitantes.

Utilize um logotipo de bandeira de idioma facilmente identificável

Ao implementar um alternador de idioma em seu site Bubble.io, é crucial usar sinalizadores ou ícones de idioma facilmente reconhecíveis. Essas dicas visuais ajudam os usuários a identificar e selecionar rapidamente seu idioma preferido. Por exemplo, um ícone de globo é universalmente entendido como representando opções de idioma. Alternativamente, você pode usar bandeiras de países, mas esteja ciente de que isso às vezes pode ser problemático, pois 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 seu seletor de idioma em todas as páginas do seu site Bubble.io. Essa consistência ajuda os usuários a navegar em seu site com mais eficiência, pois sabem exatamente onde encontrar as opções de idioma, independentemente da página atual.

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.

Pronto para explorar novos mercados? Experimente nosso serviço de tradução automática gratuitamente com nossa avaliação gratuita de 1 mês. Nenhum cartão de crédito necessário!

Reivindique sua avaliação gratuita de 1 mês

Configure um alternador de idiomas no site multilíngue do Bubble usando Linguise !

Agora você já sabe como selecionar o idioma do site multilíngue Bubble.io. A leitura do seletor de idioma pode trazer vários benefícios e levar ainda mais à otimização com base nos pontos mencionados anteriormente.

A otimização eficaz do seletor de idioma pode melhorar significativamente a experiência do usuário. Cadastre-se para obter uma conta Linguise integre-a ao seu site Bubble.io e personalize o seletor de idioma para melhorar a experiência do usuário.

Como configurar um alternador de idioma no Bubble.io

Por que um alternador de idioma é importante no site Bubble.io?

Como configurar um alternador de idioma no Bubble.io

Etapa 1: registrar uma conta Linguise

Etapa 2: adicionar DNS automaticamente usando Entri

Etapa 3: copiar registros DNS

Etapa 4: verificar o DNS

Etapa 5: ativar e alternar idioma

Etapa 5: configurar a tela principal

Passo 6: Defina o design da bandeira

Etapa 7: personalize a cor e o tamanho

Etapa 8: definir a sombra da caixa de sinalização

Melhores práticas para otimizar o alternador de idioma no Bubble.io

Utilize um logotipo de bandeira de idioma facilmente identificável

Incorpore nomes de idiomas ao lado de bandeiras

Posicione o botão de troca de idioma com cuidado

Projete o alternador de idioma para ser responsivo

Certifique-se de que o alternador de idioma seja consistente em todas as páginas

Configure um alternador de idiomas no site multilíngue do Bubble usando Linguise !

Você também pode estar interessado em ler

4+ ferramentas eficazes de localização para o seu site

Guia Baidu SEO: como obter tráfego no maior mecanismo de pesquisa da China

Por que você deve traduzir seu site relacionado a criptografia para pelo menos 5 idiomas

Jurídico

Suporte

Produto

20% de desconto

PROMOÇÃO DE NATAL