ऑर्डर देण्यासाठी एचटीएमएल कोड. ऑनलाइन स्टोअरसाठी एक आदर्श ऑर्डर फॉर्म. अभिप्राय फॉर्म

फॉर्ममध्ये खालील ब्लॉक्स असतात:

ऑर्डर यादी.
जेणेकरुन तुमच्या साइटवर येणाऱ्या अभ्यागताला याची गरज नाही मॅन्युअल मोडतो ऑर्डर करू इच्छित असलेल्या उत्पादनाचे किंवा सेवेचे नाव फॉर्ममध्ये सूचित करा जेव्हा तुम्ही फॉर्ममध्ये उत्पादन जोडण्यासाठी बटणावर क्लिक करता तेव्हा डेटा स्वयंचलितपणे येथे समाविष्ट केला जातो; तुम्ही ऑर्डर इनिशिएलायझेशन बटणे मध्ये मिळवू शकता वैयक्तिक खाते. एखाद्या साइट अभ्यागताने ऑर्डर करण्याचा निर्णय घेतल्याने ऑर्डरमध्ये एकाच वेळी अनेक व्यापार आयटम असू शकतात.

उत्पादन सेटिंग्जमध्ये किंमत निर्दिष्ट केली असल्यास, फॉर्म स्वयंचलितपणे संपूर्ण ऑर्डरची किंमत मोजेल. आणि जर उत्पादन सेटिंग्जमध्ये "अनेक उत्पादने ऑर्डर करणे शक्य आहे" ही विशेषता सेट केली असेल, तर प्रमाण फॉर्ममध्ये प्रदर्शित केले जाईल आणि ऑर्डरची एकूण किंमत या प्रमाणात मोजली जाईल.

खरेदीदार तपशील.
चालू अंतिम टप्पाऑर्डर देताना, अभ्यागत त्याचा डेटा प्रविष्ट करतो. फील्डची संख्या आणि त्यांची नावे अनियंत्रित आहेत आणि EasyNetShop सेवेच्या तुमच्या वैयक्तिक खात्यामध्ये कॉन्फिगर केली जाऊ शकतात. या प्रकरणात, प्रत्येक फील्ड "आवश्यक" वर सेट केले जाऊ शकते आणि आवश्यक फील्ड भरेपर्यंत ऑर्डर फॉर्म पाठविला जाणार नाही.

नियंत्रण बटणे.
खरेदीदार ऑर्डर पूर्ण करू शकतो किंवा फॉर्ममध्ये अतिरिक्त उत्पादने किंवा सेवा जोडण्यासाठी साइटवर परत येऊ शकतो.

कार्ट जोडण्यासाठी उदाहरण html कोड
पृष्ठावर कुठेही 1 वेळा कॉपी करा

BUY बटण ठेवण्यासाठी चाचणी कोड
ते वर्णनाच्या पुढे ठेवा इच्छित उत्पादन खरेदी करा

तयार वैयक्तिक कोडतुम्ही तुमच्या वैयक्तिक खात्यात उत्पादने जोडण्यासाठी बास्केट आणि बटण कोड मिळवू शकता:

EasyNetShop ऑर्डर फॉर्मचा फायदा

आमचा ऑर्डर फॉर्म मालाच्या बास्केटच्या तंत्रज्ञानाचा वापर करून तयार केला जातो, ऑर्डर देण्यापूर्वी तुम्हाला ते गोळा करणे आवश्यक आहे. या तंत्रज्ञानाचे अनेक फायदे आहेत पारंपारिक फॉर्म, जे तुम्ही उत्पादनाच्या पुढील बटणावर क्लिक करता तेव्हा दिसते आणि ऑर्डर तयार करत नाही:

EasyNetShop ऑर्डर फॉर्ममध्ये आणखी काही सकारात्मक मुद्दे:

