PHP के साथ स्वचालित वेब पेज निर्माण

जीवन में कुछ ऐसे समय होते हैं जब आपको एक वेब पेज की आवश्यकता होती है, ताकि आप एक वेब पेज होने के बजाय कुछ और कर सकें। इसकी रखवाली करने के लिए आपको इसकी आवश्यकता है। ऐसा करने का एक तरीका यह है कि आप इसे काम करने के लिए रखें, इसलिए आपको हर अपडेट या पेज मॉड पर कोड नहीं डालना होगा। इस तरह से कुछ करना सीखने का सबसे आसान तरीका वास्तव में यह कर रहा है, इसलिए इस लेख के बाकी हिस्सों में, मैं आपको एक प्रणाली लागू करने का एक तरीका दिखाने जा रहा हूं जो आपके लिए स्पर्श के दौरान नए वेब पेज बनाएगा एक बटन।

इस परिदृश्य में, हम मानेंगे कि आपका ग्राहक एक ऐसा रेस्तरां है जो पूरे वर्ष में विभिन्न विशेष अवसरों के लिए वाउचर देना चाहता है। लेकिन निश्चित रूप से वे आपको उनके लिए इसे अपडेट करने के लिए भुगतान नहीं करना चाहते हैं, इसलिए आप इस स्वचालन प्रणाली के लिए उन्हें पर्याप्त रूप से बिल देना सुनिश्चित करेंगे जो उनके लिए अपडेट करेंगे।

1। पहले हमें एक बेसिक वेब पेज टेम्पलेट बनाने की आवश्यकता है।

यह सिर्फ एक मानक वेब पेज कंकाल है। आप इसे "pageBuilder.php" या कुछ और नाम दे सकते हैं। इसके लिए आपको PHP का उपयोग करने की आवश्यकता नहीं है। आप एक अन्य प्रोग्रामिंग भाषा का उपयोग कर सकते हैं, लेकिन इस उदाहरण के लिए हम चीजों को सरल रखेंगे और यह सब PHP में करेंगे।

पर 2016 05-30-1.56.52 AM स्क्रीन शॉट

2। बूटस्ट्रैप जोड़ें

यह बिना किसी अतिरिक्त काम के रूप को बेहतर दिखाने में मदद करेगा। बेशक आपको इस काम के लिए बूटस्ट्रैप की आवश्यकता होगी।

पर 2016 05-30-1.56.56 AM स्क्रीन शॉट

3। एक कंटेनर सेट करें

सब कुछ साफ सुथरा रखने में मदद करने के लिए, हमें एक कंटेनर को परिभाषित करना चाहिए जिसे हम पृष्ठ की सामग्री में संग्रहीत करेंगे।

पर 2016 05-30-1.56.48 AM स्क्रीन शॉट

4। एक वेब फॉर्म बनाएँ

वेब फ़ॉर्म को परिभाषित करें, और हम फॉर्म में एक फैंसी शीर्षक भी जोड़ेंगे, जो वैकल्पिक है लेकिन एक अच्छा विचार है।

पर 2016 05-30-1.56.43 AM स्क्रीन शॉट

5। प्रपत्र फ़ील्ड जोड़ें

यह वास्तव में सरल है। हमें बस कुछ बुनियादी विवरण एकत्र करने की आवश्यकता है जो रोबोट एक नया वेब पेज बनाने के लिए उपयोग करेगा। हमें जो डेटा जानना है उसमें शामिल हैं:

  • पृष्ठ के लिए पृष्ठभूमि छवि
  • मनाई जा रही घटना का नाम
  • शीर्षक
  • उद्घाटन वक्तव्य
  • कुछ ट्राइट उद्धरण या अतिरिक्त बयान
  • ट्रिट उद्धरण के लिए गुण
  • फ़ॉन्ट शैली चार फ्रेमन पाठ तत्वों (व्यक्तिगत रूप से) में से प्रत्येक के लिए उपयोग करने के लिए।
  • दिनांक सीमा जो वाउचर के लिए मान्य होगी
  • 1 ऑफ़र करें और 2 ऑफ़र करें जो वाउचर पर विज्ञापित किया जाएगा।
  • अतिरिक्त वाउचर संदेश (नियम और शर्तें, उदाहरण के लिए)
  • वाउचर क्यूआर कोड के लिए डेटा जो उत्पन्न होगा

यहाँ है कि कैसे दिखता है:

पर 2016 05-30-1.56.00 AM स्क्रीन शॉट

