Home » Internet » Υπηρεσίες στο Internet » Δωρεάν Φόρμα Επικοινωνίας Στο Site Μου Με Τις Φόρμες Google

Δωρεάν Φόρμα Επικοινωνίας Στο Site Μου Με Τις Φόρμες Google

Αυτός ο οδηγός γράφτηκε πριν από περισσότερα από 2 χρόνια. Η τεχνολογία αλλάζει και εξελίσσεται. Αν οτιδήποτε δεν σας λειτουργεί, γράψτε μας στα σχόλια και θα κοιτάξουμε να τον ανανεώσουμε.

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

Δείτε τις ενότητες του οδηγού

Προτάσεις συνεργασίας

Προωθήστε δυναμικά την επιχείρησή σας στο site του PCsteps και στο κανάλι μας στο YouTube.

Επικοινωνία

Γίνε VIP μέλος στο PCSteps

Τα μέλη υποστηρίζουν ενεργά το PCsteps για να συνεχίσει να λειτουργεί χωρίς διαφημίσεις για όλους.

Συμμετοχή

Τι είναι οι Φόρμες Google;

Οι Φόρμες της Google είναι ένα δωρεάν εργαλείο που μας επιτρέπει να δημιουργούμε κάθε πιθανή φόρμα επικοινωνίας.

Δωρεάν Φόρμα Επικοινωνίας Στο Site Μου Με Τις Φόρμες Google

Με τη βοήθεια των Φορμών Google μπορούμε να διαχειριστούμε τις εγγραφές μίας εκδήλωσης, να κάνουμε δημοσκοπήσεις, να συγκεντρώσουμε email για την αποστολή newsletter, να φτιάξουμε quiz, και πολλά ακόμη.

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

Τα δεδομένα από τις Φόρμες Google ενημερώνονται αυτόματα, και αν θέλουμε τα συγκεντρώνουμε σε γραφήματα.

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

Γιατί να προτιμήσουμε τις Φόρμες Google;

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

Γιατί λοιπόν να μην χρησιμοποιήσουμε αυτή τη φόρμα επικοινωνίας, και να προτιμήσουμε τις Φόρμες Google;

Αρχικά, οι κλασικές PHP Φόρμες χρησιμοποιούν POST ή SMTP για να στέλνουν τα email ειδοποίησης. Οπότε, και στις δύο περιπτώσεις θα πρέπει να ξέρουμε πώς να ρυθμίσουμε τον email server ώστε να δουλεύει σωστά.

Οι Φόρμες Google δεν στέλνουν κάποιο email, αλλά συγκεντρώνουν όλες τις εγγραφές σε ένα Φύλλο Google. Με αυτόν τον τρόπο αποφεύγουμε να γεμίσουν τα εισερχόμενά μας με αμέτρητες ειδοποιήσεις.

Δεν απαιτείται να πειράζουμε τον κώδικα της σελίδας κάθε φορά που θέλουμε να κάνουμε κάποια αλλαγή. Απλά συνδεόμαστε στις Φόρμες Google, και επεξεργαζόμαστε τη φόρμα επικοινωνίας από εκεί.

Πώς δημιουργούμε τη φόρμα επικοινωνίας

Οι Φόρμες Google διαθέτουν ένα απλό πρότυπο φόρμας επικοινωνίας, που είναι διαθέσιμο μόνο στην Αγγλική έκδοση. Γι’ αυτό θα δημιουργήσουμε τη φόρμα μόνοι μας από το μηδέν.

Πρώτα από όλα, πραγματοποιούμε σύνδεση στις Φόρμες Google, και κάνουμε κλικ στο κόκκινο κουμπί με το “+” κάτω δεξιά για να δημιουργήσουμε μία νέα φόρμα.

Ως τίτλο, η φόρμα μας έχει το “Φόρμα χωρίς τίτλο”, οπότε κάνουμε κλικ στο πεδίο και γράφουμε “Φόρμα Επικοινωνίας” ή κάτι σχετικό.