• ऑर्डर देण्यासाठी अपूर्ण कृतीची सतत आठवण करून देते.
• सोबत ऑर्डर देताना सोयीस्कर मोबाइल उपकरणेकारण अर्धा डेटा (उत्पादन आणि प्रमाण बद्दल) आधीच आपोआप भरलेला आहे.
• आपल्याला केवळ ऑर्डरची रक्कमच नव्हे तर वितरण खर्च तसेच सूट देखील मोजण्याची परवानगी देते.
• ऑर्डर पूर्ण न झाल्यास तुम्ही पुन्हा साइटवर परतल्यावर डेटा वाचवते.
• पूर्ण केलेल्या ऑर्डरसाठी तुम्हाला ऑनलाइन पेमेंट प्रक्रिया आयोजित करण्याची अनुमती देते.

अर्ज प्राप्त झाल्याचा रिटर्न प्रतिसाद मिळाला तरीही पूर्ण केलेला आणि सबमिट केलेला ऑर्डर फॉर्म औपचारिकता राहील. हे खरेदीदारास 100% विश्वास देत नाही की खरेदी केली गेली आहे. उत्तर न मिळाल्याने आणि त्याने त्याची प्रतीक्षा करावी की नाही हे समजत नाही (किती वेळ), खरेदीदार इतर साइट्सवर उत्पादन शोधत राहील. जर खरेदीदाराने शॉपिंग कार्टद्वारे ऑर्डर दिली असेल आणि ऑर्डर क्र.... पूर्ण झाली आहे असे सांगणारा तोच स्वयंचलित प्रतिसाद मिळाला तर ही पूर्णपणे वेगळी बाब आहे. ही आता औपचारिकता राहिलेली नाही.

साइटवर खरेदीदारांच्या वर्तनाचे एक विशिष्ट मॉडेल आहे, जे सामान्य ऑनलाइन स्टोअरद्वारे विकसित केले गेले आहे आणि जवळजवळ कोणताही खरेदीदार ऑर्डर पूर्ण करण्यासाठी परिचित "कार्टमध्ये जोडा" बटण शोधेल आणि नंतर कार्ट स्वतःच ऑर्डर पूर्ण करेल. एखादे उत्पादन खरेदी करण्यासाठी ऑर्डर फॉर्म असणे हे सामान्य खरेदीदाराच्या वर्तनापासून दूर जाणे आहे आणि अनिश्चित प्रतिक्रिया निर्माण करू शकते (अडचणीपासून साइट सोडण्यापर्यंत)

आज तुम्ही तुमच्या वर्डप्रेस वेबसाइटवर कॉल रिक्वेस्ट फॉर्म कसा सहज तयार करायचा ते शिकाल. कॉल ऑर्डर फॉर्मच्या ऑपरेशनचे सिद्धांत: “वापरकर्ता कॉल ऑर्डर फॉर्ममध्ये त्याचा डेटा सोडतो (उदाहरणार्थ, नाव आणि फोन नंबर), पाठवा बटणावर क्लिक करतो. पाठवल्यानंतर, एक सूचना दिसेल - धन्यवाद! तुमची ऑर्डर पाठवली गेली आहे, आम्ही तुमच्याशी संपर्क करू!” तुमच्या वेबसाइटवर कॉल ऑर्डर केलेल्या व्यक्तीचे नाव आणि फोन नंबर असलेले एक पत्र तुमच्या ईमेलवर पाठवले जाईल. तुम्हाला फक्त या व्यक्तीला परत कॉल करायचा आहे.

आम्हाला काय हवे आहे? आम्हाला एक प्लगइन आवश्यक आहे - इतकेच. प्लगइन स्थापित आणि सक्रिय करा संपर्क फॉर्म 7. तुम्ही प्लगइन थेट ॲडमिन पॅनलवरून इंस्टॉल करू शकता, येथे: प्लगइन्स – नवीन जोडा. शोध फॉर्ममध्ये प्लगइनचे नाव प्रविष्ट करा, एंटर दाबा, प्लगइन स्थापित करा आणि सक्रिय करा.

