• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

ΠΩΣ ΦΤΙΑΧΝΩ E-SHOP ΦΟΡΜΑ ΠΑΡΑΓΓΕΛΙΑΣ

E-SHOP FORM
ΠΩΣ ΦΤΙΑΧΝΩ E-SHOP ΦΟΡΜΑ ΠΑΡΑΓΓΕΛΙΑΣ ΣΤΟ BLOGGER
Με τον παρακάτω κώδικα μπορούμε να βάλουμε μία φόρμα παραγγελίας προϊόντων στο blog μας. Αλλάξτε το demo@mail.gr με το δικό σας e-mail που θέλετε να σας στέλνουν τις παραγγελίες. Αλλάξτε τους τίτλους με τα πορτοκαλί γράμματα, τα ονόματα των πεδίων εγγραφών με τα κίτρινα γράμματα αλλά και με τα πράσινα. Αλλάξτε το πλάτος των πεδίων με τα γαλάζια νούμερα. Όπου βλέπετε το </br> σημαίνει αλλαγή γραμμής.

Συμπληρώνοντας την φόρμα παραγγελίας ο πελάτης θα πατάει στο τέλος το κουμπί υποβολή φόρμας και θα ανοίγει σε νέα καρτέλα το προεπιλεγμένο πρόγραμμα αλληλογραφίας που έχει ορίσει ο καθένας στον υπολογιστή του και θα τοποθετήται αυτόματα το e-mail σας πάνω πάνω και όλες οι παραγγελίες που έκανε ο πελάτης θα εισάγονται επίσης αυτόματα στο κύριο περιεχόμενο του e-mail και θα απομένει από τον πελάτη να πατήσει το κουμπί αποστολή για να λάβετε το e-mail του με τα στοιχεία του και να επικοινωνήσετε μαζί του για τα υπόλοιπα διαδικαστικά της παραγγελίας. Αν θέλει ο πελάτης βάζει και ένα τίτλο στο e-mail γιατί αυτός δεν μπαίνει αυτόματα. Ένα μειονέκτημα που έχει αυτός ο κώδικας είναι ότι ο πελάτης πρέπει να πληκτρολογήσει τα στοιχεία του με λατινικούς χαρακτήρες αντί για ελληνικούς γιατί δεν έχει βρεθεί ακόμα τρόπος να διαβάζονται οι ελληνικές γραμματοσειρές που πληκτρολογούνται στα λευκά κουτάκια μέσα από το e-mail. Αυτό πρέπει να το συμπεριλάβετε σε μήνυμα για να πληκτρολογεί ο πελάτης εξ΄αρχής τα στοιχεία του με λατινικούς χαρακτήρες αλλιώς θα σας έρχονται κωδικοποιημένοι και δεν θα καταλαβαίνετε τίποτα. Ευτηχώς όμως θα υπάρχει το e-mail και το τηλέφωνο του πελάτη για τις απαραίτητες διευκρινήσεις. Μετά τον κώδικα έχω ενσωματώσει την φόρμα για να δείτε πως θα φαίνεται.

