Hoje, vamos ver como você pode guiar seus usuários ao lugar certo na sua agenda SuperSaaS com o menor número possível de passos. Dominar isso ajuda a simplificar seu processo de reservas e a reduzir o tempo que o cliente passa navegando pela sua agenda.
Quando você começa a usar SuperSaaS para simplificar seu processo de reservas, seus clientes podem precisar de alguma orientação sobre como navegar melhor pela sua agenda. Embora seja certamente conveniente simplesmente enviar um link para sua agenda, alguns clientes podem ter dificuldade para encontrar a classe, o recurso ou o serviço exato de que precisam. Para garantir que seus clientes encontrem sem esforço o horário ou a data perfeitos, talvez seja melhor fornecer um “deep link” que pré-selecione a classe, o recurso ou o serviço certo para eles.
Como, você pergunta? Vamos compartilhar algumas formas abaixo.
1. Direcione os usuários para uma classe, recurso ou serviço específico
Por padrão, uma agenda SuperSaaS abre na primeira disponibilidade da sua agenda. No entanto, você pode enviar clientes para um mês, semana ou dia específico modificando o link da sua agenda. Dependendo do tipo de agenda, os passos podem parecer um pouco diferentes.
Agenda de capacidade: adicione o ID do slot ao seu link
Se você quiser vincular diretamente a uma classe específica ou slot na sua agenda de capacidade, pode fazer isso adicionando o ID do slot ao seu link. Para encontrar o ID do slot, vá ao painel do administrador e clique em Supervise ao lado do nome da sua agenda.
Depois que a página carregar, clique no ícone da lupa ao lado da classe para a qual você quer criar o link. A página que se abre mostra o deep link diretamente para o slot, com o ID do slot no final.
Por exemplo, na nossa demonstração do workshop de Cupcake, o slot chamado “Cupcake Mania” tem este link:
supersaas.com/schedule/demonstracao/Cupcake_Workshop/12320083
Agenda de recurso ou serviço: adicione o nome do recurso ou serviço ao seu link
Para direcionar usuários a um recurso ou serviço específico na sua agenda, basta adicionar o nome do seu recurso ao final do link da sua agenda. Lembre-se de que, se o nome do recurso normalmente contiver espaços, eles serão substituídos por sublinhados (“_”) no seu link.
Para a nossa demonstração de salas de reunião, isso resultaria no seguinte link:
supersaas.com/schedule/demonstracao/Meeting_Rooms/Meeting_Room_1
Se você usar uma agenda de serviço, pode seguir o mesmo padrão e adicionar o título de um serviço específico ao final do link da sua agenda. A mesma regra se aplica quando o nome do serviço contiver espaços; basta substituí-los por sublinhados. O link completo para o serviço “Long treatment” na nossa demonstração de Therapist seria:
supersaas.com/schedule/demonstracao/Therapist_2/Long_treatment
2. Adicione extensões de URL para mostrar páginas ou classes específicas da agenda
Direcionando usuários para uma data específica
Adicionar ?day=X&month=X ao final da sua URL e substituir o X pelo dia/mês desejado levará o usuário diretamente para essa data. Por exemplo, se você adicionar ?day=25&month=12, seu usuário será direcionado para o dia de Natal. Outras extensões são ?year=X e ?week=X. Você pode usar essas opções separadamente ou combinadas.
Lembre-se de que, quando você combina essas extensões de URL, precisará substituir cada ponto de interrogação seguinte por um e comercial (“&”). Por exemplo, este link abriria um calendário no dia de Natal:
supersaas.com/schedule/demonstracao/Meeting_Rooms?month=12&day=24
Agenda de capacidade: direcionando usuários para classes com uma cor específica
Se você usar uma agenda de capacidade, também pode usar uma extensão de URL para exibir slots de uma cor específica.
Por exemplo, você pode dar a todas as aulas para iniciantes a cor verde e a todas as aulas avançadas a cor vermelha.
Para fazer isso, adicione ?color=X ao final da URL da sua agenda.
O X pode ser substituído pelo número da cor que você escolheu para o slot. Esses números são atribuídos com base na ordem do menu de seleção de cores, então azul é 0, vermelho é 1, etc.
supersaas.com/schedule/demonstracao/Fitness_Club?color=0
Este link carregará sua agenda, mas apenas com os slots que têm a cor especificada na sua URL. Você também pode combinar essa extensão de URL com outras para refinar exatamente quais slots seu usuário verá.
Para ler mais sobre extensões de URL e descobrir quais outras opções são possíveis, por favor clique aqui.
3. Filtre por recurso com uma chave de cores ou menu suspenso
Se você tiver uma agenda de recursos e não quiser usar extensões de URL, mas quiser facilitar para que seus usuários reservem um horário com o recurso certo, talvez queira permitir que eles filtrem os recursos disponíveis.
Há duas maneiras de apresentar seus recursos na agenda. Você pode usar um menu suspenso:
Ou pode oferecer uma chave de cores:
A cor da chave de cores combina com a cor do recurso em toda a agenda e, como resultado, com os compromissos que já foram reservados para esse recurso. Para filtrar os compromissos na agenda, os usuários clicam em um dos botões para ver apenas os compromissos com o recurso correspondente.
4. Use um widget integrado para mais possibilidades
Talvez você tenha percebido em nossos artigos anteriores que temos muito orgulho da nossa integração com widget. E com razão! Você também pode integrar nosso widget ao seu site, para que seus clientes tenham uma experiência de reserva sem fricção e sem sair do seu site. Mas, se isso ainda não for totalmente suficiente, você também pode pré-selecionar certas classes, recursos ou serviços para serem exibidos no widget, para que os clientes não se registrem acidentalmente em outra classe, recurso ou serviço na sua agenda. Essa opção exige algum conhecimento técnico, já que você adicionará um pouco de texto ao trecho de JavaScript que gera o widget; no entanto, certamente é algo possível mesmo que você nunca tenha trabalhado com JavaScript antes.
Para encontrar o trecho do widget para cada uma das suas agendas SuperSaaS, visite nossa página de integração do widget. Nesta página você também pode configurar a aparência geral do seu widget.
Com as instruções abaixo, você pode pré-selecionar classes, recursos ou serviços que deseja exibir (e tornar reserváveis) no seu widget. Outras classes, recursos e serviços não ficarão visíveis quando seus usuários visualizarem o widget pela primeira vez.
Agenda de capacidade: pré-selecione uma classe ou workshop
Se você tiver vários workshops em uma agenda de capacidade e quiser que um widget destaque um específico, encontre o ID do slot na página Supervise clicando no ícone da lupa do slot desejado. Copie o ID do slot e adicione-o ao seu trecho de código como select:slotID. Inclua também view: "free" no trecho de código para garantir que o widget abra esse slot.
Para a nossa demonstração do workshop de Cupcake, o trecho padrão de código é:
<script class="supersaas-widget">var supersaas = new SuperSaaS("demo", "Cupcake_Workshop", {"widget_type": "frame", "menu": "show"})</script>
O trecho que abre um slot selecionado seria, em vez disso:
<script class="supersaas-widget"> var supersaas = new SuperSaaS("demo", "Cupcake_Workshop", {"widget_type": "frame", "view": "free", select:12320083}) </script>
Agenda de recurso: pré-selecione um recurso
No trecho do widget para uma agenda de recursos, você pode passar o nome do recurso para pré-selecionar esse recurso específico. Com essa adição, os usuários verão apenas a disponibilidade do recurso escolhido. No entanto, ainda poderão trocar o recurso ao finalizar a reserva.
O trecho padrão de código seria:
<script class="supersaas-widget">var supersaas = new SuperSaaS("demo", "Meeting_Rooms", {"widget_type": "frame", "menu": "show"})</script>
Para ver apenas a disponibilidade da Meeting room 1, seu trecho de código ficaria mais ou menos assim:
<script class="supersaas-widget">var supersaas = new SuperSaaS("demo", "Meeting_Rooms", {"widget_type": "frame", "menu": "show", select:"Meeting Room 1"})</script>
Agenda de serviço: pré-selecione um serviço
Para uma agenda de serviço, a alteração no trecho se parece bastante com a da agenda de recursos. Você adicionaria select: e o nome do serviço que deseja pré-selecionar. O usuário ainda pode alternar entre serviços com o seletor.
O trecho padrão de código para a nossa demonstração de Therapist é:
<script class="supersaas-widget">var supersaas = new SuperSaaS("demo", "Therapist_2", {"widget_type": "frame", "menu": "show"})</script>
Se você quiser pré-selecionar especificamente o serviço “Long treatment”, usaria:
<script class="supersaas-widget">var supersaas = new SuperSaaS("demo", "Therapist_2",{"widget_type": "frame", "menu": "show", select:"Long treatment"})</script>
Se você quiser adicionar vários widgets com classes/recursos/serviços diferentes na sua página, certamente pode fazer isso. Você pode, por exemplo, adicionar também diferentes versões do widget em várias páginas do seu site.
Saiba mais sobre configurações em JavaScript na nossa documentação do widget para desenvolvedores. Se você tiver outras dúvidas, nossa equipe de suporte está aqui para ajudar.