Come aggiungere un modulo con KompoZer

Esistono molte volte quando si creano pagine Web in cui è necessario elaborare gli input inviati dall'utente come una pagina di accesso, la creazione di un nuovo account o per inviare domande o commenti. L'input dell'utente viene raccolto e inviato al server Web utilizzando un modulo HTML. I moduli sono facili da aggiungere con gli strumenti integrati di KompoZer. Tutti i tipi di campi modulo supportati da HTML 4.0 possono essere aggiunti e modificati con KompoZer, ma per questo tutorial, lavoreremo con i pulsanti testo, area di testo, invio e ripristino.

Crea un nuovo modulo

KompoZer è ricco di strumenti di forma che è possibile utilizzare per aggiungere moduli alle tue pagine web. Si accede agli strumenti del modulo facendo clic sul pulsante Modulo o sul menu a discesa associato sulla barra degli strumenti. Si noti che se non si scrivono script di gestione dei moduli personali, è necessario ottenere alcune informazioni per questo passaggio dalla documentazione o dal programmatore che ha scritto lo script. Puoi anche usare i moduli mailto ma non sempre funzionano.

1. Posiziona il cursore nella posizione in cui desideri che il tuo modulo appaia sulla pagina.
2. Clicca il Modulo pulsante sulla barra degli strumenti. Si apre la finestra di dialogo Proprietà modulo.
3. Aggiungi un nome per il modulo. Il nome viene utilizzato nel codice HTML generato automaticamente per identificare il modulo ed è richiesto. È inoltre necessario salvare la pagina prima di poter aggiungere un modulo. Se stai lavorando con una nuova pagina non salvata, KompoZer ti chiederà di salvare.
4. Aggiungi l'URL allo script che elaborerà i dati del modulo nel campo URL azione. I gestori di moduli sono in genere script scritti in PHP o un linguaggio simile sul lato server. Senza queste informazioni, la tua pagina web non sarà in grado di fare nulla con i dati inseriti dall'utente. KompoZer ti chiederà di inserire l'URL per il gestore del modulo se non lo inserisci.
5. Seleziona il Metodo utilizzato per inviare i dati del modulo al server. Le due scelte sono GET e POST. Avrai bisogno di sapere quale metodo richiede lo script.
6. Clic ok e il modulo viene aggiunto alla tua pagina.

Aggiungi un campo di testo a un modulo

Dopo aver aggiunto un modulo a una pagina con KompoZer, il modulo verrà delineato sulla pagina in una linea tratteggiata celeste. Aggiungi i campi del modulo in quest'area. Puoi anche digitare testo o aggiungere immagini, proprio come faresti su qualsiasi altra parte della pagina. Il testo è utile per aggiungere prompt o etichette per formare campi per guidare l'utente.

1. Scegli dove vuoi che il campo di testo vada nell'area del modulo delineato. Se vuoi aggiungere un'etichetta, puoi prima digitare il testo.
2. Clicca il Freccia in giù accanto al Modulo pulsante sulla barra degli strumenti e scegliere Campo modulo dal menu a discesa.
3. La finestra Form Field Properties si aprirà. Per aggiungere un campo di testo, selezionare Testo dal menu a discesa etichettato Tipo di campo.
4. Dai un nome al campo di testo. Il nome viene utilizzato per identificare il campo nel codice HTML e lo script di gestione moduli richiede il nome per elaborare i dati. Un certo numero di altri attributi opzionali può essere modificato in questa finestra di dialogo Più proprietà / meno proprietà pulsante o premendo il pulsante Modifica avanzata, ma per ora, inseriremo semplicemente il nome del campo.
5. Clic ok e il campo di testo appare sulla pagina.

Aggiungi un'area di testo a un modulo

A volte, è necessario inserire molto testo in un modulo, ad esempio un messaggio o un campo domande / commenti. In questo caso, un campo di testo non è appropriato. È possibile aggiungere un campo modulo area di testo utilizzando gli strumenti del modulo.

1. Posiziona il cursore all'interno del contorno del modulo in cui desideri posizionare l'area di testo. Se vuoi inserire un'etichetta, è spesso una buona idea digitare il testo dell'etichetta, premi invio per passare a una nuova riga, quindi aggiungi il campo modulo, poiché la dimensione dell'area di testo sulla pagina lo rende scomodo per etichetta a sinistra oa destra.
2. Clicca il Freccia in giù accanto al Modulo pulsante sulla barra degli strumenti e scegliere Testo La zona dal menu a discesa. Si aprirà la finestra Proprietà dell'area di testo.
3. Immettere un nome per il campo dell'area di testo. Il nome identifica il campo nel codice HTML e viene utilizzato dallo script di gestione moduli per elaborare le informazioni inviate dall'utente.
4. Immettere il numero di righe e colonne per le quali si desidera visualizzare l'area di testo. Queste dimensioni determinano la dimensione del campo sulla pagina e la quantità di testo che può essere immessa nel campo prima che lo scorrimento debba avvenire.
5. Altre opzioni avanzate possono essere specificate con gli altri controlli in questa finestra, ma per ora il nome e le dimensioni del campo sono sufficienti.
6. Clic ok e l'area di testo appare sul modulo.

Aggiungi un pulsante Invia e Reimposta a un modulo

Dopo che l'utente ha compilato il modulo sulla tua pagina, è necessario che le informazioni siano inviate al server. Inoltre, se l'utente desidera ricominciare o commettere un errore, è utile includere un controllo che reimposterà tutti i valori del modulo sul valore predefinito. I controlli speciali dei form gestiscono queste funzioni, chiamate rispettivamente i pulsanti Submit e Reset.

1. Posiziona il cursore all'interno dell'area del modulo delineato in cui desideri che sia presente il pulsante di invio o di ripristino. Molto spesso, questi si troveranno sotto il resto dei campi su un modulo.
2. Clicca il Freccia in giù accanto al Modulo pulsante sulla barra degli strumenti e scegliere Definisci il pulsante dal menu a discesa. Apparirà la finestra delle proprietà del pulsante.
3. Scegli il tipo di pulsante dal menu a discesa etichettato Tipo. Le tue scelte sono Invia, Ripristina e Pulsante. In questo caso, sceglieremo il Sottoscrivi genere.
4. Dare un nome al pulsante, che verrà utilizzato nel codice di gestione del modulo HTML e per elaborare la richiesta del modulo. Gli sviluppatori Web di solito chiamano questo campo "invia".
5. Nella casella etichettata Valore, inserisci il testo che dovrebbe apparire sul pulsante. Il testo dovrebbe essere breve ma descrittivo di ciò che accadrà quando si preme il pulsante. Qualcosa come "Invia", "Invia modulo" o "Invia" sono buoni esempi.
6. Fare clic su OK e il pulsante viene visualizzato nel modulo.

Il Reset pulsante può essere aggiunto al modulo utilizzando lo stesso processo, ma scegliere Reset dal genere campo invece di Sottoscrivi.

Modifica di un modulo con KompoZer

La modifica di un campo modulo o modulo in KompoZer è molto semplice. È sufficiente fare doppio clic sul campo che si desidera modificare e viene visualizzata la finestra di dialogo appropriata in cui è possibile modificare le proprietà del campo in base alle proprie esigenze. Il diagramma sopra mostra una forma semplice usando i componenti trattati in questo tutorial.