<div align="center" class="MsoNormal" style="text-align:center;"><b>
<span style="font-size: 14pt;">
<span style="font-family: Arial;">
<span style="background-color: #255720;">
<span style="color:#FFFFFF;"> ΦΟΡΜΑ ΠΑΡΑΓΓΕΛΙΑΣ ΠΡΟΪΟΝΤΩΝ VIVOVERDE</span></span></span> </span></b></div></br>
<form action="MAILTO:demo@mail.gr" method="post" enctype="text/plain">
ΟΝΟΜΑ<input type="text" name="FIRST NAME" style="width: 150px;">
ΕΠΩΝΥΜΟ……… <input type="text" name="LAST NAME" style="width: 200px;">
ΔΙΕΥΘΥΝΣΗ……..<input type="text" name="ADDRESS" style="width: 250px;"></br>
ΠΟΛΗ……<input type="text" name="CITY"" style="width: 150px;">
ΤΑΧ.ΚΩΔ………..<input type="text" name="POST CODE" style="width: 200px;">
ΝΟΜΟΣ……………<input type="text" name="NOMOS" style="width: 250px;"><br>
E-MAIL….<input type="email" name="E-MAIL" style="width: 150px;">
ΤΗΛ. ΚΙΝΗΤΟ……<input type="text" name="MOBILE PHONE" style="width: 200px;">
ΤΗΛ. ΣΤΑΘΕΡΟ<input type="text" name="HOME PHONE" style="width: 250px;">
</br></br>
<div align="center" class="MsoNormal" style="text-align:center;">
<span style="font-size: 13pt;">
<span style="font-family: Arial;">
<span style="background-color: #FF1111;">
<span style="color:#FFFFFF;"> Επιλέξτε τα προϊόντα σας γράφοντας πόσα τεμάχια θέλετε και πατήστε υποβολή φόρμας.</span></span></span> </span></div></br>
TEM : <input type="number" name="COLOSTRUM TEM" style="width: 35px;">
ΠΡΩΤΟΓΑΛΑ (COLOSTRUM) 60 caps/400mg Τιμή 22,00 / Τιμή με έκπτωση 29,36</br>
TEM : <input type="number" name="ALOE VERA TEM" style="width: 35px;">
ALOE VERA 946ml Τιμή 30,00 / Τιμή με έκπτωση 26,40</br>
TEM : <input type="number" name="ACAI BERRY TEM" style="width: 35px;">
ACAI BERRY 150 caps/400mg Τιμή 39,00 / Τιμή με έκπτωση 34,30</br>
TEM : <input type="number" name="FYKIA AFA TEM" style="width: 35px;">
ΦΥΚΙΑ AFA 150 caps/400mg Τιμή 42,00 / Τιμή με έκπτωση 36,96</br>
TEM : <input type="number" name="MASTIXA TEM" style="width: 35px;">
ΜΑΣΤΙΧΑ ΧΙΟΥ 120 caps/400mg Τιμή 42,00 / Τιμή με έκπτωση 36,90</br>
TEM : <input type="number" name="GRAVIOLA TEM" style="width: 35px;">
GRAVIOLA 120 caps/300mg Τιμή 39,00 / Τιμή με έκπτωση 34,32</br>
TEM : <input type="number" name="MACA TEM" style="width: 35px;">
MACA 120 caps/500mg Τιμή 39,00 / Τιμή με έκπτωση 34,32</br>
TEM : <input type="number" name="NONI TEM" style="width: 35px;">
NONI 150 caps/400mg Τιμή 39,00 / Τιμή με έκπτωση 34,32</br>
TEM : <input type="number" name="SPIROULINA TEM" style="width: 35px;">
ΣΠΙΡΟΥΛΙΝΑ 150 caps/400mg Τιμή 18,00 / Τιμή με έκπτωση 15,84</br>
TEM : <input type="number" name="PROPOLIS TEM" style="width: 35px;">
ΠΡΟΠΟΛΗ 50 caps/150mg Τιμή 19,50 / Τιμή με έκπτωση 17,16</br>
TEM : <input type="number" name="PICNOGENOL TEM" style="width: 35px;">
ΠΥΚΝΟΓΕΝΟΛΗ 90 caps/30mg Τιμή 73,00 / Τιμή με έκπτωση 64,24</br>
TEM : <input type="number" name="OMEGA-3 TEM" style="width: 35px;">
OMEGA-3 120 caps Τιμή 55,00 / Τιμή με έκπτωση 48,40</br></br>
<input type="reset" value="Καθαρισμός φόρμας">
<input type="submit" value="Υποβολή φόρμας">
</form>
ΦΟΡΜΑ ΠΑΡΑΓΓΕΛΙΑΣ ΠΡΟΪΟΝΤΩΝ VIVOVERDE
ΟΝΟΜΑ… ΕΠΩΝΥΜΟ……… ΔΙΕΥΘΥΝΣΗ…….. ΠΟΛΗ…… ΤΑΧ.ΚΩΔ……….. ΝΟΜΟΣ……………
E-MAIL…. ΤΗΛ. ΚΙΝΗΤΟ…… ΤΗΛ. ΣΤΑΘΕΡΟ…
Επιλέξτε τα προϊόντα σας γράφοντας πόσα τεμάχια θέλετε και πατήστε υποβολή φόρμας.
TEM : ΠΡΩΤΟΓΑΛΑ (COLOSTRUM) 60 caps/400mg Τιμή 22,00 / Τιμή με έκπτωση 29,36
TEM : ALOE VERA 946ml Τιμή 30,00 / Τιμή με έκπτωση 26,40
TEM : ACAI BERRY 150 caps/400mg Τιμή 39,00 / Τιμή με έκπτωση 34,30
TEM : ΦΥΚΙΑ AFA 150 caps/400mg Τιμή 42,00 / Τιμή με έκπτωση 36,96
TEM : ΜΑΣΤΙΧΑ ΧΙΟΥ 120 caps/400mg Τιμή 42,00 / Τιμή με έκπτωση 36,90
TEM : GRAVIOLA 120 caps/300mg Τιμή 39,00 / Τιμή με έκπτωση 34,32
TEM : MACA 120 caps/500mg Τιμή 39,00 / Τιμή με έκπτωση 34,32
TEM : NONI 150 caps/400mg Τιμή 39,00 / Τιμή με έκπτωση 34,32
TEM : ΣΠΙΡΟΥΛΙΝΑ 150 caps/400mg Τιμή 18,00 / Τιμή με έκπτωση 15,84
TEM : ΠΡΟΠΟΛΗ 50 caps/150mg Τιμή 19,50 / Τιμή με έκπτωση 17,16
TEM : ΠΥΚΝΟΓΕΝΟΛΗ 90 caps/30mg Τιμή 73,00 / Τιμή με έκπτωση 64,24
TEM : OMEGA-3 120 caps Τιμή 55,00 / Τιμή με έκπτωση 48,40

