Central de Atendimento Nuvem Configure sua loja Layout Redes Sociais

Como ativar o Login via Facebook para seu cliente?

Passos para oferecer o cadastro e login com o Facebook em sua loja virtual Nuvemshop

Última atualização: 01/04/2021

Em sua loja virtual Nuvemshop, é possível ativar o Login / Cadastro com a conta do Facebook para seu cliente. Habilitar essa opção facilita o cadastro e também o acesso às informações. Para isso, é necessário que você tenha um perfil pessoal no Facebook, não precisa ter uma fanpage

E neste tutorial vamos te ensinar a configurar essa opção em sua loja, o tutorial é longo, pois são muitos passos, mas são fáceis de fazer, então só precisa prestar atenção e dará tudo certo!

Para facilitar, separamos o tutorial em duas partes:

  • Como configurar a conta no Facebook for Developers - para quem ainda não tem conta no Developers e Para quem já tem conta no Developers 
  • Como criar o aplicativo
  • Como configurar o Login do Facebook no painel de sua loja

Como configurar a conta no Facebook for Developers

Para quem ainda não tem conta no Facebook for Developers

1. Com sua conta no Facebook ativa, acesse o site do 🌎 Facebook for Developers e clique em Entrar no menu superior. Se já estiver conectado ao Facebook, vá para o passo 3.

2. Na janela seguinte, você deverá acessar com seu login do Facebook, ou criar um, caso ainda não tenha.


3. Ao conectar com o Facebook, o cabeçalho mudará para a opção Como Começar. Clique ali.

4. Agora, você precisará registrar o seu perfil de desenvolvedor no Facebook. A primeira página irá te apresentar os links para os termos de uso de desenvolvedor da plataforma. Após ler os termos, clique em Continuar.

5. Na página seguinte, confirme se o seu endereço de e-mail está correto, e verifique se deseja receber comunicados de marketing em seu endereço de e-mail.

6. Por último, escolha a opção Proprietário/fundador e em seguida clique em Registro concluído.


7. Na página seguinte você verá a sua Página Inicial do seu perfil de desenvolvedor do Facebook. Para prosseguir, clique em Criar aplicativo.

8. Nas opções de criação de aplicativo, selecione Criar experiências conectadas e clique em Continuar.

9. Na tela seguinte, você deverá escolher o Nome de exibição do aplicativoO e-mail de contato já estará preenchido, e caso você já tenha uma conta do Gerenciador de Negócios, você também poderá integrá-la na terceira opção. Assim que concluir a configuração basta clicar em Criar aplicativo.

Faça a verificação de segurança e clique em Enviar.

Agora, siga para a parte Como criar o aplicativo deste tutorial.

Para quem já tem conta no Facebook for Developers

1. Com sua conta no Facebook ativa, acesse o site do 🌎 Facebook for Developers e clique em Meus aplicativos no menu superior.

2. Na próxima tela, você visualizará os aplicativos anteriormente criados. Clique em Criar aplicativo.


Agora, siga para a parte Como criar o aplicativo deste tutorial.

Como criar o aplicativo

A partir de agora, os passos são iguais tanto para quem nunca criou um aplicativo no Facebook for Developers quanto para quem já tem outros aplicativos criados.

1. Após criar o aplicativo, você verá a página inicial dele, com todos os detalhes que podem ser configurados. O que precisaremos agora será o Login do Facebook. Dentro da aba Painel, desça a tela até encontrar a seguinte opção:

2.  Abrirá essa página, e dentre as plataformas disponíveis, escolha a opção "Web".

No passo 1. Conte-nos sobre seu site, preencha o campo Informe a URL do seu site com o domínio próprio principal de sua loja com o https://www., clique em "Save" e em seguida em "Continuar".

Importante:

depois você poderá cadastrar outras versões do domínio de sua loja (sem o www ou outros domínios secundários), mas nessa tela é importante cadastrar o domínio principal.

Nas próximas etapas, clique em Avançar para finalizar essa parte da configuração.

3. No menu da lateral esquerda, clique em Configurações e depois em Básico.4. Agora, preencha as seguintes informações: 

  • Nome de exibição - coloque novamente o nome que elegeu para seu aplicativo;
  • Domínios do aplicativo - preencha com as URLs de sua loja com WWW e sem WWW;
  • URL da Política de Privacidade - adicione o link para a política de privacidade de sua loja;
  • URL dos Termos de Serviço - adicione o link para os termos de serviço de sua loja;

Importante:

o Facebook exige que sua loja tenha uma página especial para a Política de Privacidade e outra para os Termos de Serviço. O conteúdo dessas páginas depende muito das características do seu negócio. Para saber como criar páginas de conteúdo, siga os passos do tutorial 👉 Como criar páginas de conteúdo?.

  •  Categoria - selecione a categoria "Compras";
  • Finalidade do aplicativo - selecione a opção que melhor se enquadra ao seu negócio. Em geral, a opção Sua empresa ou você é a mais adequada;
  • Verificação - Essa etapa é opcional;
  • Informações de contato do responsável pela proteção dos dados - estas informações não são obrigatórias, mas caso sua loja vá vender internacionalmente, recomendamos que sejam preenchidos todos os campos;
  • Site -  se não estiver automaticamente preenchido, informe novamente o endereço de sua loja;

Clique em "Salvar alterações" para continuar.

Importante:

esse processo deve ser feito com sua loja totalmente desbloqueada, ou seja, se sua loja estiver com o modo Página em Construção ativo, o Facebook não conseguirá detectar a sua página de Política de Privacidade. Caso não saiba como ativar ou desativar o modo Página em Construção, confira o tutorial 👉 Como deixar minha loja no modo Página em Construção?.

5. Após salvar as alterações, clique em "Desativado" no menu superiorNa janela que abrir, clique em "Alterar modo" para ativar o aplicativo e torná-lo público.

Pronto! A configuração no ambiente do Facebook está pronta, agora só falta concluir a próxima etapa, dentro do painel da Nuvemshop.

Como configurar o Login do Facebook no painel de sua loja

1. No painel de administração de sua loja, siga pelo caminho Minha Nuvemshop > Login do Facebook em sua loja.

2. Os dados necessários para preencher esse formulário, estão na sua conta do Facebook for Developers. Volte na página de Configurações do Facebook for Developers e copie o ID do Aplicativo  e a Chave Secreta do Aplicativo para inserir na plataforma.

Importante: 

clique em "Mostrar" para exibir a chave secreta do aplicativo antes de copiá-la, caso contrário copiará apenas os símbolos, e não dará certo a configuração. 

3. O ID do Aplicativo você deve colocar no campo App ID, e a Chave Secreta do Aplicativo no campo App Secret. Em seguida clique em "Salvar alterações" para concluir.

Pronto! Agora em sua loja, nas páginas de Cadastre-se e Login, seus clientes conseguirão criar a conta ou acessar a conta usando o perfil do Facebook.

Importante:

se sua loja usa um layout personalizado, entre em contato com o seu designer e peça para ele liberar essa funcionalidade. Em nossa 🌎 Documentação para Web Designers mostramos como fazer isso.  

O artigo ajudou você?