Componente botão flutuante
Como cadastrar os Botões flutuantes
Chat Vendedor Online e o Chat da Mondiale
- Antes de começarmos, atenção para as regras muito importantes!- O "Botão flutuante" funciona em qualquer tipo de página.- Foi realizado a inclusão de mais uma opção no componente "Botão flutuante" com limite de 2 Chats cadastrados na aba de settings da página.- Componente muito versátil e aceita todos os tipos de links: Interno, Externo, Modal texto, Modal multimidia, Modal de imagem, Modal drawer, Click to call e Modal Disponibilidade.Passo a passo para cadastrar "Botão flutuante" com um link:Vá na Página, encontre a aba "Settings" e clique no "Botão flutuante" para criar:Agora, vamos adicionar Label, Selecionar se vai querer sem a Notificação ou seleciona Número ou Sino, Cadastrar Ícone ou Brand, Se usar ícone da para escolher a cor Vermelha ou Cinza, no Botão você pode selecionar qualquer tipo de link.Passo a passo para cadastrar "Botão flutuante" com vários links:Vá na Página, encontre a aba "Settings" e clique no "Botão flutuante" para criar:Agora, vamos adicionar os canais de venda. Vamos usar a opção 'Crie Links'. O nosso objetivo é cadastrar as três opções.Primeiro, o 'Continuar por aqui'. Adicione o texto e configure um link interno ou externo para o carrinho, por exemplo.Em seguida, o 'Pelo WhatsApp'. Aqui, você pode usar um link externo para a API do WhatsApp.E por último, o 'Televendas'. Para este, o ideal é usar o tipo de link 'Click to call' e inserir o número 0800.Passo a passo para cadastrar "Botão flutuante" de televendas com click to call:Vá na Página, encontre a aba "Settings" e clique no "Botão flutuante" para criar:Agora, vamos adicionar Label, Selecionar se vai querer sem a Notificação ou seleciona Número ou Sino, Cadastrar Ícone ou Brand, Se usar ícone da para escolher a cor Vermelha ou Cinza, no Botão você seleciona o Click to call, Salvar e publicar a página e validar se funciona normalmente, quando o usuário clica no botão no desktop deve exibir o modal e no mobile abre o discador padrão.
- Navegar em:1- Conteúdo > Conteúdos Compartilhados > Links > Clicar em +Item e inserir o nome do arquivo, criando um link normal e inserindo o link mondrian.2- Depois entrar em: Conteúdo > Conteúdos Compartilhados > Link Variante > Item > Criar um novo item.3- Inserir o link variante criado anteriormente na lista: Conteúdos Compartilhados > Link Variante > Listas- O link variante tem o objetivo de elencar em percentuais quais dos links seja mais relevante no momento do clique do usuário no componente vendedor online, aqui daremos um nome para identificação para esse link, depois disso é só buscar no campo Link* o nome dado no seu link normal criado anteriormente, inserir o Peso de %, e depois é só escolher o dispositivo desejado "Desktop ou Mobile", após isso vamos colocar o link variante em uma lista.- Depois desse processo é só inserir o componente Botão flutuante na aba "Configuração" dentro da página desejada.*
- 1 - Na página onde deseja inserir o seu Script, clicar no menu "Scripts", "lembrando que esse menu fica ao lado direito onde ficam os blocos de componentes a serem adicionados"
2 - Clicar em "Adicionar bloco"
3 - Será aberto a opção "Script", clicar nele
4 - Serão exibidos os campos para preenchimento: "Descrição", "Local da inserção", "Atributos", "URL", "Arquivo" e "Código do Script".
5 - Caso o script de terceiros venha encapsulado como por exemplo este aqui:
<script src="https://chat.mundiale.com.br/app/lib.js" type="text/javascript"></script> <script src="https://chat.mundiale.com.br/app/snippet.js" type="text/javascript"></script>
Para este caso temos que cadastrar 2 blocos de Scripts como mencionado acima e inserir no campo URL da seguinte maneira seguindo o script acima:
A - no 1o bloco de Script no campo de URL, inserir assim: "https://chat.mundiale.com.br/app/lib.js"
B - no 2o bloco de Script no campo de URL, inserir assim: "https://chat.mundiale.com.br/app/snippet.js"
6 - Caso o seu script não venha encapsulado, temos que cadastrá-lo no campo "Código do Script", apenas sendo necessário somente um bloco de Script para funcionar>Salvar>Publicar
OBS: Veja nesta própria página de tutorial como foi cadastrado, acesse o menu Scripts! a página está gravada com o nome: "Tutorial Chat" e está no caminho: site/paginas-teste-automatizado/tutorial-chat - FAVOR NÃO EDITAR ESTA PÁGINA.