Istruzioni web

 

Puoi usare il link al widget di prenotazione di Thefork perchè si apra in una nuova scheda del browser, quando clicchi su un testo o pulsante. Installazione facile. Funziona su tutti i tipi di dispositivi, desktop, tablet, smartphone, ecc.

Se vuoi che l'internauta rimanga sul tuo sito, puoi anche mettere il widget all'interno di una finestra utilizzando un iframe.

Di seguito, ti spieghiamo come generare il tuo codice da incollare nel tuo sito.

 

In una nuova scheda, tramite un link in un bottone

 

Cambia il testo per un bottone:

<a href=" LINK DEL WIDGET "><img src="/imagen.png"></a>

Incolla il codice risultante nel tuo sito.

ESEMPIO:
<a href="https://module.lafourchette.com/it_IT/module/263821-13c83"><img src="https://static.myfourchette.com/uploads/email_campaign/56567_new_GB.png"></a>

 

VISUALIZZALO QUI

 

 
 

Incorporato al tuo sito tramite il link dentro un iframe

 

Usa il codice seguente:

<iframe src=" LINK DEL WIDGET " style="width: 100%; min-height:800px; border:none; overflow:scroll;"></iframe>

EXAMPLE:
<iframe src="https://module.lafourchette.com/it_IT/module/263821-13c83" style=" width: 100%; min-height:800px; border:none; overflow:scroll;"></iframe>

 

VISUALIZZALO QUI

 

 

Link all'interno di un iframe utilizzando media queries

Come fare perchè il tuo widget si adatti automaticamente alle dimensioni dei diversi display esistenti. Il nostro modulo ha una altezza dinamica, il chè significa che questa cambia durante il processo di prenotazione.

 

screenshot

Widget durante il processo di prenotazione

 

 

Per evitare di avere un’altezza fissa permanente e quindi la comparsa di barre di scorrimento (scroll bar), utilizziamo media queries per adattare il widget a tutte le dimensioni dei display esistenti.

Utilizza un id nell’iframe:

<iframe class="thefork" src="https://module.lafourchette.com/it_IT/module/56567-a3fd1"></iframe>

 

Incolla prima del tag </head> i seguenti stili:

<style type="text/css">

.thefork{
width: 100%;
border:none;
overflow: scroll;
}
/* Media queries widget */ 
@media only screen and (max-width : 320px) { 
    .thefork{
    min-height: 840px;
    }
}
@media only screen and (min-width : 321px) and (max-width : 516px){
    .thefork{
    min-height: 650px; 
    }
}
@media only screen and (min-width : 517px) { 
    .thefork{
    min-height: 550px; 
    }
}
</style>

 

Da questo momento la altezza del widget (iframe) cambierà in funzione della larghezza del display e del blocco html che lo contiene. Nella tabella seguente ti indichiamo la relazione tra le dimensioni:

 

Larghezza del display Altezza widgett Larghezza widget
Fino a 320px 840px 100%
Da 321 to 516px 650px 100%
Da 517px 550px 100%