Πατάμε το πεδίο της ερώτησης, κάνουμε κλικ στις “Πολλαπλές επιλογές”, και διαλέγουμε τη “Σύντομη απάντηση”.

Αντικαθιστούμε το κείμενο “Ερώτηση χωρίς τίτλο” με το “Όνομα”, και γυρίζουμε τον διακόπτη ώστε το πεδίο να είναι υποχρεωτικό.

Στη συνέχεια, πατάμε το κουμπί με το “+” κάτω αριστερά για να προσθέσουμε επιπλέον ερώτηση, και αλλάζουμε τον τύπο της σε “Σύντομη απάντηση”.

Στο πεδίο που γράφει “Ερώτηση”, συμπληρώνουμε τη λέξη “Email” ή τη φράση “Διεύθυνση Ηλεκτρονικού Ταχυδρομείου”.

Οι Φόρμες Google χρησιμοποιούν λέξεις-φράσεις κλειδιά ώστε να καταλαβαίνουν τι πεδία δημιουργούμε, και να εφαρμόζουν αυτόματα κάποιες ρυθμίσεις.

Γι’ αυτόν τον λόγο θα εμφανιστεί ένας σύνδεσμος που μας προτείνει να ενεργοποιήσουμε τη συλλογή διευθύνσεων ηλεκτρονικού ταχυδρομείου.

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

Με αντίστοιχο τρόπο μπορούμε να προσθέσουμε όσα πεδία θέλουμε, εικόνες, ακόμη και βίντεο.

Παραδείγματος χάριν, για την προσθήκη ενός πεδίο τηλεφώνου, ορίζουμε τον τύπο ως “Σύντομη απάντηση”, και πατάμε κάτω δεξιά τις τρεις τελείες.

Εδώ θα βρούμε δύο επιλογές, όπου και ενεργοποιούμε την “Επικύρωση απάντησης”.

Τώρα βλέπουμε κάποιες επιπλέον επιλογές. Ορίζουμε την πρώτη ως αριθμό, και τη δεύτερη στο να είναι “Ακέραιος αριθμός”.

Επίσης, στο πλαίσιο κειμένου σφάλματος γράφουμε το μήνυμα που θα βλέπει ο χρήστης αν εισάγει λάθος δεδομένα.

Αν κάποια από τα πεδία δεν είναι υποχρεωτικά, αφήνουμε τον σχετικό διακόπτη ανενεργό.

Το μόνο που μένει για να συμπληρωθεί η φόρμα επικοινωνίας μας είναι το πλαίσιο κειμένου για τα σχόλια.

Προσθέτουμε μία νέα ερώτηση, και ονομάζουμε το πεδίο κατάλληλα. Για παράδειγμα “Σχόλιο” ή “Μήνυμα”.

Ως τύπο πεδίου ορίζουμε “Παράγραφος”, και κάνουμε την πληροφορία υποχρεωτική.

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

Ρυθμίζοντας τη φόρμας επικοινωνίας

Αρχικά, κάνουμε κλικ στις τρεις τελείες πάνω δεξιά, και επιλέγουμε “Ρυθμίσεις”.

Στη κατηγορία “ΓΕΝΙΚΆ” επιλέγουμε τι θα κάνει η φόρμα όταν οι χρήστες την υποβάλλουν από το site μας.

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

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

Στην καρτέλα “ΠΑΡΟΥΣΊΑΣΗ” βλέπουμε διάφορες γενικές επιλογές, που αφορούν κυρίως τα ερωτηματολόγια. Παρ’ όλα αυτά, το τελευταίο πεδίο ενδιαφέρει κι εμάς, διότι έχει σχέση με το μήνυμα που θα βλέπουν οι χρήστες όταν υποβάλουν τη φόρμα επικοινωνίας.

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