पर 2016 05-30-1.55.54 AM स्क्रीन शॉट

पर 2016 05-30-1.55.36 AM स्क्रीन शॉट

और इस सारे प्रयास के बाद, हम एक ऐसे पेज को समाप्त करेंगे जो कुछ इस तरह दिखता है:

पर 2016 05-30-1.55.22 AM स्क्रीन शॉट

अच्छी खबर यह है कि आधा काम अब पूरा हो गया है, और यह सबसे कठिन और समय लेने वाला आधा था। बाकी बहुत आसान है।

6। प्रपत्र प्रोसेसर फ़ाइल बनाएँ

फॉर्म बनाने के बाद, आपको कुछ सॉफ़्टवेयर की आवश्यकता होती है जो सबमिट किए गए डेटा को संसाधित करेंगे और इसके साथ कुछ करेंगे। इस मामले में, हम एक नया जनरेट करने के लिए सबमिट किए गए डेटा का उपयोग करेंगे एचटीएमएल पृष्ठ।

अब, ध्यान रखें कि यह सामान्य PHP प्रतिक्रिया के समान नहीं है जहां डेटा का वास्तविक समय में उपयोग किया जाता है और उपयोगकर्ता को गतिशील रूप से परिलक्षित होता है। इसके बजाय, हम एक स्थैतिक पेज बना रहे हैं जो स्थायी रूप से तब तक मौजूद रहेगा जब तक हम इसे अधिलेखित नहीं कर देते।

फ़ाइल का नाम उसी के समान होना चाहिए कार्य फॉर्म घोषणा में विशेषता मूल्य, इसलिए हमारे उदाहरण में यह होगा voucherGen.php, और क्योंकि हमने कोई पथ निर्दिष्ट नहीं किया था, इसलिए इसे उसी स्थान पर संग्रहीत करना होगा pageBuilder.php इसके लिए काम करना है।

7। आरंभिक चर

से डेटा प्रस्तुत किया pageBuilder.php एक साहचर्य सरणी के रूप में लौटा था जिसे कहा जाता है $ _ पोस्ट, और सरणी में सभी डेटा मानों को उनके HTML फॉर्म नियंत्रण के माध्यम से एक्सेस किया जा सकता है नाम जिम्मेदार बताते हैं। इसलिए हमारे चर को शुरू करना वास्तव में काफी आसान है। यह वैकल्पिक भी है, लेकिन यह सिर्फ कोड को थोड़ा अधिक स्पष्ट और पढ़ने में आसान बनाता है। आप निश्चित रूप से सीधे काम कर सकते हैं $ _ पोस्ट मान यदि आप पसंद करते हैं।

पर 2016 05-30-1.55.15 AM स्क्रीन शॉट

8। फोंट को उनके सही मानों में बदलने के लिए सशर्त का उपयोग करें

ऐसा करने से समय और मुसीबत बाद में बचेंगे। हम केवल यह जांचते हैं कि कौन से मान चुने गए और फिर उन्हें वास्तविक फ़ॉन्ट नामों से बदल दिया गया।

पर 2016 05-30-1.55.10 AM स्क्रीन शॉट9. जनरेटर स्ट्रिंग का निर्माण

वास्तव में हम सभी को यहाँ करने की ज़रूरत है एक बहुत लंबी स्ट्रिंग बनाएं जिसमें नया पृष्ठ बनाने के लिए आवश्यक सब कुछ होगा। हम इसे पढ़ने योग्य बनाए रखने के लिए स्ट्रिंग डेटा का उपयोग करेंगे और यह देखना आसान बनाएंगे कि डेटा मान कहां डाले गए हैं। यह मूल HTML पेज के साथ शुरू होता है:

पर 2016 05-30-1.55.06 AM स्क्रीन शॉट

आप शायद देख सकते हैं कि हम इसके साथ कहाँ जा रहे हैं। अंत में अर्ध-कोलन पर ध्यान दें। वह महत्वपूर्ण है। पाठ के भीतर होने वाली कोई भी अर्ध-कॉलन (सीएसएस घोषणा या क्लाइंट-साइड स्क्रिप्ट के भाग के रूप में) उद्धरण चिह्नों के अंदर होनी चाहिए।

10। जेनरेटर स्ट्रिंग में पेज बॉडी को जोड़ना शुरू करें

