Adicionando o Facebook Messenger ao seu site SimplyBook.me com o Gerenciador de tags do Google [video]

This post is also available in:

Se você tem um site comercial, provavelmente já ouviu falar do Gerenciador de tags do Google, mas sabe o que pode fazer com ele? Você pode ter alguma ideia de que isso tem algo a ver com o Google Analytics e os anúncios, mas realmente não vê o ponto até começar a usar o Google Ads. Você sabia que pode adicionar o Facebook Messenger ao seu site de reservas para facilitar ainda mais o contato com o cliente? E isso usa o Gerenciador de tags do Google.

Pode parecer que é algo que você deveria estar fazendo, mas também pode parecer um pouco demorado e técnico.

NOTÍCIAS! É a 4ª Revolução Industrial ; tudo é técnico!

No entanto, isso não significa que tem que ser complicado.

Confira o tutorial em vídeo sobre como você pode adicionar o Facebook Messenger ao seu site Simplybook.me.

Para aqueles que preferem explicações escritas, continue lendo para mais informações.

O que é o Gerenciador de tags do Google – O que ele faz?

É uma pergunta justa se você ainda não o usa. O gerenciador de tags do Google é uma maneira de introduzir código (ou “tags”) em seu site que pode ajudar em várias tarefas diferentes – muitas vezes para acompanhar e monitorar. Ao contrário da maneira antiga de fazer algo e escrever código diretamente em páginas da web, o Google Tag Manager permite gerenciar todas as suas tags a partir de um único ponto. No Analytics Mania , alguém o descreveu como uma caixa de ferramentas onde você guarda todas as suas ferramentas.

“Imagine o Google Tag Manager como uma caixa de ferramentas, onde você guarda todas as suas ferramentas: uma régua (Google Analytics), um martelo (Google Ads), etc.”

Julius Fedorovicius, mania analítica

Só porque você ouve falar do Google Tag Manager sobre rastreamento e monitoramento de tags na maioria das vezes, não significa que você não possa usá-lo para outras tarefas. que de outra forma seria cansativo de implementar em todas as páginas do seu site.

Por que adicionar o Facebook Messenger ao seu site de reservas?

Claro, você tem um endereço de e-mail. Talvez você até tenha um formulário de contato para as pessoas entrarem em contato com você. No entanto, o Facebook Messenger tem a vantagem de ser familiar a quase todos, muito acessível para você enquanto você está em movimento, e é de acesso rápido e simples. É ainda mais útil se você usar um bot do Messenger para lidar com consultas gerais e automatizar respostas ou apenas para que as pessoas saibam que você responderá em um período de tempo específico.

Você pode preencher previamente as consultas que refletem as perguntas comuns do seu contato quando você tem o Facebook Messenger, tornando as respostas automatizadas muito mais gerenciáveis.

Como adicionar o Facebook Messenger ao seu site SimplyBook.me

Em primeiro lugar, você precisará de uma conta do Google Tag Manager – é grátis. Você também precisará de uma página de negócios no Facebook. Do início ao fim deste processo levei 15 minutos, e isso inclui a criação de uma conta no Google Tag Manager e uma nova página de negócios no Facebook, por isso não é um processo complicado.

Etapa 1: ativar o Gerenciador de tags do Google

No painel, navegue até Recursos personalizados e pesquise o recurso Gerenciador de tags do Google .

Ative o gerenciador de tags e siga as instruções

Para implementar o Gerenciador de tags do Google em seu site de reservas:

1. Vá e inscreva-se em um site gerenciador de tags do Google .
2. Crie um novo contêiner e configure-o.
3. Insira o ID do contêiner nesta página

Se isso parecer um pouco assustador, o Google Tag Manager o guiará pelo processo.

E você criou um contêiner para a tag que deseja usar em seu site de reservas SimplyBook.me.

Para conectar seu Gerenciador de tags do Google ao SimplyBook.me, copie o ID do contêiner (no retângulo vermelho na imagem acima) e volte para as configurações do Gerenciador de tags do Google na interface do SimplyBook.me. Basta colar o ID do contêiner nas configurações da seguinte forma:

E clique em salvar. Seu

O formato é GTM-XXXXXXX, onde os “x” são caracteres alfanuméricos.

Passo 2: Criando a Tag do FB Messenger

Agora você precisa criar a “Tag” ou código que permitirá que seus clientes enviem mensagens para você na sua página de reservas. Então, no seu contêiner, clique no botão “Nova Tag”

é aqui que você configurará sua nova tag e identificará seus pontos de acionamento para seu website.

Clique em “Configuração de tags” e selecione “HTML personalizado”

É aqui que você inserirá o código para sua tag do Facebook Messenger

O código necessário está abaixo