Μπορούμε για παράδειγμα να γράψουμε “Ευχαριστούμε που επικοινωνήσατε μαζί μας. Θα λάβετε απάντηση στο μήνυμά σας εντός 24 ωρών.”

Μόλις τελειώσουμε όλες τις ρυθμίσεις, κάνουμε κλικ στην “ΑΠΟΘΉΚΕΥΣΗ”, και η φόρμα επικοινωνίας μας είναι έτοιμη.

Εξαγωγή του κώδικα ενσωμάτωσης

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

Κάνουμε κλικ στο βέλος πάνω δεξιά για να εμφανίσουμε τις επιλογές αποστολής της φόρμας.

Στο νέο παράθυρο επιλέγουμε την “Ενσωμάτωση HTML”, και ρυθμίζουμε το “Πλάτος” και το “Ύψος” που θέλουμε να έχει η φόρμα επικοινωνίας.

Μόλις είμαστε έτοιμοι, κάνουμε κλικ στην “ΑΝΤΙΓΡΑΦΉ”, ώστε να αντιγραφεί ο κώδικας της φόρμας στο πρόχειρο.

Πώς ενσωματώνουμε τη φόρμα επικοινωνίας στο site μας

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

Οπότε μεταβαίνουμε στη σελίδα αυτή, και μπαίνουμε σε κατάσταση επεξεργασίας.

Αντικαθιστούμε τον κώδικα της σελίδας με αυτόν που πήραμε από τις Φόρμες Google.

Υπάρχει περίπτωση να δούμε τον κώδικα να αλλάζει, όπως σε αυτή την περίπτωση που το WordPress τροποποίησε αυτόματα τον κώδικα του iframe.

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

Όπως παρατηρούμε, η φόρμα δεν είναι τέλεια. Φαίνεται λίγο περίεργη, και είναι στοιχισμένη στα αριστερά της σελίδας.

Με λίγες ρυθμίσεις στη σελίδα μας, και μερικές αλλαγές στις Φόρμες Google, θα φέρουμε τη φόρμα επικοινωνίας στα μέτρα μας.

Τροποποίηση και ενημέρωση της φόρμας επικοινωνίας

Αρχικά, μπορούμε να τροποποιήσουμε ανά πάσα στιγμή τις διαστάσεις της φόρμας από τις ρυθμίσεις αποστολής.

Οπότε, κάνουμε κλικ στο βέλος πάνω δεξιά, επιλέγουμε την “Ενσωμάτωση HTML”, και ρυθμίζουμε τις κατάλληλες διαστάσεις.

Είτε αλλάζουμε το πλάτος (width) και το ύψος (height) της φόρμας μέσω του κώδικα.

Μόλις τελειώσουμε με τις διαστάσεις, μπορούμε να πειράξουμε την εμφάνιση της φόρμας.

Πηγαίνουμε στις Φόρμες Google, και με ανοιχτή τη φόρμα πατάμε την παλέτα πάνω δεξιά.

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

Ό,τι αλλαγές πραγματοποιούμε στη φόρμα, όσον αφορά τα πεδία, τα κείμενα, και την εμφάνιση, εφαρμόζονται αυτόματα και στο site μας. Έτσι, δεν χρειάζεται να επεξεργαζόμαστε συνεχώς τον κώδικα.

Ορίστε το τελικό αποτέλεσμα της δικής μας φόρμας επικοινωνίας.

Δοκιμή της φόρμας επικοινωνίας

Η δοκιμή της φόρμας δεν είναι κάποια περίπλοκη διαδικασία. Απλά ανοίγουμε τη σελίδα επικοινωνίας του site μας, και τη συμπληρώνουμε.

Πριν πατήσουμε “ΥΠΟΒΟΛΉ”, έχουμε τη δυνατότητα να επιλέξουμε να μας σταλεί αντίγραφο του μηνύματος. Αυτό συμβαίνει διότι έτσι ρυθμίσαμε τη συμπεριφορά της φόρμας επικοινωνίας.

