Adicione reservas e chat ao seu próprio site

Já tem um site no WordPress, Squarespace, Wix ou em qualquer outra plataforma? Adicione um script curto e seu fluxo de reserva abre direto sobre suas próprias páginas. Os clientes agendam sem sair do seu site. Um segundo script adiciona seu botão de Live Chat.

Adicione o widget de reservas

1. 1

   Etapa 1 de 3

   Adicione o script

   Cole isto antes da tag body de fechamento do seu site, usando seu próprio endereço principal:

   <script src="https://hairhaven.onsoftalon.com/embeds/booking.js"></script>
   

   Use seu domínio principal no endereço do script. Seus outros endereços redirecionam para o principal, e o widget só escuta o endereço de onde foi carregado, então uma diferença impede que ele feche e informe os agendamentos corretamente.

2. 2

   Etapa 2 de 3

   Adicione um botão

   Dê a qualquer botão ou link a classe softalon-booking-trigger:

   <button class="softalon-booking-trigger">Book Now</button>
   

   Você também pode usar o atributo data-softalon-booking-trigger ou o id softalon-booking-trigger.

3. 3

   Etapa 3 de 3

   Teste

   Publique sua página e clique no botão.

   Você verá:

   Seu fluxo de reserva desliza a partir da lateral direita da página. Nos celulares, ele ocupa a tela inteira.

Pré-selecione um local, serviço ou membro da equipe

Adicione estes atributos a um botão para pular etapas no fluxo de reserva:

<button class="softalon-booking-trigger" data-service-id="SERVICE_ID">
    Book a haircut
</button>

Para encontrar um ID, abra a opção de compartilhamento desse serviço, local ou membro da equipe no Softalon e copie o link de reserva completo. Os IDs ficam no link depois de serviceId=, locationId= e memberId=. Consulte Compartilhe seu link de reserva.

Escolha como ele abre

Defina isso por botão com data-variant, ou para a página inteira com data-variant na tag do script:

<script src="https://hairhaven.onsoftalon.com/embeds/booking.js" data-variant="dialog"></script>

Os clientes podem fechar o widget com a tecla Esc. Com sheet, clicar no fundo escuro também o fecha.

Controle-o com JavaScript

Se você escreve seu próprio código, o script adiciona window.$softalon.booking:

window.$softalon.booking.init({
    variant: "sheet",
    params: { locationId: "LOCATION_ID", serviceId: "SERVICE_ID" },
});

window.$softalon.booking.onCompleted(function (data) {
    // The client finished booking
});

window.$softalon.booking.open();

Adicione o Live Chat

Se seu plano inclui o assistente de IA e o Live Chat está ativado, adicione o script do chat para mostrar um botão de chat no canto do seu site:

<script src="https://hairhaven.onsoftalon.com/embeds/chat.js"></script>

• Para colocar o botão à esquerda, adicione data-position="left" à tag do script.
• Para abrir o chat pelo seu próprio botão, dê a ele a classe softalon-chat-trigger ou o atributo data-softalon-chat-trigger.

Se o Live Chat estiver desativado, ou se seu plano não o incluir, o script do chat não mostra nada. Consulte Ative o Live Chat no seu site de reservas.

O script do chat também adiciona window.$softalon.chat, com open(), close(), isOpen(), hide(), show(), onSessionStarted(callback) e onMessageReceived(callback).