Πώς να προσθέσετε μια φόρμα με το KompoZer

Υπάρχουν πολλές φορές όταν δημιουργείτε ιστοσελίδες όπου πρέπει να επεξεργαστείτε εισροές που υποβάλλονται από το χρήστη, όπως μια σελίδα σύνδεσης, δημιουργία νέου λογαριασμού ή να υποβάλλετε ερωτήσεις ή σχόλια. Η είσοδος χρήστη συλλέγεται και αποστέλλεται στον εξυπηρετητή ιστού χρησιμοποιώντας μια φόρμα HTML. Οι φόρμες είναι εύκολο να προστεθούν με τα ενσωματωμένα εργαλεία της KompoZer. Όλοι οι τύποι πεδίων φόρμας που υποστηρίζει το HTML 4.0 μπορούν να προστεθούν και να επεξεργαστούν με το KompoZer, αλλά για αυτό το σεμινάριο θα εργαστούμε με τα κουμπιά κειμένου, κειμένου, υποβολής και επαναφοράς.

Δημιουργήστε μια νέα φόρμα

Το KompoZer διαθέτει πλούσια εργαλεία φόρμας τα οποία μπορείτε να χρησιμοποιήσετε για να προσθέσετε φόρμες στις ιστοσελίδες σας. Μπορείτε να αποκτήσετε πρόσβαση στα εργαλεία φόρμας κάνοντας κλικ στο κουμπί Φόρμας ή στο αναπτυσσόμενο μενού που βρίσκεται δίπλα στη γραμμή εργαλείων. Σημειώστε ότι αν δεν γράψετε τα δικά σας σενάρια χειρισμού φόρμας, θα χρειαστεί να πάρετε κάποιες πληροφορίες για αυτό το βήμα από την τεκμηρίωση ή από τον προγραμματιστή που έγραψε το σενάριο. Μπορείτε επίσης να χρησιμοποιήσετε τις φόρμες αλληλογραφίας, αλλά δεν λειτουργούν πάντα.

1. Τοποθετήστε τον κέρσορα στη θέση που επιθυμείτε να εμφανίζεται η φόρμα σας στη σελίδα.
2. Κάντε κλικ στο Μορφή στη γραμμή εργαλείων. Ανοίγει το παράθυρο διαλόγου Ιδιότητες φόρμας.
3. Προσθέστε ένα όνομα για τη φόρμα. Το όνομα χρησιμοποιείται στον αυτόματα δημιουργούμενο κώδικα HTML για τον προσδιορισμό της φόρμας και απαιτείται. Πρέπει επίσης να αποθηκεύσετε τη σελίδα σας για να μπορέσετε να προσθέσετε μια φόρμα. Αν εργάζεστε με μια νέα, μη αποθηκευμένη σελίδα, το KompoZer θα σας ζητήσει να το αποθηκεύσετε.
4. Προσθέστε τη διεύθυνση URL στο σενάριο που θα επεξεργαστεί τα δεδομένα της φόρμας στο πεδίο URL της ενέργειας. Οι χειριστές φόρμας είναι συνήθως σενάρια γραμμένα σε PHP ή παρόμοια γλώσσα σελίδας διακομιστή. Χωρίς αυτές τις πληροφορίες, η ιστοσελίδα σας δεν θα μπορεί να κάνει τίποτα με τα δεδομένα που έχει εισαγάγει ο χρήστης. Το KompoZer θα σας ζητήσει να εισαγάγετε τη διεύθυνση URL του χειριστή φόρμας αν δεν το εισάγετε.
5. Επίλεξε το Μέθοδος χρησιμοποιείται για την υποβολή των δεδομένων φόρμας στο διακομιστή. Οι δύο επιλογές είναι GET και POST. Θα χρειαστεί να μάθετε ποια μέθοδο απαιτεί το σενάριο.
6. Κάντε κλικ Εντάξει και η φόρμα προστίθεται στη σελίδα σας.

Προσθέστε ένα πεδίο κειμένου σε μια φόρμα