इस स्ट्रिंग को बनाने के लिए और अधिक कुशल तरीके हैं, लेकिन मुझे कोड को साफ करना पसंद है, ताकि इसे पढ़ना आसान हो। आप ऐसा करने के लिए शॉर्ट हैंड मेथड्स का उपयोग कर सकते हैं, और आपको 9 को चरणबद्ध करने की एक अलग प्रक्रिया के रूप में भी करने की आवश्यकता नहीं है। मुझे लगता है कि यह समझना आसान है जब पृष्ठ के विभिन्न खंड इस तरह विभाजित होते हैं।

पर 2016 05-30-1.55.00 AM स्क्रीन शॉट

11। एक HTML के लिए जनरेटर स्ट्रिंग लिखें

इस मामले में हम फ़ाइल नाम को हार्ड-कोडिंग कर रहे हैं, लेकिन आप इसे (और शायद) अपने पेजब्यूइलर फॉर्म में एक क्षेत्र बना सकते हैं।

पर 2016 05-30-1.54.55 AM स्क्रीन शॉट

12। एक परीक्षण लिंक जोड़ें

जब आप BUILD IT बटन पर क्लिक करते हैं, क्योंकि यह एक सामान्य पीएचपी प्रोग्राम जैसे वेब पेज पर रीडायरेक्ट नहीं होता है, तो आपको एक लिंक या कुछ और जोड़ने की जरूरत होती है ताकि आप देख सकें कि परिणाम क्या था।

पर 2016 05-30-1.54.50 AM स्क्रीन शॉट

13। कस्टम CSS फ़ाइल बनाएं

आप इस फ़ाइल में अतिरिक्त स्टाइल निर्देश संग्रहीत कर सकते हैं, लेकिन अभी के लिए एकमात्र महत्वपूर्ण स्टाइल निर्देश है मुख्य div.

पर 2016 05-30-1.54.45 AM स्क्रीन शॉट

14। लपेटें और अपलोड करें

इसे ठीक से काम करने के लिए, आपको एक एकल पारभासी पिक्सेल छवि बनाने और उसे नाम देने की आवश्यकता है wrap.png फिर इसे आपके द्वारा निर्दिष्ट पथ पर अपलोड करें कस्टम सीएसएस फ़ाइल.

15। कुछ उपयुक्त पृष्ठभूमि चित्र अपलोड करें और अपने पृष्ठ का परीक्षण करें

आप यह जानकर रोमांचित हो जाएंगे कि हम लगभग पूरी हो चुके हैं, और वास्तव में अब यह केवल परीक्षण की बात है और इसमें होने वाली किसी भी त्रुटि को ठीक कर रहा है। कुछ अच्छी साधारण छवियां चुनें जो बहुत व्यस्त नहीं हैं और जो विशेष घटनाओं या अवसरों (हमारे उदाहरण में, मैं मदर्स डे और फादर्स डे के साथ गई हूं) से संबंधित हैं। छवियों को उस पथ पर अपलोड करें जहाँ आप अपनी छवियों को अपनी वेबसाइट के लिए संग्रहीत करते हैं। फिर फॉर्म भरें, बटन पर क्लिक करें, और देखें कि क्या होता है। यहां सभी डेटा फ़ील्ड के साथ फ़ॉर्म का एक उदाहरण दिया गया है।

Picture1

जो इस के समान कुछ बनाने में परिणाम होना चाहिए:

पर 2016 05-30-1.54.11 AM स्क्रीन शॉट

हमने पहले ही अनुमान लगा लिया है कि आप स्क्रैच से वह सब टाइप नहीं करना चाहेंगे, इसलिए आप इस पेज के लिए सोर्स कोड डाउनलोड कर सकते हैं। Builder.php और voucherGen.php ज़िप फ़ाइल.

आप HTML फ़ाइलों को स्ट्रिंग्स के रूप में बनाने की इस तकनीक को लागू कर सकते हैं और फिर उन्हें सभी प्रकार की स्थितियों में फ़ाइलों को लिख सकते हैं। बस सावधान रहना होगा कि इस तरह के एक पुनरावर्ती लूप में कुछ न डालें या आप अपनी हार्ड ड्राइव को भर देंगे और सर्वर को क्रैश कर देंगे।

कैटालिन ज़ोरज़िनी

मैं एक वेब डिज़ाइन ब्लॉगर हूँ और यह पता लगाने के लिए संघर्ष कर रहा हूँ कि कुछ हफ़्ते बिताने के बाद इस प्रोजेक्ट को शुरू किया सबसे अच्छा ईकॉमर्स प्लेटफॉर्म मेरे लिए। मेरे वर्तमान की जाँच करें शीर्ष 10 ई-कॉमर्स साइट बिल्डरों.