Guia de configuração completo
Tudo que você precisa para instalar, configurar e usar GoLocal! para tornar seu aplicativo Bubble.io multilíngue.
Dados Bubble seguros, tradução de UI estável e lógica multilíngue explícita
Atualize o plugin do Bubble Plug-ins guia antes de testar os recursos abaixo. A configuração, as traduções e o faturamento do Project permanecem anexados ao projeto GoLocal. Os desenvolvedores de aplicativos não precisam colar ou manter um script no cabeçalho Bubble do Bubble; a versão publicada do plugin contém o tempo de execução suportado.
Os dados editáveis permanecem intactos
Entradas comuns, entradas multilinha, editores Quill e outras áreas contenteditable não são traduzidas reversamente enquanto um usuário digita.
Exclusões de conteúdo reutilizável
Proteja valores de banco de dados inseridos pelo usuário e células de grupo de repetição com do_not_translate_selectors em vez de IDs HTML duplicados.
Pesquisa reversa automática segura
Bubble SearchBox, suspenso, MultiDropdown herdado e Select2 MultiDropdown podem corresponder opções traduzidas com valores do idioma de origem.
Elemento GoLocal Query
Use um elemento GoLocal Query independente por entrada comum somente quando essa entrada acionar uma pesquisa de texto no idioma de origem, condição ou filtro API.
1 Instale o plug-in
GoLocal! está disponível como um plug-in grátis no mercado Bubble.io. Você não paga nada para instalá-lo – o plugin em si custa US$ 0. O faturamento só se aplica quando você o conecta a um projeto GoLocal! com uma chave API.
Abra o editor Bubble → guia Plugins.
Clique em “+ Adicionar plug-ins” e pesquise “GoLocal” ou “Auto Translator”.
Instale GoLocal! – Tradutor Automático. Se já estiver instalado, atualize-o para a versão publicada mais recente.
Arraste o elemento GoLocal! para qualquer página (normalmente um cabeçalho reutilizável). O elemento é invisível.
2 Crie sua conta e Project
Para ativar o plugin, você precisa de um Chave API. As chaves API são geradas em seu painel GoLocal! quando você cria um projeto.
Um Teste gratuito de 5 dias inicia automaticamente. Não é necessário cartão de crédito. Seu Chave API é gerado imediatamente.
Copie a chave API — você precisará dela ao configurar o plugin em Bubble.
myapp.bubbleapps.io, insira exatamente isso.3 Configurar o plug-in
Clique no elemento GoLocal!. No mínimo, defina um campo:
Configuração mínima necessária:
api_key→ cole a chave API do seu projeto GoLocal!Com apenas a chave API, GoLocal! carrega a configuração do projeto, usa o navegador do visitante ou a seleção de widget salva, traduz o texto visível da UI e mostra o alternador de idioma.
4 Campos de plug-in - referência
api_keyObrigatórioA chave API do seu projeto no painel GoLocal!.
Vinculado ao domínio – seguro para inclusão no código do lado do cliente.
source_languageOpcionalCódigo de duas letras do idioma original do seu aplicativo. Exemplos: en, uk, de.
Normalmente deixe em branco quando o idioma de origem já estiver configurado no projeto GoLocal. Defina-o somente quando você precisar substituir intencionalmente o valor do projeto/Trabalhador.
target_languageOpcionalNormalmente deixe este campo vazio. O widget e a seleção persistente do visitante controlam o idioma ativo durante os carregamentos de página.
Um valor codificado como fr força esse idioma sempre que o elemento é inicializado e pode substituir a escolha do visitante. Vincule um valor dinâmico somente quando seu aplicativo Bubble possuir intencionalmente o estado do idioma e fornecer um código de idioma estável em cada página.
enabledOpcionalCaixa de seleção que controla se a tradução está ativa. Padrão: verificado.
show_widgetOpcionalMostre o widget de alternância de idioma integrado. Padrão: verificado. Desligue-o somente quando seu aplicativo Bubble fornecer seus próprios controles de idioma e chamadas switch_language.
widget_positionOpcionalPosição do widget: bottom-right (padrão), bottom-left, top-right, top-left.
dataset_1OpcionalPré-traduza seu banco de dados Bubble para carregamento instantâneo.
Formato estruturado (recomendado):
//Configuração Bubble:
Faça uma pesquisa por (Categorias):formatar como texto
Conteúdo: {Título desta categoria; O nome desta categoria; Corpo desta categoria}
Delimitador: ,
// Acrescenta outro tipo:
:append Faça uma busca por (Curas):format como texto
Conteúdo: {Título desta cura; O nome desta cura; A receita desta cura}
Delimitador: ,
Campos dentro { } separados por ; - blocos separados por ,. Veja Conjuntos de dados para obter detalhes.
do_not_translate_idsOpcionalIDs de elementos separados por vírgula para nunca traduza. A especificação de um ID de grupo/contêiner exclui todos os filhos.
Exemplo: user-bio, code-block, brand-section
Os IDs HTML devem ser exclusivos. Não reutilize o mesmo ID em células de grupos de repetição; use do_not_translate_selectors com uma classe.
do_not_translate_selectorsOpcionalSeletores CSS para conteúdo reutilizável ou repetido que deve permanecer exatamente como armazenado. Um elemento correspondente e todos os seus filhos são excluídos.
Exemplos: .gl-user-content, [data-user-content], [id^="gl-user-content-"]
Recomendado para valores de banco de dados inseridos pelo usuário e grupos repetidos. Um seletor de classe ou prefixo de ID pode corresponder com segurança a muitas linhas sem criar IDs HTML duplicados.
private_translate_idsOpcionalElementos que são traduzidos mas traduções não são armazenados em cache globalmente. Use para dados por usuário (nomes, endereços).
Exemplo: user-name, order-address
Se o conteúdo precisar permanecer exatamente como o usuário o inseriu, não utilize este campo. Exclua-o com do_not_translate_selectors.
5 Conjuntos de dados – traduzindo seu banco de dados Bubble
A maioria dos aplicativos Bubble exibe dados do banco de dados. Sem conjuntos de dados, o conteúdo dinâmico é traduzido na primeira visualização, causando um atraso visível. Os conjuntos de dados pré-traduzem tudo para carregamento instantâneo.
Formato 1: Estruturado — para itens com vários campos (recomendado)
Embrulhe cada item em {}, campos separados com ; (ponto e vírgula), use , como delimitador entre itens.
// Bubble: Faça uma busca por (Categorias):formatar como texto
Conteúdo: {Título desta categoria; O nome desta categoria; Corpo desta categoria}
Delimitador: ,
// Anexar: Faça uma busca por (Cures):format como texto
Conteúdo: {Título desta cura; O nome desta cura; A receita desta cura}
Delimitador: ,
// Resultado: {Saúde;Bem-estar;Guia...},{Beleza;Cuidados com a pele;Rotinas...},{Aspirina;Alívio;Tomar 2x...}
{} dividido por ; — blocos divididos por , – vírgulas em seu texto são seguras.Formato 2: Simples — para listas de valor único
Para valores curtos sem vírgulas (nomes de categorias, tags):
Conteúdo: O nome desta categoria Delimitador: ,
// Saída: Eletrônicos, Roupas, Livros, Brinquedos
Importante: Se o texto puder conter vírgulas, use sempre o formato estruturado com {field;field} embrulho.
normalized_query somente no filtro ou condição. Veja o guia Bubble completo.6 Estados, eventos e ações Bubble
O elemento principal GoLocal! possui a tradução da página e expõe o idioma ativo para Bubble. Use seus estados em condições e seus eventos para iniciar fluxos de trabalho no ponto correto do ciclo de vida da tradução.
1. Tempo de execução pronto
translator_ready = yes significa GoLocal inicializado. Isso não significa que todos os elementos dinâmicos Bubble terminaram a tradução.
2. Idioma alterado
language_changed dispara quando o idioma ativo muda. Leia current_language aqui.
3. Aprovação concluída
translation_complete dispara após a conclusão de um lote de tradução. O conteúdo dinâmico pode criar lotes posteriores.
current_languagetextO código de idioma ativo de duas letras. Use-o para links de PDF, condicionais Bubble e interface de usuário de idioma de propriedade do aplicativo.
detected_languagetextO idioma de origem/navegador detectado relatado pelo tempo de execução.
translator_readyyes/noSim, após a inicialização do tempo de execução da tradução.
is_translatingyes/noSim, enquanto a GoLocal está processando um passe de tradução.
translation_completeyes/noSinalizador de conclusão da passagem mais recente.
total_textsnumberNúmero de itens de texto observados na sessão de tempo de execução atual.
cached_local / cached_bundle / cached_servernumberContadores de cache de diagnóstico. Útil para verificações de suporte e desempenho.
traduzido / erros / tokens_usednumberTradução em tempo de execução e contadores de erros.
last_error / preload_statustextO erro de tempo de execução mais recente e o status de pré-carregamento para diagnóstico.
Ações do elemento
switch_language— mude para o campo de ação necessáriotarget_lang, por exemplofr.Start_translation— iniciar ou retomar a observação e a tradução.Stop_translation— pare de observar e traduzir até reiniciar.rescan_dom— verifica explicitamente o conteúdo renderizado após um pop-up Bubble, elemento reutilizável ou atualização de grupo de repetição.
Exemplo: mostrar um link de PDF em francês
Crie uma condição Bubble no link ou grupo: When GoLocal! A's current_language is "fr". Se um fluxo de trabalho precisar ser executado quando o visitante mudar de idioma, use When GoLocal! A language_changed. Você não precisa esperar translation_complete apenas para ler o idioma selecionado.
7 Dados do usuário, formulários e grupos repetidos
GoLocal traduz o texto da interface, mas os dados digitados ou criados pelos usuários devem permanecer estáveis. O tempo de execução atual protege entradas comuns, entradas multilinha, editores Quill e outros contenteditable áreas enquanto uma pessoa digita.
Seguro por padrão
- • Os valores de entrada e entrada multilinha são salvos exatamente como digitados.
- • Quill
.ql-editore outras regiões editáveis são ignoradas durante a digitação. - • E-mails, senhas, números, datas, IDs e arquivos devem sempre usar seus valores Bubble originais.
A Rede de Display precisa de uma exclusão
Quando o conteúdo do usuário salvo é exibido posteriormente por um elemento de texto Bubble normal, o GoLocal não consegue saber se é uma cópia da interface do usuário ou dados do usuário. Marque esse elemento de exibição ou seu menor contêiner como uma zona sem tradução.
Configuração recomendada de grupo de repetição
- 1. Selecione apenas o elemento Texto que exibe o conteúdo do usuário. Não exclua todo o grupo de repetição se seus botões, títulos e rótulos estáticos ainda precisarem ser traduzidos.
- 2. Dê a cada linha um ID dinâmico exclusivo.ID exclusivo da coisa da célula gl-user-content-Current
- 3. Adicione um seletor ao elemento GoLocal.do_not_translate_selectors = [id^="gl-user-content-"]
Se sua configuração Bubble ou um elemento reutilizável puder aplicar uma classe personalizada, .gl-user-content é ainda mais simples. Adicione essa classe uma vez a do_not_translate_selectors.
Marcadores sem tradução suportados
O tempo de execução respeita data-tr-skip, data-no-translate, translate="no"e aninhado .notranslate elementos. Os campos de seletor de ID e CSS configurados continuam sendo o método nativo Bubble mais fácil.
Ignorar versus tradução privada
do_not_translate_* preserva o valor original. private_translate_ids ainda traduz o valor, mas evita um cache global compartilhado. Use tradução privada somente quando o conteúdo precisar ser genuinamente traduzido.
home ou check_box. Se um ícone for baseado em texto, exclua o menor contêiner de ícone/controle para que a palavra-chave do glifo nunca seja traduzida.8 Editor de tradução e correções manuais
Use o Editor de Tradução para cópias fixas do produto: rótulos de navegação, títulos, botões, texto de ajuda e outras frases que devem ter uma tradução revisada. As entradas manuais são bloqueadas e não são substituídas por tradução automática posterior.
Boa correção manual
Fonte Plano de atualização → frase revisada do produto francês Améliorer le plan. Esta é uma cópia de interface estável e pertence ao editor.
Não corrija os dados do usuário uma linha por vez
Um nome criado pelo cliente, como Trabalho domiciliar deve ser excluído no elemento de exibição Bubble. Adicionar milhares de traduções de identidade não é um substituto seguro para uma zona sem tradução.
- 1. Abra o projeto no painel GoLocal e escolha Traduções.
- 2. Pesquise a frase de origem exata e o par de idiomas.
- 3. Edite o valor alvo ou use Adicionar tradução para uma nova frase fonte exata.
- 4. Salve. A entrada está marcada manual, a versão do pacote configurável muda e o tempo de execução atualiza o dicionário do projeto.
- 5. Teste novamente a rota Bubble exata onde a frase é renderizada. Usar
rescan_domsomente se a frase aparecer após uma renderização incomum de terceiros.
en → fr, não auto → fr. O tempo de execução solicita o par de origem resolvido do projeto.9 Como funciona a tradução
GoLocal observa o Bubble DOM renderizado, aplica primeiro as traduções do pacote do projeto e do cache local e solicita apenas frases ausentes ou alteradas. Ele continua observando pop-ups, elementos reutilizáveis e grupos repetidos que Bubble renderiza posteriormente.
Carregamento inicial da página
O tempo de execução resolve os idiomas de origem e de destino, carrega o pacote atual do projeto, verifica o texto visível da interface do usuário e revela a página por meio do fluxo antioscilação integrado.
Traduções em cache
Frases conhecidas são aplicadas a partir do pacote ou cache do navegador sem regenerá-las. Uma versão alterada do pacote invalida valores obsoletos em cache.
Conteúdo Bubble dinâmico
O observador DOM coleta pop-ups recém-renderizados, elementos reutilizáveis, grupos condicionalmente visíveis e células de grupos de repetição. rescan_dom é um substituto explícito.
10 Solução de problemas e testes de liberação
A página é redefinida para um idioma
Deixe target_language vazio em todas as páginas e no elemento GoLocal reutilizável, a menos que seu aplicativo Bubble possua deliberadamente o idioma. Um valor codificado é reaplicado na inicialização.
O widget está faltando
Confirme se show_widget está marcado, se a versão mais recente do plugin está instalada e se apenas um elemento GoLocal pretendido controla a página. Em seguida, teste fora do modo de depurador passo a passo Bubble.
Um pop-up ou uma nova linha de grupo de repetição permanece sem tradução
Aguarde até que o elemento fique visível. O observador normalmente o encontra automaticamente; se um elemento de terceiros for renderizado de maneira incomum, execute rescan_dom após o pop-up ou grupo ser mostrado.
Alterações de entrada ou rich text durante a digitação
Atualize o plug-in, confirme o tempo de execução atual e verifique se o fluxo de trabalho de salvamento lê o valor de entrada/editor original – não o texto de exibição traduzido ou normalized_query.
O texto em francês criado pelo usuário é traduzido novamente
Exclua o texto/contêiner de exibição por meio de do_not_translate_selectors. Proteja o menor valor dinâmico, não toda a UI estática ao seu redor.
Uma correção manual retorna para automática
As entradas manuais atuais estão bloqueadas. Confirme que você editou o mesmo texto de origem e o mesmo par de idiomas usado pelo tempo de execução e, em seguida, envie o projeto, a rota, a frase e o tempo de teste para o suporte.
Os nomes dos meses/dias permanecem em inglês
O navegador nativo ou o cromo do seletor de data Bubble segue a localidade do navegador/controle. GoLocal traduz os rótulos adjacentes, mas não reescreve a interface interna do seletor de data.
Chrome oferece tradução de página própria
O plugin já marca o documento como notranslate para tradução do navegador enquanto permite que o próprio GoLocal seja executado. Atualize o plugin; não adicione uma segunda extensão ou script de tradução.
O texto fica diferente após a tradução
GoLocal preserva a tipografia Bubble. As frases traduzidas podem ser mais longas, portanto, verifique Bubble largura mínima, largura máxima, altura de ajuste, estouro e regras de resposta em cada ponto de interrupção.
Lista de verificação de aceitação Bubble
- ✓Alterne origem → destino → fonte sem atualizar.
- ✓Navegue entre todas as páginas Bubble e cabeçalhos reutilizáveis.
- ✓Abra pop-ups e carregue linhas de grupos repetidos após o carregamento da página.
- ✓Digite, cole, edite, salve e reabra campos normais e rich text.
- ✓Teste um valor de dados do usuário excluído dentro de cada grupo repetidor.
- ✓Teste SearchBox, lista suspensa, pesquisa herdada/Select2 MultiDropdown.
- ✓Teste cada link condicional current_language e PDF/recurso.
- ✓Teste novamente Chrome, Safari, largura móvel e uma sessão privada.
[GoLocal v4].11 Preçose faturamento
Três planos, todos com palavras de tradução ilimitadas e idiomas de destino ilimitados.
| Recurso | Starter | Pro | Business |
|---|---|---|---|
| Preço mensal | $15/mo | $35/mo | $89/mo |
| Preço anual | $149/yr | $349/yr | $890/yr |
| Idiomas alvo | Ilimitado | Ilimitado | Ilimitado |
| Limite MAU | 30K | 150K | 1M |
| Projetos | 1 | 1 | 2 |
MAU
Visitantes únicos que viram traduções. Bots filtrados. 10% de excesso grátis e $ 3/10 mil extras.
Idiomas
Todos os planos pagos incluem idiomas de destino ilimitados, sem cobrança adicional por idioma.
Avaliação gratuita de 5 dias
Cada novo projeto começa com uma avaliação gratuita. Não é necessário cartão de crédito.
12 Parceiro Program
Ganhe dinheiro recomendando GoLocal!
Compartilhe seu link de indicação – ganhe comissões recorrentes para cada cliente pagante que você traz.
Inscreva-se como parceiro
Painel → guia Parceiro → "Junte-se ao Parceiro Program". Obtenha seu link de indicação exclusivo.
Compartilhe seu link
Blog, YouTube, fórum Bubble, mídias sociais, tutoriais ou diretamente com clientes.
Ganhe comissões
Comissão recorrente durante a vida útil da assinatura de cada usuário indicado.
Seja pago
Solicite o pagamento por transferência bancária ou PayPal quando o saldo atingir o limite mínimo.
Pronto para tornar seu aplicativo multilíngue?
Instale o plugin gratuito, crie um projeto, cole sua chave API – e seu aplicativo Bubble fala todos os idiomas.