11 σχόλια:

  1. Μπορείτε να με βοηθήσετε σε κάτι; θέλω να βάλω αυτή τη φόρμα παραγγελίας στο wordpress blog μου... που ακριβώς πληκτρολογώ τον παραπάνω κώδικα;

    ΑπάντησηΔιαγραφή
  2. Δεν είναι για τα free wordpress blogs αυτή η φόρμα. Μόνο για blogger, weebly, wix, webnode, pblogs και πολλές άλλες πλατφόρμες έκτός από Wordpress. Μην ασχολήσαι με τα Free wordpress blogs έχουν πολλούς περιορισμούς και ιδιαιτερότητες. Φτιάξτο ή στον blogger ή στο Weebly.

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Ευχαριστώ πολύ... πως μπορώ αφού κάνω blogger να το προσθέσω και που; μπορείτε να με βοηθήσετε;

      Διαγραφή
    2. μου βγάζει αυτό... Δεν ήταν δυνατή η φόρτωση της προεπισκόπησης προτύπου: Σφάλμα κατά την ανάλυση του XML, γραμμή 2644, στήλη 2: The markup in the document following the root element must be well-formed.

      Διαγραφή
    3. Αφού φτιάξεις ιστολόγιο στον blogger ανοίγεις μία καινούγια ανάρτηση και αφού γράψεις πρώτα αυτά που απιτούνται σαν πληροφορίες για την συμπλήρωση της φόρμας πατάς το κουμπι HTML που βρίσκεται στην οριζόντια μπάρα του editor ανάρτησης του blogger και εμφανίζονται αυτά που έχεις γράψει σε μορφή κώδικα HTML και τότε πάς στο τέλος αυτών και επικολλάς τον παραπάνω κώδικα και σώζεις την ανάρτηση και τελείωσες.

      Διαγραφή
  3. Καλησπέρα Blogger Expert ,Συγχαρητρια για την εξερετικη δουλεια που κάνετε.Παρακαλώ βοηθηστε σε κατι περνω τον κωδικα για την e-shop φορμα ,χρησημοποιω τον kompozer για html ,θέλω ομωσ οταν παταει ο χρηστης "Υποβολη Φόρμας να μην του ανοιγει outlook για να στειλει το εμαιλ αλλα να το στέλνει απο πισω και να του βγαινει και ενα μυνημα π.χ. ευχαριστουμε ....παρακαλω απαντηστε μου στο: gmdproteas.admin@cytanet.com.cy

    ΑπάντησηΔιαγραφή
  4. Ανώνυμος19/12/15 15:06

    Καλησπέρα Blogger Expert ,επειδη ειμαι αρχαριος σε website και λοιπα πολυ λιγα γνωριζω ,αυτο που θελω να κανω ειναι αφου εκανα copy τοβ κωδικα που εχεις φτιαξει για την φορμα e-shop και την εκανα paste στον compozer(φτιαχνει website αυτη η εφαρμογη...) προσπαθησα να προσαρμοσω τν φορμα σου και να στελνει εμαιλ σε μενα αλλα αυτο που θελω ειναι να μην βλεπει ο χρηστης που παει το εμαιλ διοτι εγω θελω να του ορισω να πηγαινει σε πανω απο ενα εμαιλ επισης να του βγαζει μυνημα οταν το εμαιλ παει η οταν δεν παει προσπαθησα να το κανω με την φορμα αλλαξα το post σε get αλλα δεν παει το εμαιλ πουθενα. Δεν γνωριζω πωσ γινεται. Θα εκτιμουσα την πολυτιμη βοηθεια σου . Σε παρακαλω πολυ εαν θελεις στειλε μου την απαντηση σου στο gmdproteas.admin@cytanet.com.cy. Σε ευχαριστώ εκ τω προτέρων και παλι καλη ημερα να εχεις .

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

      Διαγραφή
  5. Ανώνυμος16/3/16 20:43

    Blogger Expert,πατάω υποβολή φόρμας για να δοκιμασω αν γινεται να σταλεί η φόρμα στο e-mail μου,αλλά δεν γίνεται τίποτα.Ενώ όταν πατάω καθαρισμός φόρμας διαγράφονται κανονικά.
    Γιατί δεν γίνεται να υποβάλω την φόρμα μου;

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Μάλλον εγκατέστησες κάποιο πρόγραμμα διαχείρισης e-mail και άλλαξε η ρύθμιση του προεπιλεγμένου προγράματος αλληλογραφίας στον πίνακα ελέγχου.. Πήγαινε στον πίνακα ελέγχου κα πάτα Προγράμματα / Ανοιγμα ενος τύπου αρχείου πάντοτε με ένα συγκεκριμένο πρόγραμμα / MAILTO . Επέλεξε να ανοίγει με το νέο πρόγραμμα που έβαλες ή αν δεν ανοίγει με αυτό με όποιο άλλο ανοίγει απο τη λίστα που θα σου βγάλει.

      Διαγραφή
    2. Ανώνυμος17/3/16 13:24

      Σε ευχαριστώ πολύ για την βοήθεια!

      Διαγραφή

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.