Ajuda
Fazer login

Login social para contas de clientes

Além da experiência padrão de login sem senha para contas de clientes, é possível conectar as contas do Google e do Facebook para permitir que os clientes façam login usando credenciais sociais.

Ativar o login social para contas de clientes oferece uma experiência de login mais rápida por meio de métodos de autenticação conhecidos. É possível ativar vários métodos de login social na loja.

Se você conectou um provedor de identidade próprio às contas de clientes e quer conectar o login social, é necessário entrar em contato com o provedor de identidade externo.

Nesta página

Considerações para conectar o login social a contas de clientes

Analise as considerações a seguir para conectar o login social a contas de clientes:

  • É preciso ter uma conta de desenvolvedor no provedor que você quer conectar às contas de clientes.
  • O único dado do cliente sincronizado com a Shopify no uso do login social é o endereço de e-mail.

Conectar o Google a contas de clientes

Para conectar o Google a contas de clientes, conclua as tarefas a seguir na ordem indicada:

Durante a configuração, é necessário alternar entre as abas do navegador referentes ao Google Cloud Console e ao admin da Shopify. Vale lembrar que você precisará ter uma conta do Google Cloud configurada para conectar o Google a contas de clientes. Para saber mais, consulte a documentação de ajuda do Google.

Etapa 1: abrir a página "Fazer login com o Google" no admin da Shopify

  1. No admin da Shopify, acesse Configurações > Contas de clientes.

  2. Na seção Autenticação, clique em Gerenciar.

  3. Clique em Conectar ao lado de Google para abrir a página Fazer login com o Google.

Mantenha esta página aberta em uma aba separada do navegador, pois ela contém informações que precisarão ser copiadas e coladas na configuração do cliente OAuth do app do Google.

Etapa 2: criar um app no Google Cloud Console

  1. Em outra aba do navegador, faça login no Google Cloud Console.
  2. Selecione um projeto existente ou crie um novo para acessar o painel de controle do projeto.
  3. Clique em Menu e, depois, em APIs e serviços > Credenciais.
  4. Clique em Configurar tela de consentimento > Começar.
  5. Preencha as informações de configuração do OAuth do projeto:
    1. Dê ao app um nome que os clientes reconheçam, como o nome da loja virtual. Insira seu e-mail para receber atendimento técnico e clique em Avançar.
    2. Na seção Público, selecione Externo e clique em Avançar.
    3. Forneça um e-mail de contato para o recebimento de notificações do Google sobre o projeto e clique em Avançar.
    4. Aceite a Política de dados do usuário dos Serviços de API do Google e clique em Continuar.
    5. Clique em Criar.
  6. Configure as informações das políticas do app exibidas aos clientes na tela de consentimento:
    1. Clique em Branding.
    2. Na seção Domínio do app, inclua links para a página inicial, a Política de privacidade pública e os Termos de serviço. Saiba mais sobre como criar políticas da loja.

Etapa 3: configurar o cliente OAuth do app no Google Cloud Console

Nesta etapa, você deve copiar as informações da seção Instruções de configuração, localizada na página Fazer login com o Google do admin da Shopify, e colar nos respectivos campos da aba do Google Cloud Console.

  1. No app do projeto no Google Cloud Console, clique em Visão geral.
  2. Na seção Métricas, clique em Criar cliente OAuth.
  3. Configure as informações do cliente OAuth:
    1. No menu suspenso Tipo de aplicativo, selecione Aplicativo da Web.
    2. Digite um nome no campo Nome.
  4. Configure a seção Origens JavaScript autorizadas do app:
  5. Na seção Origens JavaScript autorizadas, clique em + Adicionar URI.
  6. Na página Fazer login com o Google no admin da Shopify, copie o valor em Origens JavaScript autorizadas.
  7. No Google Cloud Console, cole o valor no campo URIs 1.
  8. Caso haja mais de um URI na seção JavaScript autorizado do admin da Shopify, repita essas etapas para os campos de URI adicionais.
  9. Configure a seção URIs de redirecionamento autorizados do app:
  10. No Google Cloud Console, clique em + Adicionar URI na seção URIs de redirecionamento autorizados.
  11. Na aba do navegador com o admin da Shopify, copie o valor do URI de redirecionamento autorizado.
  12. Volte para o Google Cloud Console e cole o valor no campo URIs 1.
  13. Se houver mais de um URI na seção URI de redirecionamento autorizado do admin da Shopify, repita essas etapas para os campos de URI adicionais.
  14. No Console do Google Cloud, clique em Criar.

Mantenha a caixa de diálogo Cliente OAuth criado aberta para a Etapa 4: Configurar as credenciais no admin da Shopify, pois você precisa copiar e colar informações do Console do Google Cloud no admin da Shopify.

