HIKO Social Login Plus

Ele adiciona login social e sem senha à sua loja virtual. Os clientes podem entrar com provedores como Google, LINE, Facebook e Apple, com um código de uso único enviado por e-mail ou WhatsApp, ou com uma passkey — nenhuma senha para lembrar. Cada login corresponde a uma conta de cliente da Shopify.

O aplicativo é para lojas Shopify Plus que usam as novas contas de cliente. Se sua loja estiver em outro plano, ou ainda usar as contas de cliente clássicas (legadas), a configuração fica bloqueada e um aviso explica o que precisa mudar. Se você acabou de fazer o upgrade ou a migração, reabra o aplicativo para que ele verifique de novo.

É necessária uma assinatura paga. Os planos e preços aparecem na própria página de assinatura da Shopify, e é a Shopify que cobra na sua fatura da Shopify — nós nunca cobramos separadamente. Enquanto você não assinar, abrir o aplicativo leva direto para essa página de assinatura; todas as páginas de configuração são liberadas quando a assinatura fica ativa.

Lojas de desenvolvimento (incluindo sandboxes Plus) não precisam de assinatura e têm todos os recursos, para você construir e testar primeiro.

A tela de instalação solicita três permissões, cada uma ligada a um recurso real:

• read_customers — localizar um cliente existente pelo e-mail para que um login social se junte à conta dele em vez de criar uma duplicada.
• write_customers — sincronizar a caixa de marketing marcada no login com o consentimento de marketing da Shopify dessa pessoa, e gravar as tags e o metacampo de identidade social.
• read_locales — ler o idioma principal da sua loja para enviar e-mails no idioma certo.

Para a Shopify, dados de clientes são dados de cliente protegidos, então essas permissões exigem aprovação adicional. Sem elas, nem a sincronização do consentimento de marketing nem a correspondência com clientes existentes funcionam.

• Painel — o guia de configuração, um resumo da atividade de login e a tendência dos últimos 7 dias. Clique no nome do aplicativo na barra lateral para voltar aqui.
• Análises de clientes — seus clientes, logins individuais, tendências e distribuições de atividade.
• Provedores de identidade — quase toda configuração de login está aqui: o provedor personalizado (a ligação com as contas de cliente), redes sociais, estilos personalizados, login por e-mail, Marketing opt-in, plataformas de marketing e identidade de login social.
• Widget da loja — como o login aparece na sua loja virtual e para onde os clientes vão depois.
• Integrations — Shopify Admin API, webhooks de saída, login headless e mobile.
• Traduções — os textos do widget e da página de verificação (OTP), por idioma.

Esta é a única etapa de configuração obrigatória. O próprio aplicativo é um provedor de identidade com o qual a Shopify conversa:

1. Abra a página Provedores de identidade (ou o guia de configuração do painel) e encontre a seção Provedor personalizado.
2. Clique em Criar provedor personalizado para abrir o admin da Shopify → Configurações → Contas de cliente e adicionar um provedor de identidade de terceiros. Escolha "Custom or other" e dê um nome a ele.
3. Copie a Discovery URL, o Client ID e o Client secret exibidos no aplicativo para os campos correspondentes e defina o nome do parâmetro de URI de redirecionamento após sair com o valor mostrado (post-sign-out). Não pule esse campo — sem ele, a saída fica incompleta.
4. Salve e depois ative o provedor.
5. De volta ao aplicativo, clique em Verificar configuração. Ele consulta sua loja real e informa se a ligação está funcionando, se o Client ID está desatualizado ou se a loja ainda aponta para outro lugar.

1. Abra a seção Redes sociais da página Provedores de identidade.
2. Expanda o provedor desejado (Google, por exemplo) e clique em Como obter seu Client ID e secret para ver as instruções passo a passo.
3. Crie um app OAuth no console daquele provedor, copie o Client ID e o Client secret, cole-os e ative o provedor.
4. Clique em Salvar.

Cada guia leva direto ao console correto e lista os passos exatos. Você também pode reordenar os provedores arrastando-os nessa lista — a prévia ao lado acompanha na hora.

16 provedores sociais: Google, Facebook, Apple, LINE, Kakao, X (Twitter), TikTok, Amazon, Twitch, Microsoft, Yahoo, LinkedIn, Discord, Spotify, GitHub e Yandex. Além de login por código de uso único por e-mail, por passkey e por WhatsApp. Você escolhe quais aparecem no widget e em que ordem.