पुढे, प्लगइन स्थापित आणि सक्रिय केल्यानंतर, "संपर्क फॉर्म 7" पृष्ठावर जा. येथे तुमच्याकडे आधीच एक डीफॉल्ट तयार असेल संपर्क फॉर्म. टॅबवरील फॉर्मच्या नावाखाली क्लिक करा - संपादित करा.

उघडणाऱ्या विंडोमध्ये, फक्त "इन्सर्ट टॅग" बटणावर क्लिक करा. फील्ड नावासह कोड कॉपी करा आणि "फोन" शॉर्टकोडच्या वर पेस्ट करा. कोडमध्ये, फील्डचे नाव "तुमचा फोन" मध्ये बदला. तुमचे बदल जतन करा.

पुढे, तुमच्या ईमेलवर पाठवले जाणारे पत्र कॉन्फिगर करण्यासाठी "पत्र" पृष्ठावर जा. तुमचा ईमेल "टू" फील्डमध्ये दर्शविला जाणे आवश्यक आहे. “विषय” फील्डमध्ये, उदाहरणार्थ सूचित करा – “कॉल ऑर्डर करा”! “ईमेल बॉडी” फील्डमध्ये, सर्वकाही हटवा आणि दोन विशेष टॅग जोडा, त्याऐवजी नाव आणि फोन नंबर पत्रात प्रदर्शित केला जाईल. पृष्ठाच्या शीर्षस्थानी, “अक्षर” शीर्षकाखाली टॅग कॉपी केले जाऊ शकतात. नाव आणि फोनच्या आधी टॅग लावले जाऊ शकतात. तुमचे बदल जतन करा.

फॉर्म तयार करणे कठीण आणि वेळ घेणारे आहे. हे स्पष्टपणे एक क्रियाकलाप नाही ज्यासाठी तुम्हाला संपूर्ण कामकाजाचा दिवस घालवायचा आहे. मूलभूतपणे, फॉर्म लागू करण्यासाठी वापरले जातात अभिप्रायवेबसाइटवर आणि लीड जनरेशन मध्ये लँडिंग पृष्ठ. अधिक जटिल आकारअनेकदा कोणत्याही प्रश्नावली, सर्वेक्षण इ. तयार करण्यासाठी वापरले जाते. अशा परिस्थितीत जिथे अनेक फील्ड आवश्यक असतात, सेटिंग सर्व्हर स्क्रिप्टखूप मौल्यवान वेळ लागेल. सास सेवा बचावासाठी येतात. त्यांच्या मदतीने, अंगभूत कन्स्ट्रक्टर वापरुन, आपण तयार करू शकता कमीत कमी वेळशिवाय कोणत्याही जटिलतेचे स्वरूप विशेष प्रयत्न. आपण सोपे मार्ग शोधत नसल्यास, मी फॉर्म तयार करण्यासाठी स्क्रिप्ट वापरण्याचा सल्ला देतो, जे पूर्वी प्रकाशित झाले होते.
बर्याच लोकांना विश्वासार्ह आणि तयार करायचे आहे सोयीस्कर वेबपटकन फॉर्म, आणि स्पष्टपणे हाताने नाही. असे दिसून आले की या कार्यासाठी विशेषतः विकसित केलेल्या डिझाइनरचा वापर करून फॉर्म तयार करणे खूप सोपे आणि वेगवान आहे. ते काही क्लिकमध्ये उपयुक्त आणि चांगल्या प्रकारे डिझाइन केलेले प्रकल्प तयार करण्यास सक्षम आहेत. खरे आहे, काही विकासक त्यांच्या संसाधनाचा वापर करण्यासाठी शुल्क आकारतात, परंतु ते सहसा फायदेशीर असते. याव्यतिरिक्त, ते इतके मोठे नाही की ते विशेषतः आपल्या बजेटवर परिणाम करेल. आम्ही तुमचा थोडासा वेळ वाचवण्याचा निर्णय घेतला आणि 13 सर्वोत्कृष्ट यादी संकलित केली ऑनलाइन कन्स्ट्रक्टर ov फॉर्म मोठ्या संख्येने कार्यांसह संपन्न आहेत.