Etapa 4: Configurar as credenciais no admin da Shopify

  1. Na caixa de diálogo Cliente OAuth criado no Console do Google Cloud, copie o ID do cliente.
  2. Na página Fazer login com o Google do admin da Shopify, na seção Credenciais, cole o ID do cliente.
  3. Na caixa de diálogo Cliente OAuth criado no Console do Google Cloud, copie a Chave secreta do cliente.
  4. Na página Fazer login com o Google do admin da Shopify, na seção Credenciais, cole a Chave secreta do cliente.
  5. Na página Fazer login com o Google do admin da Shopify, clique em Salvar.

Etapa 5: Publicar o app no Console do Google Cloud

  1. No app do projeto no Console do Google Cloud, clique em Público.
  2. Clique em Publicar app.

Conectar o Facebook às contas de clientes

Para conectar o Facebook às contas de clientes, conclua estas tarefas na ordem indicada:

Durante a configuração, é necessário alternar entre as abas do navegador para o painel de controle do Meta for Developers e o admin da Shopify. Para conectar o Facebook às contas de clientes, você precisa ter uma conta de Meta Developer. Saiba como se registrar como Meta Developer.

Etapa 1: Abrir a página Fazer login com o Facebook no admin da Shopify

  1. No admin da Shopify, acesse Configurações > Contas de clientes.

  2. Na seção Autenticação, clique em Gerenciar.

  3. Clique em Conectar ao lado de Facebook para abrir a página Fazer login com o Facebook.

Etapa 2: Criar um app no painel de controle do Meta for Developers

  1. Em outra aba do navegador, acesse o painel de controle do Meta for Developers e clique em Entrar. Se você não configurou uma conta de Meta Developer, será preciso criar uma nova na página de login antes de continuar para a próxima etapa.
  2. Clique em Apps.
  3. Clique em Criar app.
  4. Preencha os campos Nome do app e E-mail de contato do app. Depois, clique em Avançar.
  5. Na página Adicionar casos de uso, selecione Autenticar e solicitar dados de usuários com o Login do Facebook e clique em Avançar.
  6. Na página Qual portfólio empresarial você quer conectar a este app?, selecione um portfólio empresarial ou selecione Ainda não quero conectar um portfólio empresarial. e clique em Avançar.
  7. Revise a página Requisitos de publicação e clique em Avançar.
  8. Revise a página Visão geral e clique em Acessar o painel de controle.

Etapa 3: Configurar as definições do app da Meta

  1. Depois de criar o app, no painel de controle do Meta for Developers, clique em Casos de uso.
  2. No caso de uso Autenticar e solicitar dados de usuários com o Login do Facebook, clique em Personalizar.
  3. Para garantir que as informações de clientes sejam capturadas durante o login, clique em Adicionar na seção Permissões e recursos, ao lado de email.
  4. Clique em Configurações e acesse Configurações do OAuth do cliente.
  5. Na página Fazer login com o Facebook do admin da Shopify, copie a URL de redirecionamento da seção URLs de redirecionamento.
  6. Na página Configurações no painel de controle do Meta for Developers, cole a URL de redirecionamento no campo URIs de redirecionamento do OAuth válidos.
  7. Se você tiver mais de uma URL de redirecionamento na seção URLs de redirecionamento do admin da Shopify, repita essas etapas para as outras URLs.
  8. Na página Fazer login com o Facebook do admin da Shopify, copie a URL da seção URL de desautorização.
  9. Na página Configurações no painel de controle do Meta for Developers, cole a URL no campo URL de retorno de chamada de desautorização.
  10. Na página Configurações no painel de controle do Meta for Developers, clique em Salvar alterações.

Etapa 4: Configurar as credenciais no admin da Shopify

  1. Clique no ícone de Página inicial para retornar ao painel de controle do Meta for Developers. Em seguida, clique em Configurações do app > Básico.
  2. Copie o ID do app no painel de controle do Meta for Developers.
  3. Na página Fazer login com o Facebook do admin da Shopify, cole o ID do app no campo ID do app, na seção Credenciais.
  4. No painel de controle do Meta for Developers, clique em Mostrar ao lado de Chave secreta do app e copie a Chave secreta do app.
  5. Na página Fazer login com o Facebook do admin da Shopify, cole o código no campo Chave secreta do app e clique em Salvar.
  6. No admin da Shopify, clique em Salvar alterações.

Etapa 5: Testar e ativar a opção Fazer login com o Facebook

  1. Na página Fazer login com o Facebook do admin da Shopify, clique em Mais ações > Visualizar e teste o fluxo de autenticação do Facebook como se você fosse um cliente fazendo login na loja.
  2. Clique em Ativar.