Sim. Você pode usar seu próprio Client ID e secret OAuth em cada provedor — sem amarras, e a tela de consentimento mostra a sua marca. Alguns provedores têm opções extras: detalhes da chave da Apple, região da Amazon, aviso de adicionar amigo no LINE, canal e escopos do Kakao e um seletor de estilo de ícone do Google.

Sim, e lojas de desenvolvimento não precisam de assinatura. Duas coisas a saber:

• Com uma loja protegida por senha, "Verificar configuração" não chega a uma conclusão. Ele precisa alcançar sua loja real para saber se o login chega a este aplicativo; barrado pela senha, relata que não conseguiu verificar — o que não significa que sua configuração esteja errada.
• O app OAuth de um provedor normalmente exige registrar também o domínio da loja de teste. Confirme que a URL de callback está registrada para a loja de produção e para a de teste.

Sim. Os clientes recebem um código de uso único pelo WhatsApp. Comece com nosso número compartilhado (10 códigos por cliente por dia, 2000 por loja por dia, por nossa conta) ou conecte seu próprio número do WhatsApp Business na página Provedores de identidade para controlar o envio, o modelo de mensagem, o tipo de botão do modelo, seus próprios limites por loja e a cobrança.

O login por e-mail permite entrar com um código enviado por e-mail — sem senha. Depois de verificado, o aplicativo convida a criar uma passkey (Face ID, digital ou PIN do aparelho) — a passkey é um upgrade após o código de uso único, não uma porta de entrada separada. Ambos são ativados separadamente na seção Login por e-mail da página Provedores de identidade (ou no guia de configuração do painel).

Sim, na seção Login por e-mail da página Provedores de identidade:

• SMTP próprio — envie os códigos pelo seu próprio servidor de e-mail (incluindo Outlook / Office 365) para que a mensagem venha de você, não de nós. Depois de preencher, use Enviar e-mail de teste para confirmar que as configurações funcionam.
• E-mail OTP personalizado — edite o assunto e o corpo HTML por idioma, com modo visual e modo HTML, prévia ao vivo e marcadores como {code}, {shop} e {minutes}. Idiomas personalizados ficam marcados como "Personalizado" e podem ser redefinidos para o padrão a qualquer momento.

Sim. Na mesma seção Login por e-mail, Página OTP personalizada permite reescrever todo o HTML da página de verificação por idioma — título, campo do código, link de reenvio, tudo. Os mesmos modos visual e HTML estão disponíveis. Se faltar ao seu HTML algo de que o login realmente precisa, o salvamento é recusado e informa o que falta; a página no ar não é alterada.

Há também uma chave Hospedar a página OTP na sua loja. Ativada, os clientes digitam o código no seu próprio domínio, dentro do seu tema, em vez do nosso. Vem desativada e exige um tema de loja virtual com o aplicativo instalado.

O One Tap mostra o aviso de login em um clique do Google para quem ainda não entrou. Vem desativado — depois de configurar o Google, ative pelo painel ou pela linha do Google na página Provedores de identidade.

Pelo widget de login da sua loja virtual. Eles escolhem um provedor social ou digitam um e-mail (ou número de WhatsApp) para receber um código de uso único. Depois de verificados, estão logados na sua loja — e podem criar uma passkey para voltar com um toque na próxima vez. O widget também marca o último método usado com sucesso com o selo "Usado por último", para quem volta encontrar de imediato.

Ele vê os mesmos métodos de login que você configurou. Como este aplicativo está registrado como provedor de identidade nas contas de cliente, todo caminho que leva ao login — checkout, um link de conta, a URL digitada — é entregue pela Shopify a este aplicativo.

O aplicativo então tenta, nesta ordem: concluir o login em silêncio usando uma sessão de "manter conectado" ainda válida; se não der, exibir uma página de login hospedada por nós que monta exatamente o mesmo widget da sua loja — os mesmos provedores, os mesmos estilos e textos. Não há nada extra a configurar para esse caminho.

A Shopify exige rigorosamente um endereço de e-mail verificado em todo login, senão o bloqueia. Provedores como X (Twitter) e TikTok nem sempre devolvem um.

Nesse caso, o aplicativo insere uma etapa depois da autorização do provedor: a pessoa digita um e-mail e o verifica com um código de uso único, e só então o login da Shopify é criado. A mesma pessoa não será solicitada de novo na próxima vez com aquele provedor — guardamos essa associação. É por isso que o login com esses poucos provedores tem uma etapa a mais do que com o Google.