Google Forms नक्की Google फॉर्म- हे सर्वोत्तम आहे आणि लोकप्रिय सेवा. या विनामूल्य कन्स्ट्रक्टरफॉर्म आपोआप परिणाम ठेवतात स्प्रेडशीटवापरकर्त्याच्या उत्तरानंतर. आवश्यक फॉर्म तयार करणे हॉट कीच्या उपस्थितीमुळे आणि आपल्यामधील बदल जतन करून सोपे केले आहे वैयक्तिक सेटिंग्ज. हे सर्व समस्यांशिवाय आमंत्रणे पाठविण्यास मदत करते योग्य लोकांसाठी, नेहमीप्रमाणे उत्तरे द्या ई-मेलकिंवा मध्ये सामाजिक नेटवर्कमध्ये.

Wufoo ही सेवा सर्वोत्तम ऑनलाइन वेब फॉर्म डिझायनर्सपैकी एक आहे, जी तुमच्या सर्व समस्या काही मिनिटांत सोडवू शकते. तुम्ही कंपनीत सेक्रेटरी आहात की माहिती तंत्रज्ञान तज्ञ, Wufoo तुम्हाला कोडची ओळ न लिहिता पटकन डेटा गोळा करण्यात मदत करते.

FormstackFormstack वेब वापरकर्त्यांसाठी एक उत्कृष्ट ऑनलाइन वेब फॉर्म बिल्डर आहे, सर्व ऑप्टिमायझेशन वैशिष्ट्यांसह सुसज्ज आहे. तो तुमच्या सर्व विपणन कल्पना अंमलात आणण्यास सक्षम आहे. या वेब फॉर्म बिल्डरमध्ये मॅन्युअली कोड टाइप करण्याची गरज नाही. हा कार्यक्रमवापरकर्त्याच्या सॉफ्टवेअरच्या विशेष ज्ञानाशिवाय तुम्हाला तुमच्या वैयक्तिक संसाधनामध्ये फॉर्म समाकलित करण्याची अनुमती देते.

iFormbuilderFormBuilde आहे अद्वितीय सेवा, आधारित क्लाउड संगणनते जगभरातील ग्राहकांना मोबाइल डिव्हाइसवरून डेटा संकलित करण्यास सक्षम आहे. याव्यतिरिक्त, हा फॉर्म बिल्डर ॲप्लिकेशन फॉर्म, टेस्टिंग फॉर्म, ऑर्डर फॉर्म आणि सबस्क्रिप्शन यासारखे घटक तयार करू शकतो. वापरकर्ते डेटा प्रविष्ट करू शकतात आणि अगदी जाता जाता बरेच पॅरामीटर्स बदलू शकतात. या परिपूर्ण साधनतुमच्या कामासाठी.

FormbakeryIt दिले आहे, पण खूप कार्यक्षम सेवासाधे तयार करण्यासाठी आणि द्रुत फॉर्म. आपल्यासाठी काय आवश्यक आहे ते कार्यक्षेत्रात ड्रॅग करणे आवश्यक घटक(मजकूर ब्लॉक, निवड बटणे आवश्यक पर्याय, चेकबॉक्सेस इ.), आणि तुम्हाला तयार केलेला फॉर्म जिथे पाठवायचा आहे तो पत्ता प्रविष्ट करा. तुम्ही प्रोजेक्टमध्ये वापरत असलेला व्युत्पन्न केलेला कोड वाचण्यास सोपा आहे, जणूकाही रोबोटने नाही तर एखाद्या व्यक्तीने लिहिलेला आहे.

