Cards
Una targeta representa un únic proveïdor (per exemple, un hotel o un proveïdor d’experiències) o inventari (és a dir, un tipus d’habitació, una sala de reunions, un spa, etc.) i exposa els detalls a través d’una interfície d’usuari de targeta interactiva i que es pot reservar. Un usuari pot interactuar amb una targeta de les maneres següents:
- Feu clic a
Book
botó. - Feu clic a
Gallery
enllaç per veure totes les fotos i vídeos d’aquest inventari. - Feu clic
Best deal
enllaç, si està disponible, per veure l’habitació amb el millor preu. - Feu clic
Hotel details
enllaç, si n’hi ha, per veure la informació de la propietat.
Una targeta admet múltiples cares per minimitzar la mida de la targeta i categoritzar les dades; fent-la fàcilment consumible per l’usuari i donant una major possibilitat de convertir l’usuari en una reserva.
Una carta té dues o tres cares:
- Una targeta d’hotel mostra les dades de la propietat a la part frontal i el millor tipus d’habitació al revers. El preu, a banda i banda, mostra el millor preu de l’hotel.
- Una targeta de tipus d’habitació mostra les dades del tipus d’habitació a la part frontal i les dades de la propietat a la part posterior. El preu mostra el preu del tipus d’habitació a la part frontal i el millor preu de l’hotel a la part posterior.
- Totes les altres targetes (per exemple, restaurant de spa, etc.) tenen 3 cares. Exemple: les dades del spa es mostren a la pàgina principal amb el millor preu del spa. Les dades del tipus d’habitació per a l’habitació amb el millor preu es troben a la segona cara. Les dades de la propietat juntament amb l’habitació amb el millor preu es troben a la tercera cara de la targeta.
A dalt hi ha un exemple de la nostra targeta de tipus d’habitació. Conté la propietat, la ressenya i les dades de l’habitació, juntament amb la política de cancel·lació i els àpats.
La resta d’aquest article us guiarà sobre com crear, personalitzar i exposar la targeta als vostres usuaris.
Crea una targeta
Section titled “Crea una targeta”A dalt hi ha una imatge extreta deCercai et mostra algunes de les coses que pots fer amb els resultats de la cerca. Una d’aquestes accions ésMake a card
Feu clic en aquest botó i us redirigirà a la nostra pàgina de formulari de targeta, on podreu començar a personalitzar la vostra targeta.
Personalitza la targeta
Section titled “Personalitza la targeta”El formulari et permet personalitzar la teva targeta de les maneres següents:
- Posa-li un nom per recordar de què tracta la targeta.
- Seleccioneu el Personalització vols sol·licitar aquesta targeta.
- Seleccioneu la cara inicial de la carta que voleu que els usuaris vegin primer. Per defecte, és la cara original d’aquest inventari.
- Seleccioneu el badge que voleu utilitzar a la targeta. Una insígnia permet als usuaris comparar l’inventari en una mètrica agregada com ara
eco-friendly
. - Afegiu paraules clau, separades per una coma, que seran utilitzades per Rastrejadors web.
- Afegiu títols i descripcions en els idiomes que voleu que l’usuari vegi.
- Seleccioneu una o més imatges que es mostraran quan els usuaris facin clic a
Gallery
enllaç. - Feu clic a
Save
botó per continuar.
Després de desar la targeta, se us redirigirà a la pàgina de les vostres targetes i ja la podeu compartir amb el món.
Targeta per compartir
Section titled “Targeta per compartir”A dalt es mostra una imatge amb totes les accions disponibles per a la teva targeta:
- ActualitzacióActualitza la configuració de la targeta.
- Afegeix a WinkLinksAfegeix la targeta al teu compte de WinkLinks.
- IncrustarEt mostra com incrustar aquesta targeta com aTargetaal vostre lloc web.
- Utilitzar amb WordPressEt mostra com utilitzar el nostreComplement de WordPressper incrustar aquesta targeta al vostre lloc web.
A continuació, tractem algunes d’aquestes opcions amb més detall.
Incrustar
Section titled “Incrustar”<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>
A continuació s’explica com s’insereix la targeta al lloc web:
- La línia 3 us mostra com integrar els estils Wink al vostre lloc web.
- Les línies 6 a 9 us mostren com utilitzar-lescarregador de contingut winkComponent web i digueu-li que busqui una targeta d’habitació per al vostre codi.
- La línia 11 us mostra com integrar el nostre Javascript al vostre lloc web.
- La línia 13 mostra com incrustar elcarregador d’aplicacions winkComponent web i indica-li que obtingui les teves preferències de configuració a nivell de pàgina.
Els desenvolupadors que vulguin gestionar targetes poden anar aDesenvolupadors > API > Inventari.
Lectures addicionals
Section titled “Lectures addicionals”- Més informació sobre la nostra col·lecció deComponents web.
- Més informació sobre el/la/els/lesComplement Wink per a WordPress.