<script>
(function() {
// Modify the variable values ​​below
var page_id ='Fan page number';
var theme_color ='#06ADEF';
var logged_in_greeting ='Hi!';
var logged_out_greeting ='Please log in or click Continue as Guest';
var greeting_dialog_display ='hide';
var ref ='';

// Don't touch the code below
var el = document.createElement('div');
el.className ='fb-customerchat';
el.setAttribute('page_id', page_id);
if (ref.length) {el.setAttribute('ref', ref);}
el.setAttribute('theme_color', theme_color);
el.setAttribute('logged_in_greeting', logged_in_greeting);
el.setAttribute('logged_out_greeting', logged_out_greeting);
el.setAttribute('greeting_dialog_display', greeting_dialog_display);
document.body.appendChild(el);
})();
// Initialise Facebook SDK
window.fbAsyncInit = function() {
FB.init({
xfbml: true,
version:'v4.0'
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src ='https://connect.facebook.net/en/sdk/xfbml.customerchat.js';
fjs.parentNode.insertBefore(js, fjs);
}(document,'script','facebook-jssdk_'));
</script>

Você só pode modificar a seção no início para se adequar às suas variáveis específicas

var page_id =’Número da página de fãs’; Você precisa modificar essa variável para conectar sua página comercial do Facebook e as configurações do Messenger conectadas. Você encontrará este ID de página nas informações “Sobre” da sua página do Facebook na parte inferior em “Mais informações” .

var theme_color =’#06ADEF’; Como padrão, este código hexadecimal personalizado para cores é azul. No entanto, se você quiser alterar a aparência do ícone do Facebook Messenger para combinar ou complementar o design do seu site, poderá alterar essas informações. Os códigos hexadecimais para cores personalizadas estão nas configurações de design em seu painel do SimplyBook.me. Como alternativa, você pode clicar com o botão direito do mouse em qualquer item da página da Web que deseja duplicar a cor e “inspecioná-lo”

igual a:

Combinei meu ícone do Messenger para combinar com meus outros botões de “ação”.

var logado_in_greeting =’Olá!’; Isso depende inteiramente da conversa que você quer ter. “Oi!” “Olá, bem-vindo!” você conhece melhor a linguagem que seus clientes e potenciais clientes irão responder melhor.

var logado_out_greeting =’Por favor, faça o login ou clique em Continuar como Convidado’; – Provavelmente é melhor manter como está, mas você pode alterá-lo se desejar.

var saudação_dialog_display =’ocultar’; – Então você quer sua janela de bate-papo aberta ou fechada como padrão? Alguns sites funcionam melhor abrindo a janela de bate-papo imediatamente. Outros preferem escondê-lo até que um cliente ativo o procure. Você decide.

Quando você tiver feito as alterações nas variáveis, lembre-se de alterar o ‘número da página de fãs’ – você precisará definir seus gatilhos. Clique na caixa de acionamento abaixo da janela de código e selecione “Todas as páginas” .

Clique em “Salvar” e dê à sua tag um nome descritivo apropriado. Eu usei “FB Messenger Contact” e um número de versão.

De volta à página de visão geral do contêiner, clique em enviar,

Crie um nome de versão e qualquer descrição que você queira fazer e ” Publicar” .

Passo 3: Uma última coisa a fazer

Antes que isso funcione, você tem uma última coisa a fazer. Isso é para adicionar seu site SimplyBook.me aos seus domínios da lista de permissões em sua página de negócios do Facebook.

No Facebook – especificamente na sua página de negócios – vá para Gerenciar Página // Configurações // Mensagens Avançadas.

Aqui você verá um campo para “domínios na lista de permissões. Cole o URL do seu site SimplyBook.me aqui e clique em “Salvar” .

Etapa 4: comece a receber mensagens do Facebook Messenger

Vai demorar um pouco para que todos os respectivos servidores sejam atualizados com as informações que você inseriu, mas quando terminar, você terá um ícone do Facebook Messenger que aparece na parte inferior esquerda da tela.

Igual a:

Clientes ou clientes em potencial entrarão em contato com você através desta janela de bate-papo e você receberá as mensagens por qualquer meio que você normalmente receberia em bate-papos de mensagens. Pode ser seu telefone, tablet ou PC.

Agora você terminou

Claro, você colocou uma janela de bate-papo do Facebook Messenger em seu site Simplybook.me, mas há muito mais coisas que você pode fazer com o Google Tag Manager. Claro, existem Google Analytics e Ads que funcionam extremamente bem com o gerenciador de tags. No entanto, é uma ferramenta muito versátil que pode ser usada para rastrear informações dos visitantes do seu site.

Há tantas coisas que você pode usar com o gerenciador de tags do Google que alguém montou uma lista de códigos personalizados para uma integração legal que você pode implementar com ele. Talvez alguns deles sejam úteis e compatíveis com os sites SimplyBook.me. Se você tentar algum, deixe-nos saber como ficou nos comentários.

Não se esqueça, se você tiver algum problema, entre em contato com nosso suporte por chat ao vivo. Eles conhecem suas coisas.