FormDesk हे संसाधन तुम्हाला तुमचे स्वतःचे फॉर्म तयार करण्याची परवानगी देते, जसे की प्रश्नावली, नोंदणी फॉर्म आणि विविध अभ्यासांचे निकाल. मग तुम्ही ते इंटरनेट साइटवर पोस्ट करू शकता, सोशल नेटवर्क्सवर किंवा ईमेलमध्ये वापरू शकता. फॉर्मडेस्क फॉर्म येथे आहेत स्वतःचा सर्व्हरआणि हायपरलिंक किंवा फ्रेम वापरून सहज प्रवेश केला जाऊ शकतो.

ReformedReformed एक मुक्त आणि विनामूल्य फॉर्म बिल्डर आहे ज्याचे डिझाइन सुंदर आहे, ते आपल्याला खूप लवकर अंमलात आणण्यास आणि भिन्न तयार करण्यास अनुमती देते उपयुक्त प्रकल्पतुमच्या वेबसाइटसाठी.

Typeformअन्य एक विनामूल्य ऑनलाइन फॉर्म बिल्डर जो वापरकर्ता-अनुकूल आहे. कामासाठी जे आवश्यक आहे साधी नोंदणीतुमच्या खात्यात, Typeform ला कोणत्याही अतिरिक्त निधीची आवश्यकता नाही.

FormsSmartsहे ऑनलाइन फॉर्म बिल्डर तुम्हाला तयार करण्याची परवानगी देतो उत्कृष्ट आकारआणि त्यांना प्रकाशित करा. या सेवेचे निर्माते वर्ल्ड वाइड वेबच्या वापरकर्त्यांसह फॉर्म सामायिक करण्याचे आणि त्यांच्याकडून प्रतिसाद प्राप्त करण्याचे अनेक मार्ग प्रदान करतात. बहुतेक क्लायंट त्यांना त्यांच्या स्वतःच्या संसाधनावर स्थापित करतात आणि ईमेलद्वारे प्रतिसाद फॉर्म किंवा एक्सेल अहवालात आधीच सारणीबद्ध केलेल्या प्रतिसादांची मालिका प्राप्त करतात.

MatchFormMachForm हे एक व्यावसायिक दर्जाचे संसाधन आहे जे तुम्हाला जास्तीत जास्त सुसंगततेसह फॉर्म तयार करण्यास अनुमती देते. हे केवळ साठीच काम करत नाही डेस्कटॉप संगणक, परंतु बहुतेक मोबाईल फोनवर काम करण्यासाठी देखील योग्य/ स्पर्श साधने(, Android डिव्हाइसेस). फॉर्म बिल्डरच्या सर्व नवीन आवृत्त्या ड्रॅग-अँड-ड्रॉप वापरून फॉर्म तयार करणे सोपे करतात आणि अजिबात कोडिंग नाही. हे प्रमुख पेमेंट सिस्टम (PayPal, Authorize.net, Stripe, Braintree) सह एकत्रित केले आहे. फक्त काही क्लिकमध्ये, वापरकर्ता एक सुंदर फॉर्म तयार करेल आणि ऑनलाइन ऑर्डर सबमिट करण्यास किंवा पेमेंट स्वीकारण्यास सक्षम असेल.

नमस्कार प्रिय वाचकांनो, आज मी तुम्हाला वापरकर्त्याची संपर्क माहिती मिळवण्यासाठी फॉर्म कसे तयार करतो याबद्दल सांगू इच्छितो.

आज, , लँडिंग पृष्ठ संरचनेचा भाग आहे. शेवटी, पूर्वी अभ्यागताचा ई-मेल प्राप्त करून, ऑर्डर स्वीकारण्याचा किंवा आपल्या उत्पादनांचा कॅटलॉग पाठविण्याचा हा एक मार्ग आहे.

फीडबॅक फॉर्म तयार करणे - html मार्कअप

मला सहसा तीन फील्डची आवश्यकता असते आणि बर्याच बाबतीत, मी संपर्क फॉर्म तयार करण्यासाठी हा मार्कअप वापरतो:

