Saltar al contingut
Academy

Maps

Un mapa 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.) o una col·lecció d’inventari, com ara una llista seleccionada o una cerca desada, i exposa aquests detalls a través d’un mapa interactiu que conté marcadors de mapa que es poden reservar. Un usuari pot interactuar amb un mapa de les maneres següents:

Mapa amb marcadors
Mapa amb marcadors de mapa
  • Zoom, desplaça’t i arrossega el mapa per veure l’inventari disponible.
  • Feu clic en un marcador del mapa per veure els detalls de l’inventari en forma deTargeta.
Mapa amb la targeta oberta
Mapa amb inventari reservable

La resta d’aquest article us guiarà sobre com crear, personalitzar i compartir els vostres mapes.

Crea un mapa

Section titled “Crea un mapa”

Els mapes es poden crear de dues maneres:

  • Mapa amb un sol marcador: Crea un mapa a partir d’alguna cosa que hagis trobat mentrebuscant.
  • Mapa amb diversos marcadors: Crea un mapa a partir d’unllista curadaocerca desada.

Mapa amb un sol marcador

Section titled “Mapa amb un sol marcador”
Accions
Accions dels resultats de la cerca

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 mapFeu clic en aquest botó i us redirigirà a la nostra pàgina de formulari de mapa, on podreu començar a personalitzar el vostre mapa.

Mapa amb diversos marcadors

Section titled “Mapa amb diversos marcadors”

Tots dosllistes seleccionadesicerques desadesvénen amb una acció que et permet crear un mapa. Aquest mapa contindrà marcadors de mapa per a tot l’inventari dins d’aquestes llistes.

Personalitza el mapa

Section titled “Personalitza el mapa”

El formulari us permet personalitzar el mapa de les maneres següents:

  1. Posa-li un nom per recordar de què tracta el mapa.
  2. Trieu si voleu que l’usuari pugui moure’s pel mapa.
  3. Defineix l’alçada que vols que tingui el mapa en píxels.
  4. Trieu si voleu que l’usuari pugui ampliar o reduir el mapa.
  5. Trieu un estil de mapa que s’adapti al lloc web on l’inserireu.
  6. Trieu un color de retolador.
  7. Seleccioneu la cara inicial de la carta que voleu que els usuaris vegin primer. Per defecte, és la cara original d’aquest inventari.
  8. Podeu afegir els vostres propis marcadors, cercles, rectangles i polígons per indicar altres ubicacions del mapa que els vostres usuaris puguin trobar interessants.
  9. Feu clic a Save botó per continuar.

Després de desar el mapa, se us redirigirà a la pàgina de mapes i el mapa ja està a punt per compartir-lo amb el món.

Comparteix el mapa

Section titled “Comparteix el mapa”
Mapa
Una entrada de mapa amb un menú d’accions reduït

A dalt es mostra una imatge amb totes les accions disponibles per al mapa:

  • ActualitzacióActualitza la configuració del mapa.
  • Afegeix a WinkLinksAfegeix el mapa al teu compte de WinkLinks.
  • IncrustarMostra com incrustar aquest mapa com aMapaal vostre lloc web.
  • Utilitzar amb WordPressEt mostra com utilitzar el nostreComplement de WordPressper integrar aquest mapa 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="MAP"
       id="64d7cbc8-61df-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 el mapa 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 un bàner publicitari 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.

API

Section titled “API”

Els desenvolupadors que vulguin gestionar mapes poden anar aDesenvolupadors > API > Inventari.

Lectures addicionals

Section titled “Lectures addicionals”