Pular para o conteúdo
Academy

Cards

Um cartão representa um único fornecedor (por exemplo, hotel ou fornecedor de experiências) ou inventário (por exemplo, tipo de quarto, sala de reuniões, spa, etc.) e expõe os detalhes através de uma interface de utilizador de cartão interativa e reservável. Um utilizador pode interagir com um cartão das seguintes formas:

  • Clique no Book botão.
  • Clique no Gallery link para ver todas as fotos e vídeos deste inventário.
  • Clique Best deal link, se disponível, para ver o quarto ao melhor preço.
  • Clique Hotel details link, se disponível, para ver informações sobre a propriedade.

Um cartão suporta múltiplas faces para minimizar o tamanho do cartão e categorizar os dados; tornando-o facilmente consumível pelo utilizador e dando-lhe uma maior hipótese de converter o utilizador numa reserva.

Uma carta tem duas ou três faces:

  • O cartão do hotel mostra os dados da propriedade na frente e o melhor tipo de quarto no verso. O preço, em ambos os lados, mostra o melhor preço para o hotel.
  • Um cartão de tipo de quarto mostra os dados do tipo de quarto na frente e os dados da propriedade no verso. O preço exibe o preço do tipo de quarto na frente e o melhor preço do hotel no verso.
  • Todas as outras cartas (por exemplo, spa, restaurante, etc.) têm 3 faces. Exemplo: os dados do spa são apresentados na página inicial com o melhor preço do spa. Os dados do tipo de quarto com o melhor preço estão no segundo lado. Os dados do imóvel, juntamente com o quarto com o melhor preço, estão na terceira face do cartão.
Prévia do cartão
Cartão tipo quarto de frente com disponibilidade

Acima está um exemplo do nosso cartão de tipo de quarto. Contém dados de propriedade, avaliações e quartos, bem como política de cancelamento e refeições.

O resto deste artigo explica como criar, personalizar e expor o cartão aos seus utilizadores.

Criar um cartão

Seção intitulada “Criar um cartão”
Ações
Ações de resultados de investigação

Acima está uma imagem tirada de Pesquisa e mostra algumas coisas que pode fazer com os resultados da sua pesquisa. Uma dessas ações é Make a card. Clique nesse botão e ele irá redirecioná-lo para a nossa página de formulário de cartão, onde poderá começar a personalizá-lo.

Personalizar cartão

Seção intitulada “Personalizar cartão”

O formulário permite personalizar o seu cartão das seguintes formas:

  1. Dê um nome para que se possa lembrar do que se trata o cartão.
  2. Selecione o Personalização que pretende aplicar a este cartão.
  3. Selecione a face inicial do cartão que pretende que os utilizadores vejam primeiro. Por defeito, é a face nativa deste inventário.
  4. Selecione o badge que pretende utilizar no cartão. Um emblema permite aos utilizadores comparar o inventário numa métrica agregada, como eco-friendly.
  5. Adicione palavras-chave, separadas por vírgula, que serão utilizadas por Rastreadores da Web.
  6. Adicione títulos e descrições nos idiomas que pretende que o utilizador veja.
  7. Selecione uma ou mais imagens que serão apresentadas quando os utilizadores clicarem nelas. Gallery ligação.
  8. Clique no Save botão para continuar.

Depois de guardar o seu cartão, será redirecionado para a sua página de cartões e o seu cartão estará pronto para ser partilhado com o mundo.

Cartão de partilha

Seção intitulada “Cartão de partilha”
Cartão
Cartão com menu de ações recolhido

Acima mostra uma imagem com todas as ações disponíveis para o seu cartão:

  • Atualização Atualiza a configuração do seu cartão.
  • Adicionar ao WinkLinks Adiciona o cartão à sua conta WinkLinks.
  • Incorporar Mostra como incorporar este cartão como um Cartão no seu site.
  • Usar com o WordPress Mostra como usar o nosso Plugin WordPress para incorporar este cartão no seu site.

Abordaremos algumas destas opções com mais detalhe abaixo.

Incorporar

Seção intitulada “Incorporar”
<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="GUEST_ROOM"
       id="2de7ee9c-61c9-11ef-9722-42004e494300"
    ></wink-content-loader>


    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>


    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="YOUR CUSTOMIZATION ID GOES HERE"
    ></wink-app-loader>
  </body>
</html>

Veja como incorporar o seu cartão no seu site:

  • A linha 3 mostra como incorporar os estilos Wink no seu website.
  • As linhas 6 a 9 mostram como utilizar o carregador de conteúdo intermitente Componente Web e diga-lhe para procurar um cartão de quarto de hóspedes para o seu código.
  • A linha 11 mostra como incorporar o nosso Javascript no seu site.
  • A linha 13 mostra como incorporar o carregador de aplicações wink Componente Web e peça-lhe para procurar as suas preferências de configuração ao nível da página.

API

Seção intitulada “API”

Os programadores que desejam gerir cartões podem aceder Programadores > API > Inventário.

Leitura adicional

Seção intitulada “Leitura adicional”