Não, se o e-mail for o mesmo. Os clientes são identificados pelo e-mail verificado, então quem usa primeiro o Google e depois o Facebook continua sendo um cliente só, desde que ambos tenham o mesmo e-mail — os logins se somam e as análises de clientes mostram uma única linha.

E-mails diferentes geram dois clientes, de propósito: não temos como provar que é a mesma pessoa. Para unificar, peça ao cliente que faça login e vincule as contas ele mesmo em Métodos de login conectados, na página da conta, com Permitir vincular contas com e-mail diferente ativado na página Widget da loja.

Ele é ligado ao cliente existente — sem duplicata. A correspondência é por e-mail: se o e-mail verificado da conta social bater com um cliente que já está na sua loja, aquele login o autentica como esse cliente, com histórico de pedidos e endereços intactos.

Sim. Adicione o bloco de página da conta pela página Widget da loja: clientes logados passam a ver seus métodos de login conectados na página de perfil da conta, onde podem desconectar um ou conectar outro.

Essa mesma seção tem a chave Permitir vincular contas com e-mail diferente (desativada por padrão). Com ela ativa, um cliente pode vincular uma conta social cujo e-mail verificado seja diferente do e-mail da conta, e entrar com ela depois resolve para essa mesma conta. Isso sobrepõe o e-mail do próprio provedor, então ative apenas se confiar que os clientes vinculam somente contas realmente deles.

Quatro formas, todas configuráveis na página Widget da loja:

• Pop-up no ícone da conta — clique em Ativar no tema para abrir as incorporações de app do editor de temas, ative Sign-in widget e salve. A partir daí, clicar no ícone de conta do cabeçalho abre o pop-up de login. Se seu tema for atípico, adicione um seletor CSS próprio na seção Controle de conta, ou opte por usar apenas o seu seletor, ignorando a detecção automática.
• Página de login — no seu tema, aponte um link para /apps/signin (um item do menu do cabeçalho, por exemplo) para abrir a página de login hospedada completa.
• Bloco de cartão de login — na aba Apps do editor de temas, adicione o bloco de app Sign-in embutido em qualquer seção.
• Métodos de login conectados — adicione o bloco de página da conta para que clientes logados vejam e desconectem seus métodos de login social na página de perfil.

Por padrão, mantém o link do próprio tema. Se você tem sua área de cliente, defina o link da página da conta quando logado na página Widget da loja (um caminho da sua loja, por exemplo /a/accounts): clientes logados que clicarem no ícone de conta do cabeçalho vão para lá.

Sim, na página Widget da loja. Defina o redirecionamento pós-login — de volta à página de onde entraram, à página visitada antes dela, ou a um caminho específico (observação: o Google One Tap sempre deixa o cliente na página em que já estava, independentemente desta configuração). Manter conectado (sessão SSO) mantém clientes que retornam logados pelo período que você escolher (1–90 dias, 30 por padrão), evitando reautenticação a cada visita; também é possível não mexer na duração de sessão nativa da Shopify.

Sim, na seção Estilos personalizados da página Provedores de identidade: tema, formato do botão, tamanho, layout (ícone / rótulo / ícone + rótulo / rótulo com ícone à direita), tamanho do ícone e divisor — além de substituições avançadas para cor de fundo e de borda, espessura da borda, altura do botão, tamanho de ícones e rótulos, e peso e cor do rótulo.

Para controle mais fino, ative o CSS personalizado: o aplicativo gera, a partir das suas configurações atuais, um modelo CSS completo e comentado como ponto de partida (classes como .hs-btn e .hs-lbl) para você editar, e é possível regerá-lo a partir das configurações quando quiser. Fundo, borda e altura do botão devem ser definidos nos campos acima, não em CSS. Toda alteração aparece ao vivo na prévia ao lado.

Sim. Expanda qualquer provedor na página Provedores de identidade e você encontra o campo Texto do botão, definido por idioma — o botão do Google pode ter uma redação em português e outra em japonês. Deixe em branco para usar a tradução embutida.

Sim. O widget vem em 15 idiomas e acompanha automaticamente o idioma da loja de cada cliente. Na página Traduções você pode sobrescrever, por idioma, qualquer texto do widget de login e da página de verificação (OTP), e até adicionar um idioma que não esteja na lista; "Redefinir para o padrão" devolve um idioma inteiro aos textos embutidos. Já os textos das caixas de marketing e consentimento são editados direto na seção Marketing opt-in da página Provedores de identidade (também por idioma, e aceitam HTML).