Μόλις προσθέσετε μια φόρμα σε μια σελίδα με το KompoZer, η φόρμα θα περιγραφεί στη σελίδα σε ανοιχτό μπλε διακεκομμένη γραμμή. Προσθέτετε τα πεδία φόρμας μέσα σε αυτήν την περιοχή. Μπορείτε επίσης να πληκτρολογήσετε κείμενο ή να προσθέσετε εικόνες, όπως θα κάνατε σε οποιοδήποτε άλλο μέρος της σελίδας. Το κείμενο είναι χρήσιμο για την προσθήκη προτροπών ή ετικετών για τη δημιουργία πεδίων για την καθοδήγηση του χρήστη.

1. Επιλέξτε το πεδίο που θέλετε στο πεδίο κειμένου για να μεταβείτε στην περιγραφόμενη περιοχή φόρμας. Αν θέλετε να προσθέσετε μια ετικέτα, ίσως θέλετε να πληκτρολογήσετε πρώτα το κείμενο.
2. Κάντε κλικ στο κάτω βελάκι δίπλα στο Μορφή στη γραμμή εργαλείων και επιλέξτε Πεδίο φόρμας από το αναπτυσσόμενο μενού.
3. Θα ανοίξει το παράθυρο Ιδιότητες πεδίου φόρμας. Για να προσθέσετε ένα πεδίο κειμένου, επιλέξτε Κείμενο από το αναπτυσσόμενο μενού με την ετικέτα Τύπος πεδίου.
4. Δώστε ένα όνομα στο πεδίο κειμένου. Το όνομα χρησιμοποιείται για τον προσδιορισμό του πεδίου στον κώδικα HTML και το script χειρισμού φόρμας χρειάζεται το όνομα για να επεξεργαστεί τα δεδομένα. Ορισμένες άλλες προαιρετικές ιδιότητες μπορούν να τροποποιηθούν σε αυτό το παράθυρο διαλόγου με εναλλαγή Περισσότερες ιδιότητες / λιγότερες ιδιότητες ή πατώντας το κουμπί Σύνθετης επεξεργασίας, αλλά προς το παρόν θα εισαγάγουμε μόνο το όνομα του πεδίου.
5. Κάντε κλικ Εντάξει και το πεδίο κειμένου εμφανίζεται στη σελίδα.

Προσθέστε μια περιοχή κειμένου σε μια φόρμα

Μερικές φορές, πολλά κείμενα πρέπει να εισαχθούν σε μια φόρμα, όπως ένα μήνυμα ή ένα πεδίο ερωτήσεων / σχολίων. Στην περίπτωση αυτή, δεν είναι κατάλληλο ένα πεδίο κειμένου. Μπορείτε να προσθέσετε ένα πεδίο φόρμας περιοχής κειμένου χρησιμοποιώντας τα εργαλεία φόρμας.

1. Τοποθετήστε το δρομέα σας μέσα στο περίγραμμα της φόρμας όπου θα θέλατε να είναι η περιοχή κειμένου σας. Εάν θέλετε να πληκτρολογήσετε μια ετικέτα, είναι συχνά καλή ιδέα να πληκτρολογήσετε το κείμενο της ετικέτας, πατήστε enter για να μετακινηθείτε σε μια νέα γραμμή και, στη συνέχεια, προσθέστε το πεδίο φόρμας, αφού το μέγεθος της περιοχής κειμένου στη σελίδα καθιστά δύσκολη την ετικέτα να είναι στα αριστερά ή δεξιά.
2. Κάντε κλικ στο κάτω βελάκι δίπλα στο Μορφή στη γραμμή εργαλείων και επιλέξτε Κείμενο Περιοχή από το αναπτυσσόμενο μενού. Θα ανοίξει το παράθυρο Ιδιότητες περιοχής κειμένου.
3. Καταχωρίστε ένα όνομα για το πεδίο περιοχής κειμένου. Το όνομα προσδιορίζει το πεδίο στον κώδικα HTML και χρησιμοποιείται από το σενάριο χειρισμού φόρμας για να επεξεργαστεί τις πληροφορίες που υπέβαλε ο χρήστης.
4. Καταχωρίστε τον αριθμό των γραμμών και των στηλών που θέλετε να εμφανίζεται η περιοχή κειμένου. Αυτές οι διαστάσεις καθορίζουν το μέγεθος του πεδίου στη σελίδα και πόσο κείμενο μπορεί να εισαχθεί στο πεδίο, πριν να γίνει η κύλιση.
5. Μπορείτε να καθορίσετε πιο προχωρημένες επιλογές με τα άλλα στοιχεία ελέγχου σε αυτό το παράθυρο, αλλά προς το παρόν αρκεί το όνομα και οι διαστάσεις του πεδίου.
6. Κάντε κλικ Εντάξει και η περιοχή κειμένου εμφανίζεται στη φόρμα.

