Pular para o conteúdo principal
Como incorporar widgets no seu site

Como integrar o widget de reservas num site Squarespace

Última atualização Há 8 meses

Este artigo explica passo a passo como colocar o motor de reservas do TourOS a funcionar no seu website criado em Squarespace.

A integração permite que os seus clientes reservem e paguem diretamente no seu site, sem redirecionamentos. O processo é simples: copiar o código gerado no TourOS e colá-lo na sua página do Squarespace usando um bloco de código.


Obter o código no TourOS

O primeiro passo é gerar o código HTML específico da experiência que quer vender.

  1. Na barra de navegação principal, clique em Experiências e depois em Feed de experiências.

  2. Na lista apresentada, clique sobre a experiência pretendida para abrir a sua Vista Geral.

  3. No canto superior direito, mesmo ao lado do botão de editar, clique em Criar Widget.

  4. Irá abrir-se uma janela (modal) com um bloco de código HTML.

  5. Clique no botão Copiar código Embeb para o guardar na sua área de transferência.


Inserir o widget na página (Squarespace)

Agora vamos colocar o calendário de reservas no local exato onde quer que ele apareça no seu site.

  1. Aceda ao seu painel do Squarespace e abra a página onde quer colocar a reserva.

  2. Clique em Editar (Edit) no canto superior esquerdo da página.

  3. Passe o rato sobre a área onde quer inserir o widget e clique em Adicionar Bloco (Add Block).

  4. Na lista de elementos, procure e selecione Código (Code).

  5. Na janela de configuração do bloco de código que se abre, apague o texto padrão (<p>Hello, World!</p>) e cole o código HTML que copiou do TourOS.

  6. Certifique-se de que a opção "HTML" está selecionada no menu suspenso do bloco.

⚠️ Nota do Squarespace: Por questões de segurança, o Squarespace não executa o código enquanto está no modo de "Edição". Vai ver apenas uma caixa com um aviso de "Script Embebido". Para ver o widget a funcionar, terá de guardar a página e visualizá-la no modo normal.


Adicionar o script de suporte (Code Injection)

Para que o widget comunique perfeitamente com o TourOS (processando pagamentos e adaptando-se a dispositivos móveis), precisa de adicionar um script global nas definições do Squarespace.

  1. Volte ao menu principal (Home) do seu painel Squarespace.

  2. Navegue até Website > Ferramentas do Site (Website Tools) > Injeção de Código (Code Injection).

    • (Nota: Em versões mais antigas do Squarespace, este caminho pode ser Definições > Avançadas > Injeção de Código).

  3. Faça scroll para baixo até encontrar a secção Rodapé (Footer).

  4. Cole o seguinte código na caixa de texto do Rodapé:

  1. Clique em Guardar (Save) no canto superior esquerdo.


Finalizar

Tudo pronto! Aceda à versão pública do seu site e teste a página. O widget de reservas do TourOS deverá estar visível e pronto a aceitar clientes.