O próprio admin do aplicativo está disponível em 11 idiomas, alternáveis pelo menu de idioma do cabeçalho.

Nada perceptível. O widget é um único arquivo empacotado, servido pelo próprio CDN da Shopify e carregado com defer — ele roda depois que a página é renderizada e nunca bloqueia a primeira pintura. O pop-up e o bloco de cartão compartilham o mesmo arquivo, então uma página o carrega apenas uma vez. E o bloco de cartão de login não é gerado para clientes que já estão logados.

Sim, na seção Marketing opt-in da página Provedores de identidade. A caixa "Receber novidades e ofertas por e-mail" no login sincroniza com o consentimento de marketing da Shopify do cliente; você escolhe se ela vem pré-marcada (observação: pré-marcar não é permitido pelo GDPR/ePrivacy na UE e no Reino Unido) e se desmarcá-la cancela a inscrição. A mesma seção também pode exigir uma caixa de aceite dos termos antes do login. O texto e os links das duas caixas são editados aqui, por idioma.

Se a caixa for marcada por um cliente que ainda não existe, o consentimento fica retido e é aplicado quando a Shopify de fato cria esse cliente — por isso é normal um cliente recém-cadastrado não exibir o consentimento na hora; nada foi perdido.

Sim. Na seção Plataformas de marketing da página Provedores de identidade, conecte Klaviyo, Mailchimp ou Omnisend com sua chave de API — "Validar chave" confirma a conexão, depois "Buscar listas" deixa você escolher em quais listas os clientes entram — e decida se sincroniza todo mundo a cada login ou só quem deu aceite. Também dá para marcar os clientes sincronizados com social-login ou uma tag sua, e criar no Klaviyo métricas de login social e de Google One Tap.

Sim, na seção Identidade de login social da página Provedores de identidade:

• Tags — marca o cliente automaticamente quando ele faz login social. O modelo padrão é uid_%(social)s_%(user_id)s, e as variáveis disponíveis são %(social)s e %(user_id)s. (O IP não é oferecido de propósito: ele muda a cada login e esgotaria o limite da Shopify de 250 tags por cliente.)
• Metacampo do cliente — sempre ativo: cada login social grava JSON em um metacampo do cliente com provedor, ID de usuário, nome e quando foi vinculado. Leia do seu tema com {{ customer.metafields.hiko.social_identities }}.

Sim, na página Integrations:

• Login headless e mobile — configure o cliente OAuth da Customer Account API e as origens permitidas para adicionar login social, OTP por e-mail e login biométrico a uma loja web headless e a apps mobile nativos (React Native, iOS, Android). A página traz o passo a passo para obter o Client ID, a explicação dos esquemas de URI personalizados para mobile e links para os SDKs e repositórios no GitHub.
• Shopify Admin API — consultas de exemplo prontas para ler seus clientes e seus metacampos com um token de acesso criado por você.

Sim. Na página Integrations, defina um endpoint HTTPS e ative os webhooks de saída para customer.login, customer.connected e customer.created. Cada requisição é assinada com um segredo que você gera (X-HIKO-Signature), e há um botão Enviar evento de teste, um registro dos envios recentes e um exemplo pronto de verificação de assinatura em Node.js.

A página Análises de clientes lista seus clientes e os logins individuais, com busca, filtros e exportação CSV. Ela também mostra os logins ao longo do tempo e as distribuições por provedor, navegador, sistema operacional, país e cidade. Clique em qualquer cliente para ver detalhes — telefone, tags e identidades sociais conectadas — e exclua-o (junto com seus logins) se precisar. O painel também exibe a atividade recente e uma tendência de 7 dias.

O número de clientes aqui costuma ser menor que o total no seu admin da Shopify, e está certo: esta página conta apenas quem fez login por meio deste aplicativo. Clientes criados no checkout, por importação ou de outra forma não aparecem.

Somente o que o login e as análises precisam:

• Clientes — endereço de e-mail, nome, quais provedores usaram e os IDs de usuário neles, primeiro e último login e contagem de logins.
• Logins — horário, provedor, navegador, sistema operacional e localização aproximada (país / cidade) de cada login.
• Estado efêmero — os dados de uso único empregados durante o login (a dica do método escolhido, os códigos de uso único, a sessão de "manter conectado") vivem de alguns minutos até o número de dias que você definir, e expiram sozinhos. A sessão de "manter conectado" é criptografada em repouso.