किंमत मिळवा

ते तुमच्या ब्राउझरमध्ये उघडण्याचा प्रयत्न करा हा कोडआणि तुम्ही कोणता इंटरनेट ब्राउझर वापरता यावर अवलंबून, तुम्हाला काय मिळते ते पहा, ते असे काहीतरी दिसले पाहिजे:

आपल्याला मार्कअपबद्दल काही प्रश्न असल्यास, टिप्पण्यांमध्ये त्यांना मोकळ्या मनाने विचारा, मी तपशीलवार उत्तर देण्याचा प्रयत्न करेन आणि मी लेखातील प्रत्येक घटकाचे वर्णन करणार नाही जेणेकरून त्याचा आकार वाढू नये. याव्यतिरिक्त, घटक अगदी सोपे आहेत.


फीडबॅक फॉर्म तयार करणे - css मार्कअप

चला आपला फॉर्म स्टाईल करूया आणि तो आणूया वाचनीय फॉर्म:

/* फॉर्म शैली */ #अनुप्रयोग (रुंदी: 475px; समास: 0 ऑटो; ) /* इनपुट फील्ड शैली */ #applicationName, #applicationEmail, #applicationTelephone (रुंदी: 100%; उंची: 73px; पार्श्वभूमी: काहीही नाही; समास - शीर्ष: 25px; मजकूर संरेखित: केंद्र; 24px; */ ::-वेबकिट-इनपुट-प्लेसहोल्डर ( रंग: #efefef; फॉन्ट-फॅमिली: "PT Sans", sans-serif; मजकूर-छाया: 0 1px 1px rgba(0, 0, 0, .3); ): :-moz-प्लेसहोल्डर ( रंग: #fff; फॉन्ट-फॅमिली: "PT Sans", sans-serif; मजकूर-छाया: 0 1px 1px rgba(0, 0, 0, .3); /* Firefox 19+ */ :-moz-प्लेसहोल्डर ( रंग: #fff; फॉन्ट-फॅमिली: "PT Sans", sans- serif; मजकूर-छाया: 0 1px 1px rgba(0, 0, 0, .3); /* Firefox 18- */ :-ms-इनपुट-प्लेसहोल्डर ( रंग: #fff; फॉन्ट-फॅमिली: "PT Sans" , sans-serif; मजकूर-छाया: 0 1px 1px rgba(0, 0, 0, .3); ); सीमा: 73px; रंग: "PT Sans", .applicationButton:hover;

तुम्हाला बटणाचा रंग सहजतेने बदलायचा असल्यास, खालील ओळ .applicationButton आणि .applicationButton:hover वर जोडा:

संक्रमण: .6s;

जेथे.6s हा ॲनिमेशन वेळ मिलिसेकंदांमध्ये आहे.
आता आमचा फॉर्म प्राप्त झाला आहे सुंदर दृश्य, आता हे असे दिसते:

फीडबॅक फॉर्म तयार करणे - php मार्कअप

आता आपल्याला application.php फाईल तयार करायची आहे. ते फॉर्ममधून प्रविष्ट केलेले पॅरामीटर्स प्राप्त करेल आणि ते आम्हाला ईमेलद्वारे पाठवेल.

त्याची रचना नेहमीप्रमाणे आहे html फाइल, हे एक पृष्ठ असू शकते ज्यावर तुम्ही लिहा “धन्यवाद, तुमचा अर्ज स्वीकारला गेला आहे. अर्जावर प्रक्रिया केल्यानंतर आमचे व्यवस्थापक तुमच्याशी संपर्क साधतील"

म्हणजेच, जेव्हा वापरकर्ता बटणावर क्लिक करतो तेव्हा त्याला application.php पृष्ठावर पुनर्निर्देशित केले जाईल. हे एक पूर्ण पृष्ठ आहे आणि आपण त्यानुसार शैली करावी.