Μόλις κάνουμε κλικ στην “ΥΠΟΒΟΛ’Η”, θα δούμε το μήνυμα επιβεβαίωσης που ορίσαμε στις ρυθμίσεις της φόρμας.

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

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

Διαχείριση των απαντήσεων

Τα μηνύματα που έχουμε λάβει μέσω της φόρμας επικοινωνίας μπορούμε να τα δούμε από τις Φόρμες Google.

Μπαίνουμε στη σελίδα με τη φόρμα που δημιουργήσαμε, και κάνουμε κλικ στην καρτέλα “ΑΠΑΝΤΉΣΕΙΣ”.

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

Μόλις κάνουμε κλικ στο κουμπί θα δούμε ένα παράθυρο στο οποίο δίνουμε τον τίτλο που θέλουμε να έχει το φύλλο, και πατάμε “ΔΗΜΙΟΥΡΓΊΑ”.

Αυτόματα θα ανοίξει το φύλλο σε νέα καρτέλα, ενώ κάθε φορά που κάποιος στέλνει νέο μήνυμα, θα προστίθεται αυτόματα σε αυτό.

Επιπλέον, αν κάνουμε κλικ στις τρεις τελείες, θα βρούμε μερικές ακόμη επιλογές.

Μπορούμε να διαλέξουμε αν θα λαμβάνουμε ειδοποιήσεις μέσω email για τις νέες απαντήσεις, να αλλάξουμε το Φύλλο Google στο οποίο αποθηκεύονται οι απαντήσεις, ή να αποσυνδέσουμε τη φόρμα από τα Φύλλα Google γενικά.

Επίσης, αν θέλουμε, κατεβάζουμε τις απαντήσεις σε μορφή αρχείου “.csv”, τις εκτυπώνουμε, ή τις διαγράφουμε εντελώς.

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

Τέλος, στη “ΣΎΝΟΨΗ” βλέπουμε όλες τις απαντήσεις και τα στατιστικά στοιχεία τους.

Αν κάνουμε κλικ σε κάποιο από τα email, μπορούμε να διαχειριστούμε το συγκεκριμένο μήνυμα.

Επίσης, έχουμε τη δυνατότητα να διαγράψουμε την απάντηση ή να την εκτυπώσουμε.

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

Δημιουργήσαμε μία αξιόλογη φόρμα επικοινωνίας

Όπως είδαμε, με τις Φόρμες Google καταφέραμε να δημιουργήσουμε τη δική μας φόρμα επικοινωνίας μέσα σε ελάχιστο χρόνο, ακριβώς όπως τη θέλαμε.

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

Τα σχόλια συγκεντρώνονται σε ένα απλό Φύλλο Google, το οποίο μπορούμε να εκτυπώσουμε οποιαδήποτε στιγμή.

Εσείς γνωρίζατε πώς να φτιάξετε φόρμα επικοινωνίας με τις Φόρμες Google; Προτιμάτε αυτή τη φόρμα ή τις έτοιμες που προσφέρουν οι πλατφόρμες δημιουργίας ιστοσελίδων;

Τα σχόλια του PCsteps έχουν μεταφερθεί στο Questions.pcsteps.gr. Αν έχετε απορίες για τη δημοσίευση ή οποιαδήποτε τεχνολογική ερώτηση, από προτάσεις αγορών μέχρι τεχνικά προβλήματα, γράψτε μας εκεί. Απαντάμε το αργότερο εντός 48 ωρών.

Οι Στήλες του PCsteps

featured sale alert τελικο_x4
Οδηγοί Αγοράς
QuickSteps#322 - Λογαριασμός Google Χωρίς Gmail, Δημιουργία Εικόνων Με Το Copilot, Καταμέτρηση Λέξεων
QuickSteps
GamingSteps#20240413 - Αναστάτωση Προκάλεσε Η Σειρά Fallout, The Rogue Prince of Persia, BAFTA Games Awards 2024
GamingSteps