Não guardamos as senhas dos clientes nos provedores sociais, nem retemos tokens de acesso de longa duração dos provedores. Os dados de cliente e de login acima ficam até aquele cliente ser excluído ou até você desinstalar o aplicativo (veja as duas respostas seguintes).

Qualquer um dos caminhos funciona:

• Excluir você mesmo — abra aquele cliente na página Análises de clientes e exclua-o. O registro dele e todos os seus logins vão junto.
• Usar o processo da Shopify — quando um cliente abre um pedido de exclusão ou de acesso a dados pela Shopify, a Shopify avisa este aplicativo e nós apagamos automaticamente os dados desse cliente aqui. Nada mais a fazer da sua parte.

Segredos salvos são exibidos mascarados no admin e nunca voltam ao navegador em texto puro; deixar um campo de segredo vazio ao salvar significa "manter o valor salvo", então ele não pode ser apagado sem querer. O segredo de assinatura dos webhooks é mostrado por inteiro uma única vez, no momento em que é gerado — copie-o então.

Você pode regerar o Client secret do provedor personalizado quando quiser (será pedida uma confirmação); o antigo para de funcionar imediatamente. Depois disso, lembre-se de colar o novo valor nas configurações de contas de cliente da Shopify, senão o login quebra.

Na desinstalação, todas as suas configurações (provedores, credenciais, estilos, SMTP, marketing) são apagadas e as sessões de login invalidadas. As análises de clientes e de login são apagadas cerca de 48 horas depois, quando a Shopify nos notifica, como suas regras exigem.

Portanto reinstalar é começar do zero: todas as credenciais de provedores precisam ser digitadas de novo, e o provedor personalizado nas contas de cliente da Shopify precisa ser configurado outra vez, com novo Client ID e secret. Os clientes em si continuam na Shopify — são clientes da Shopify, não nossos —, mas o registro de quem entrou com qual conta social não volta.

Verifique nesta ordem:

• A incorporação do app não está ativada. O pop-up precisa de Sign-in widget ativado e salvo nas incorporações de app do tema — Ativar no tema, na página Widget da loja, leva direto para lá.
• O ícone de conta não foi reconhecido. A detecção automática cobre a maioria dos temas, mas pode falhar em temas muito personalizados; adicione o seletor CSS desse elemento em Controle de conta.
• Você mesmo está logado. O bloco de cartão de login não é exibido para clientes logados — teste em uma janela anônima.

• O provedor personalizado foi salvo, mas não ativado. É a causa mais comum. Confirme que ele está ativo nas configurações de contas de cliente da Shopify e verifique com Verificar configuração.
• O Client ID está desatualizado. Se você regerou o secret ou reinstalou o aplicativo, a Shopify pode ainda ter o valor antigo — Verificar configuração informa exatamente qual ela está vendo.
• Aquele provedor está sem credenciais. Provedores sem credenciais ficam sinalizados na lista; os botões deles não funcionam.

Confirme que a Callback URL exibida para aquele provedor está registrada, exatamente como aparece, no console dele. O callback com o domínio da sua loja só é usado quando você usa o seu próprio client do Google; em todos os outros casos (inclusive com o nosso client do Google compartilhado) vale o callback do broker mostrado ao lado dos campos do provedor. Copie o valor sem alterações.

E-mail: peça que confira a pasta de spam primeiro. Se você configurou SMTP próprio, use Enviar e-mail de teste para confirmar que as configurações do servidor e o endereço remetente funcionam — um domínio de envio sem os registros de autenticação corretos vai facilmente para o spam. Note também que um mesmo endereço de e-mail pode receber no máximo 20 códigos por dia; atingido o limite, o cliente é avisado diretamente.

WhatsApp: com seu próprio número, o modelo de mensagem precisa ser um modelo de autenticação aprovado pela Meta e o código de idioma do modelo precisa coincidir com o que você informou. Com o número compartilhado, os limites são 10 códigos por cliente por dia e 2000 por loja por dia.

Quase sempre é o nome do parâmetro de URI de redirecionamento após sair que não foi definido. Com "manter conectado" ativado, guardamos aquele cliente do nosso lado, e a Shopify precisa nos avisar na saída para que apaguemos essa memória.

Volte ao admin da Shopify → Configurações → Contas de cliente, abra seu provedor personalizado e confirme que esse campo está como post-sign-out (o valor mostrado no aplicativo). Salve e teste a saída de novo.

Use o botão Suporte no cabeçalho para nos escrever (anexos são bem-vindos) e responderemos por e-mail.