+- WuBook Community Forum (https://wubook.net/forum)
+-- Forum: WuBook Suite (https://wubook.net/forum/forumdisplay.php?fid=1)
+--- Forum: Supporto sul Booking Engine (https://wubook.net/forum/forumdisplay.php?fid=2)
+--- Discussione: Layout orizzontale del Booking Engine (/showthread.php?tid=756)
Layout orizzontale del Booking Engine - GL029 - 12-17-2015
Salve a tutti! Nella procedura guidata x la creazione del widget del booking engine non esiste la possibilità di crearlo in orizzontale piuttosto che in verticale. E' possibile inserire questa opzione? Se non è possibile, come posso impostare il BE in orizzontale?
Grazie
RE: Layout orizzontale del Booking Engine - rose - 12-17-2015
Salve,
ho visto il ticket e credo di averle risposto con il tecnico in copia, ha visto?
Al momento, non facciamo questo tipo di personalizzazioni, per questo Luca, il responsabile del Booking engine, le invierà una documentazione utile da girare al suo webmaster per implementare la modifica e realizzarle il widget che più le piace.
Tenga conto però che ho chiesto tempo fa a Luca e alla sua squadra la possibilità di fornirvi trai modelli standard sia un widget verticale (modello attuale) che un prototipo orizzontale in modo che possiate scegliere quello che più modelli. Per ora non è ancora pronto perché i tecnici stanno lavorando su più fronti, ma entro breve avrete più scelte possibili per le vostre personalizzazioni. Promesso!
Buon lavoro
Rose (Genni)
RE: Layout orizzontale del Booking Engine - amber - 12-18-2015
Buongiorno a tutti,
nella procedura guidata non è possibile creare il widget orizzontale, poichè per sistemarlo in orizzontale spesso bisogna intervenire su regole e parti di codice della pagina che ospita il widget.
Comunque si può intervenire sullo stile del widget al momento della generazione, fornendo delle regole css che servano allo scopo, come riportato nella documentazione:
http://tdocs.wubook.net/ord/jslib.html#the-wubook-object
(sezione WuBook.design_widget())
A titolo esemplificativo ho creato il codice per mettere in orizzontale il widget.
Bisogna avere l'accortezza di inserire nel css principale del proprio sito web le seguenti regole:
#_wbord_ {
width: 100% !important;
text-align: left !important;
}
#_wbord_ a{
text-align: center;
}
#__wbframe___wbord_ {
width: 100% !important;
}
una volta generato il widget bisogna aggiungere le regole css nella chiave "css" delle opzioni che vengono passate al metodo che lo genera. Come da esempio riportato qui sotto (notare che ho usato lcode della struttura di test: prima va sostituito il proprio)
<script src="https://wubook.net/js/wblib.jgz"></script>
<!--
put the following div where WuBook
should be designed. Make sure to
preserve the div contents (backlink)
-->
<div id="_wbord_">
<a href="https://wubook.net/services/booking-engine/" style="display: block; margin-top: 5px; text-decoration:none;border:none" target="_blank">
<img src="https://wubook.net/imgs/default/booking_by_wu.gif" alt="Sistema di booking by Wubook" title="Soluzioni per la gestione Hotel" style="border:none;text-decoration:none" />
</a>
</div>
<script>
var WuBook= new _WuBook(1213394817);
var wbparams= {
lang: '',
dates: 1,
nights: 0,
layout: '',
bgcolor: '#e7F2e7',
failback_lang: 'en',
wbgoogle: 1,
bids: 0,
cards: 0,
width: 200,
cancel: 0,
textcolor: '#003d18',
bestprice: 0,
email: 0,
// adding custom css
css: ".wb-header {display:none;} .wb-block {text-align: left; width:700px; float:none!important; margin: 0 auto;} .wb-content_block{background:none; border-radius: 0;padding:10px; padding-top:2px;} .wb-row{width:31%;float:left} .wb-row input.wb-calendar {width:88%;} .wb-row label {margin-bottom: 3px;color: #B26A2E;font-weight:bold;} .wb-button {float:left; margin-top:16px} .wb-button .wb-submit {padding-left:12px; padding-right:12px; height: 30px; font-size:13px; text-transform: uppercase;}"
};
WuBook.design_widget("_wbord_", wbparams);
</script>
<!--
that's all :)
Thank you for using WuBook!
-->
Spero possa esservi utili e da spunto per i vostri lavori.
Ciao a tutti
(12-17-2015, 04:27 PM)rose Ha scritto: Salve,
ho visto il ticket e credo di averle risposto con il tecnico in copia, ha visto?
Al momento, non facciamo questo tipo di personalizzazioni, per questo Luca, il responsabile del Booking engine, le invierà una documentazione utile da girare al suo webmaster per implementare la modifica e realizzarle il widget che più le piace.
Tenga conto però che ho chiesto tempo fa a Luca e alla sua squadra la possibilità di fornirvi trai modelli standard sia un widget verticale (modello attuale) che un prototipo orizzontale in modo che possiate scegliere quello che più modelli. Per ora non è ancora pronto perché i tecnici stanno lavorando su più fronti, ma entro breve avrete più scelte possibili per le vostre personalizzazioni. Promesso!
Buon lavoro
Rose (Genni)
RE: Layout orizzontale del Booking Engine - AB217 - 12-24-2015
Buongiorno,
ho notato che non tutti i browser purtroppo riescono a visualizzare correttamente la versione orizzontale. Con Windows Explorer o Edge il campo Partenze viene visualizzato sotto il campo Arrivi creando una "doppia riga". Con firefox o chrome invece viene tutto visualizzato correttamente in orizzontale.
Si riesce a fare qualcosa!?
Grazie
RE: Layout orizzontale del Booking Engine - amber - 12-28-2015
Salve,
grazie della segnalazione, faccio qualche test e tento un fix, da incollare qui.
Buon lavoro
(12-24-2015, 06:14 AM)AB217 Ha scritto: Buongiorno,
ho notato che non tutti i browser purtroppo riescono a visualizzare correttamente la versione orizzontale. Con Windows Explorer o Edge il campo Partenze viene visualizzato sotto il campo Arrivi creando una "doppia riga". Con firefox o chrome invece viene tutto visualizzato correttamente in orizzontale.
Si riesce a fare qualcosa!?
Grazie
RE: Layout orizzontale del Booking Engine - amber - 12-28-2015
Allora, penso di aver risolto, provi a sostituire il vecchio codice con questo:
<script src="https://wubook.net/js/wblib.jgz"></script>
<!--
put the following div where WuBook
should be designed. Make sure to
preserve the div contents (backlink)
-->
<div id="_wbord_">
<a href="https://wubook.net/services/booking-engine/" style="display: block; margin-top: 5px; text-decoration:none;border:none" target="_blank">
<img src="https://wubook.net/imgs/default/booking_by_wu.gif" alt="Sistema di booking by Wubook" title="Soluzioni per la gestione Hotel" style="border:none;text-decoration:none" />
</a>
</div>
<script>
var WuBook= new _WuBook(1213394817);
var wbparams= {
lang: '',
dates: 1,
nights: 0,
layout: '',
bgcolor: '#e7F2e7',
failback_lang: 'en',
wbgoogle: 1,
bids: 0,
cards: 0,
width: 200,
cancel: 0,
textcolor: '#003d18',
bestprice: 0,
email: 0,
// adding custom css
css: ".wb-header {display:none;} .wb-block {text-align: left; width:700px; float:none!important; margin: 0 auto;} .wb-content_block{background:none; border-radius: 0;padding:10px; padding-top:2px;} .wb-row{width:31%;float:left;clear:none} .wb-row input.wb-calendar {width:88%;} .wb-row label {margin-bottom: 3px;color: #B26A2E;font-weight:bold;} .wb-button {float:left; margin-top:16px} .wb-button .wb-submit {padding-left:12px; padding-right:12px; height: 30px; font-size:13px; text-transform: uppercase;}"
};
WuBook.design_widget("_wbord_", wbparams);
</script>
<!--
that's all Smile
Thank you for using WuBook!
-->
Ora dovrebbe vedersi correttamente anche si IE!
Saluti
(12-28-2015, 12:43 PM)amber Ha scritto: Salve,
grazie della segnalazione, faccio qualche test e tento un fix, da incollare qui.
Buon lavoro
(12-24-2015, 06:14 AM)AB217 Ha scritto: Buongiorno,
ho notato che non tutti i browser purtroppo riescono a visualizzare correttamente la versione orizzontale. Con Windows Explorer o Edge il campo Partenze viene visualizzato sotto il campo Arrivi creando una "doppia riga". Con firefox o chrome invece viene tutto visualizzato correttamente in orizzontale.
Si riesce a fare qualcosa!?
Grazie