Documentação
Imprimir Página

Integre sua agenda em um iframe em sua página no Facebook

O tutorial abaixo explica como integrar o seu calendário SuperSaaS em um iframe em sua página no Facebook. O iframe permite aos usuários acessem a sua agenda sem sair de sua página do Facebook. Se você preferir integrar o calendário, adicionando um botão "Reservar", então, você pode seguir o tutorial para Adicionar um botão Agendar Agora.

O que você precisa para a integração?

  • Uma página de empresa do FACEBOOK
  • Uma assinatura SuperSaaS e conta segura SSL com pelo menos um calendário

Adicionar o seu calendário SuperSaaS em um iframe em sua página no Facebook

  1. Entre na sua página de empresa do Facebook

  2. Abra outra janela em seu navegador e vá para: apps.facebook.com/static_html_plus/

  3. Selecione Adicionar HTML estático para uma página

    Adicionar HTML estático
  4. Se você tiver várias páginas de empresa do Facebook, primeiro selecione a página que você deseja usar para integrar o calendário, clique em Adicionar HTML estático: aba iframe.

    Selecionar página
  5. A guia HTML estático não irá aparecer na sua página de empresa do Facebook.

  6. Para editar a aba HTML clique na guia configurações e escolha apps na coluna da direita.

    Editar configurações
  7. Selecione a guia iframe que você deseja editar e clique em editar configurações.

    Edit settings
  1. Agora você pode alterar o texto padrão Bem-Vindo por um texto de sua escolha, por exemplo Agendar Agora. Clique em Salvar e depois clique em OK.

Alterar Texto
  1. Repita o passo 7 novamente para mudar a imagem da estrela padrão. Desta vez, clique em "Alterar", próximo a Personalizar aba imagem:. Isso levará você para uma nova página onde você pode fazer upload de uma imagem. Passe o mouse na imagem da estrela e clique em "Editar".

Clique em alterar Clique em editar
  1. Um pop-up será aberta onde você pode selecionar uma imagem do seu computador, ela de ter 111 × 74 pixels.

    Você pode baixar e usar um dos exemplos abaixo (clique com botão direito e escolha 'salvar como') ou crie seu próprio botão.

Selecione uma imagem Botão 1 Botão 2 Botão 3
  1. Uma visualização da imagem aparece sem nenhuma opção para salvá-la. No entanto, quando você navegar de volta para sua página do Facebook usando a função de pesquisa, você vai encontrar a imagem na sua página do Facebook.

Visualizar e navegar de volta para sua página
  1. Agora que todos os estilos foram configurados, podemos integrar um iframe na página. Clique em seu recém-criado botão Agendar Agora! (A aba HTML estático). e clique na aba Editar. Alternativamente, você pode encontrar o botão entre seus aplicativos do lado esquerdo de sua página.

    Click on the new book now button
  2. Vá para a sessão Apps gratuitos e escolha o app Website para integração rápida (Também é possível trabalhar com o app HTML).

    Escolher website Copie e cole a URL do calendário
  3. Cole a URL do calendário na campo de URL da página externa; remover as barras de rolagem para dimensionar o calendário para caber na página e clique em Salvar & Publicar. Clique em Pré-visualizar aba para ver uma pré-visualização do seu website.

    Pré-visualizar Pré-visualizar
Para o iframe exibir corretamente em uma página de Facebook você precisará ativar o "SSL" na sua conta SuperSaaS. Você pode ligar o SSL dentro da sua conta SuperSaaS na página de Controle de Accesso . (Isso significa que o link para o seu calendário será alterado para começar com https ao invés de http)
Se você não quer mostrar o calendário em um iframe, onde ele fica restrito à largura de 800 pixels da página do Facebook, você poderia usar um botão ou um link para a cagenda ao em vez disso, para que a agneda seja exibida em sua próprio janela do browser. (Nesse caso, o SSL não é necessário.)

Usando um Leadgate para estimular os visitantes a dar um like na sua página no Facebook

Uma vez que você tiver integrado o seu calendário em sua página do Facebook, o aplicativo HTML estático oferece-lhe a oportunidade de criar uma leadgate. Se você ativar um Leadgate então as pessoas vão ser apresentadas com um pop-up que captura as suas informações antes de começar a ver o iframe com sua agenda.

  1. Quando você visualizar o app HTML estático no modo de administrador, clique na aba Editar. Agora clique em Leadgate.

    Ir para fangate
  2. Selecione Habilitar leadgate, coloque uma mensagem para seus visitantes e clique em Salvar & publicar.

    Coloque uma mensagem para o visitante Pré-Visualizar