Προσθέστε ένα κουμπί υποβολής και επαναφοράς σε μια φόρμα

Αφού ο χρήστης συμπληρώσει τη φόρμα στη σελίδα σας, χρειάζεται να υπάρχει κάποιος τρόπος υποβολής των πληροφοριών στον διακομιστή. Επιπλέον, εάν ο χρήστης θέλει να ξεκινήσει ή να κάνει λάθος, είναι χρήσιμο να συμπεριλάβει ένα στοιχείο ελέγχου που θα επαναφέρει όλες τις τιμές φόρμας στις προεπιλεγμένες. Τα ειδικά στοιχεία ελέγχου μορφής χειρίζονται αυτές τις λειτουργίες, που ονομάζονται αντίστοιχα τα κουμπιά υποβολής και επαναφοράς.

1. Τοποθετήστε το δείκτη του ποντικιού σας μέσα στην περιγραφόμενη περιοχή φόρμας όπου επιθυμείτε να είναι το κουμπί υποβολής ή επαναφοράς. Τις περισσότερες φορές, αυτές θα βρίσκονται κάτω από τα υπόλοιπα πεδία σε μια φόρμα.
2. Κάντε κλικ στο κάτω βελάκι δίπλα στο Μορφή στη γραμμή εργαλείων και επιλέξτε Ορίστε το κουμπί από το αναπτυσσόμενο μενού. Θα εμφανιστεί το παράθυρο Properties Properties.
3. Επιλέξτε τον τύπο κουμπιού από το αναπτυσσόμενο μενού που ονομάζεται Τύπος. Οι επιλογές σας είναι Υποβολή, Επαναφορά και Κουμπί. Σε αυτή την περίπτωση, θα επιλέξουμε το υποβάλλουν τύπος.
4. Δώστε ένα όνομα στο κουμπί, το οποίο θα χρησιμοποιηθεί στον κώδικα επεξεργασίας HTML και φόρμας για την επεξεργασία του αιτήματος της φόρμας. Οι προγραμματιστές ιστού συνήθως ονομάζουν αυτό το πεδίο "υποβολή".
5. Στο κουτί με την ετικέτα αξία, πληκτρολογήστε το κείμενο που θα εμφανιστεί στο κουμπί. Το κείμενο θα πρέπει να είναι σύντομο αλλά περιγραφικό για το τι θα συμβεί όταν πατηθεί το κουμπί. Κάτι σαν "Υποβολή", "Υποβολή εντύπου", ή "Αποστολή" είναι καλά παραδείγματα.
6. Κάντε κλικ στο κουμπί OK και το κουμπί εμφανίζεται στη φόρμα.

ο Επαναφορά μπορεί να προστεθεί στη φόρμα χρησιμοποιώντας την ίδια διαδικασία, αλλά επιλέξτε Επαναφορά από το Τύπος πεδίο αντί υποβάλλουν.

Επεξεργασία φόρμας με το KompoZer

Η επεξεργασία ενός πεδίου φόρμας ή φόρμας στο KompoZer είναι πολύ εύκολο. Απλά κάντε διπλό κλικ στο πεδίο που θέλετε να επεξεργαστείτε και εμφανίζεται το κατάλληλο παράθυρο διαλόγου όπου μπορείτε να αλλάξετε τις ιδιότητες πεδίου ανάλογα με τις ανάγκες σας. Το παραπάνω διάγραμμα δείχνει μια απλή φόρμα χρησιμοποιώντας τα στοιχεία που καλύπτονται σε αυτό το σεμινάριο.