Depois de ativar a opção Fazer login com o Facebook, teste a experiência do cliente. Para isso, acesse a loja virtual e faça login na conta de cliente usando o Facebook.

Fazer login com o Shop

Se o Shop Pay estiver ativado, o cliente poderá fazer login com as credenciais do Shop e as chaves de acesso salvas. Os clientes também farão login automático com o Shop depois de finalizarem a compra na loja usando o Shop Pay.

O Fazer login com o Shop é ativado automaticamente nas contas de clientes e só poderá ser removido da loja se o Shop Pay for desativado.

Saiba como adicionar um botão Fazer login com o Shop à loja.

Gerenciar as opções de login social

É possível editar, desativar ou remover um método de login social conectado.

Após a desativação ou remoção de um método de login social, os clientes continuam conectados para evitar interrupções. As sessões desse tipo de login expiram naturalmente ou quando os clientes saem da conta.

Passos:

  1. No admin da Shopify, acesse Configurações > Contas de clientes.

  2. Na seção Autenticação, clique em Gerenciar.

  3. Ao lado do método de login que você quer alterar, clique no menu ….

  4. Siga um destes procedimentos:

    • Para editar uma opção de login, clique em Gerenciar e atualize as credenciais desejadas.
    • Para desativar uma opção de login sem removê-la, clique em Desativar.
    • Para remover uma opção de login, clique em Remover e selecione Remover na caixa de diálogo.

Atualizar os logins sociais ao alterar o domínio de contas de clientes

Para alterar o domínio de contas de clientes para um URL diferente, é necessário atualizar as configurações de login social antes de fazer a alteração na Shopify. Isso garante que os clientes continuem fazendo login sem interrupções.

Essas etapas são necessárias ao atualizar o URL de contas de clientes na Shopify do formato legado, como shopify.com/1234567890/account, para o novo formato de subdomínio, account.sua-loja.com, ou de um subdomínio atual para um diferente, como de account.sua-loja.com para customers.sua-loja.com.

Adicionar o novo subdomínio de contas de clientes aos provedores sociais

Nas configurações do provedor social, o novo domínio será adicionado ao lado do domínio atual. Depois de alterar o domínio de contas de clientes na Shopify e confirmar que o processo de login e logout nas contas está funcionando, você poderá remover as entradas do domínio antigo.

Repita essas etapas para cada opção de login social ativada.

Passos:

Google
  1. Acesse o Google Cloud Console e abra APIs e Serviços > Credenciais.
  2. Selecione o cliente OAuth 2.0 criado para a Shopify.
  3. Em Origens JavaScript autorizadas, adicione uma nova entrada. Por exemplo: https://account.sua-loja.com
  4. Em URIs de redirecionamento autorizados, adicione uma nova entrada. Por exemplo: https://account.sua-loja.com/authentication/social/google/callback
  5. Em URL de callback de desautorização, adicione uma nova entrada. Por exemplo: https://account.sua-loja.com/authentication/social/google/revoke
  6. Salve as alterações. Por enquanto, mantenha o URL antigo e o novo.
  7. Volte para o admin da Shopify e siga as etapas para alterar o domínio de contas para o novo URL de subdomínio personalizado na Shopify.
  8. Teste o login e o logout com cada opção social na vitrine virtual para confirmar se tudo está funcionando.
  9. Opcional: após confirmar que o processo de login está funcionando corretamente, você poderá voltar ao Google e remover as entradas do domínio antigo.
Facebook
  1. Acesse o Meta for Developers e abra seu app.
  2. Acesse Login do Facebook > Configurações.
  3. Em URIs de redirecionamento do OAuth válidos, adicione uma nova entrada. Por exemplo: https://account.sua-loja.com/authentication/social/facebook/callback
  4. Em URL de callback de desautorização, adicione uma nova entrada. Por exemplo: https://account.sua-loja.com/authentication/social/facebook/revoke
  5. Acesse Configurações > Básico.
  6. Em Domínios do aplicativo, adicione uma nova entrada. Por exemplo: account.sua-loja.com
  7. Salve as alterações. Por enquanto, mantenha o URL antigo e o novo.
  8. Volte para o admin da Shopify e siga as etapas para alterar o domínio de contas para o novo URL de subdomínio personalizado na Shopify.
  9. Teste o login e o logout com cada opção social na vitrine virtual para confirmar se tudo está funcionando.
  10. Opcional: após confirmar que o processo de login está funcionando corretamente, você poderá voltar ao Facebook e remover as entradas do domínio antigo.