Form personalizzato in bootstrap da integrare nel tema wordpress

otto9due

Utente Attivo
22 Feb 2014
590
25
28
Buonasera a tutti, volevo chiedervi, è possibile inserire un form personalizzato realizzato tramite la libreria bootstrap all'interno di una homepage di un template wordpress costruito con bootstrap 3?
In allegato il form da inserire. Ovviemente per testarlo ho fatto importazione delle librerie da CDN.
Non posso utilizzare i plugin tipici perchè ho bisogno che l'action punti ad una booking engine ( software sviluppato da una casa terza ), quindi ho bisogno di costruirlo da me.
Grazie per l'attenzione.

Codice:
<!doctype html>
<html>
<head>
<head>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
        $(document).ready(function () {
                    $('#data_arrivo').datepicker({
                        format: "dd/mm/yyyy"
                    }); 
                });
        $(document).ready(function () {
                    $('#data_partenza').datepicker({
                        format: "dd/mm/yyyy"
                    }); 
                });
    </script>
    
    <style>
        .inner-addon {position: relative;}/*impaginazione icone*/
        .inner-addon .glyphicon {position: absolute;padding: 10px;pointer-events: none;}/*impaginazione icone*/
        .left-addon .glyphicon{left:  0px; top: 24px;}/*impaginazione icone*/
        .right-addon .glyphicon {right: 0px;}
        .left-addon input  {padding-left:  30px; }/*icona a sinistra*/
        .left-addon textarea  {padding-left:  30px; } /*icona a sinistra nella textarea*/
        .right-addon input {padding-right: 30px; } /*icona a destra*/
    </style>
</head>
<body>
<div class="container">
    <form class="form" action="#" method="post">
        <div class="row">
          <div class="col-md-6 col-sm-6 col-xs-12">
            <div class="form-group inner-addon left-addon">
            <span class="glyphicon glyphicon-calendar"></span>
                <label for="data_arrivo">Arrivo</label>
                <input type="date" class="form-control " id="data_arrivo" name="data_arrivo" placeholder="Data Arrivo"><!-- input-lg in form -->
            </div>
          </div>
          <div class="col-md-6 col-sm-6 col-xs-12">
            <div class="form-group inner-addon left-addon">
            <span class="glyphicon glyphicon-calendar"></span>
                <label for="data_partenza">Partenza</label>
                <input type="date" class="form-control" id="data_partenza" name="data_partenza" placeholder="Data Partenza">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-6 col-sm-6 col-xs-12">
            <div class="form-group inner-addon left-addon">
            <span class="glyphicon glyphicon-bed"></span>
                <label for="camere">N. Camere</label>
                <input type="number" min="1" max="10" class="form-control" name="camere" id="camere" placeholder="N. Camere">
            </div>
          </div>
          <div class="col-md-6 col-sm-6 col-xs-12">
            <div class="form-group inner-addon left-addon">
            <span class="glyphicon glyphicon-user"></span>
                <label for="persone">Persone</label>
                <input type="number" min="1" max="20" class="form-control" name="persone" id="persone" placeholder="N. Persone">
            </div>
          </div>
        </div>
        <div class="row">
            <div class="col-md-12 col-sm-12">
                <div class="form-group inner-addon left-addon">
                <span class="glyphicon glyphicon-barcode"></span>
                    <label for="coupon">Coupon</label>
                    <input type="text" class="form-control" id="coupon" name="coupon" placeholder="Codice sconto">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12 col-sm-12">
                    <button type="submit" class="btn btn-success btn-lg btn-block"><span class="glyphicon glyphicon-chevron-right"></span>  Prenota Ora</button>
            </div>
        </div>
    </form>
</div>
</body>
</html>
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
C Form di registrazione personalizzato PHP 2
S passare un valore da un form a un file .php con metodo post PHP 4
K Form che manda dati doppi PHP 1
K Problema form update PHP 2
Elisacau [Contact form 7] Inserire Numero auto incrementante WordPress 1
K form Inserimento record mysql PHP 2
I Form con selettore HTML e CSS 0
K [php]form invio dati PHP 0
G form invio multiplo con checkbox PHP 12
nivaria.achinet Intercettare form solo dopo invio Javascript 1
D Form contatti non funzionante HTML e CSS 0
A Stampare dati da form PHP 8
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
I Form HTML e CSS 17
otto9due $_FILE non passa i dati dal form PHP 1
M Form: come tornare ai campi già compilati dopo invio PHP 1
G Invio form con PHP PHP 3
felino Form action costum e parametri in queryString WordPress 1
M Come recuperare molteplici input form PHP 1
M Collegamento tra form html e script php PHP 4
L form immagini per il database PHP 0
A form PHP prenotazione tramite query PHP 2
A Form php prenotazione di un azienda sanitaria locale presso studio medico PHP 1
L inserimento form dati multipli ? PHP 0
L Problemi form Pagina php HTML e CSS 3
Cosina Creare bottone delete in form upload PHP 5
Cosina Creare bottone delete in form upload PHP 1
D Devo far funzionare un form di contatti PHP 4
B form gestione input PHP 2
V PHP form intersecate PHP 0
8 Javascript - PDF Form Javascript 0
J Form inserimento dati in database Ajax 1
E Gestione profilo utente tramite Form PHP 3
R [C#] Form principale si blocca mentre un altro Thread lavora .NET Framework 0
M Problema con controllo form in real time jQuery 6
D Form validazione Javascript 2
R form recovery pass PHP 0
V Symfony e i form PHP 3
M form con checkbox PHP 8
S come aggiustare un form di contatto? HTML e CSS 3
F query e form con select multipla PHP 17
MarcoGrazia Verifica di una stringa o di un nome proveniente da form Snippet PHP 0
A Inserimento dati nel database tramite form + altre operazioni PHP 18
websilvia Contact form using Bootstrap 3.3.4 PHP 8
Alex_70 Button non funziona nella form PHP 2
C Form email php su pagina index.html? PHP 21
W Rinominare Documenti Con Form Asp Classic ASP 9
S Invio email da form PHP 8
L form multipla php sql,errore in inserimento MySQL 0
L inviare i dati di un form ad un database PHP 6

Discussioni simili