स्क्रैच से वेबसाइट कैसे कोडित करें (शुरुआती गाइड)

वर्डप्रेस साइट को कैसे कोड करें


खरोंच से एक वेबसाइट कोड करना चाहते हैं? उस के लिए, आप एक साइट डिजाइन करने के लिए थकाऊ कोडिंग भाषाओं में महारत हासिल करने के बारे में सोचकर भयभीत महसूस कर सकते हैं जो जैसा दिखता है उसके लिए कार्य करता है.

सौभाग्य से, वर्डप्रेस किसी को भी बहुत अधिक लचीलापन प्रदान करता है, जो एक ऐसी वेबसाइट बनाना चाहता है जो शानदार दिखती है, जिसमें शक्तिशाली विशेषताएं हैं, और इसके लिए जटिल कोडिंग ज्ञान की आवश्यकता नहीं है.

इसलिए यदि आप किसी वेबसाइट को स्क्रैच से कोड करना चाहते हैं, लेकिन कोडिंग में मास्टर नहीं हैं, तो यह पोस्ट आपके लिए है। क्योंकि इस ट्यूटोरियल को पढ़ने के बाद आप जानेंगे कि एक दिन से कम समय में प्रो जैसी वेबसाइट कैसे डिज़ाइन होती है.

और न केवल यह मार्गदर्शिका आपको वेबसाइट डिजाइन करने का सबसे आसान तरीका सिखाएगी, बल्कि यह आपको समय, ऊर्जा और सिरदर्द से भी बचाएगी।.

लेकिन अगर आप अभी भी इस बारे में अनिश्चित हैं कि क्या किसी वेबसाइट को स्क्रैच से कोड करना या वर्डप्रेस के साथ निर्माण करना बेहतर है, तो यहां कुछ बिंदु दिए गए हैं जो आपको अपना निर्णय लेने में मदद करेंगे.

क्या आपको वास्तव में एक वेबसाइट कोड करनी चाहिए?

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

  • नई भाषाएँ सीखना समय-उपभोक्ता है: कई प्रोग्रामिंग भाषाएं हैं जिन्हें आपको अपनी वेबसाइट बनाने के लिए सीखने की आवश्यकता हो सकती है। HTML और CSS दो मूल बातें हैं जिन्हें आप बिल्कुल अनदेखा नहीं कर सकते। और यदि आप उन्नत विकल्प चाहते हैं, तो आप अपनी सूची में और भाषाएँ जोड़ सकते हैं, जैसे jQuery, जावास्क्रिप्ट और PHP। इसका मतलब है कि आपको अपना अंतिम उत्पाद लाने के लिए कई भाषाओं में महारत हासिल करने की आवश्यकता है। जब तक आपको अपने बेल्ट के तहत बहुत सारे कोडिंग ज्ञान नहीं होते हैं, आपकी वेबसाइट को दिनों के बजाय बनाने में महीनों लग सकते हैं.
  • सही संसाधन खोजना मुश्किल है: क्या अधिक चुनौतीपूर्ण है कि इंटरनेट जानकारी से भरा हुआ है। इससे आपके द्वारा अधिक भ्रमित होने की संभावना बढ़ जाती है क्योंकि आप नई कोडिंग भाषा सीखने की कोशिश करते हैं। इससे निर्देशित पाठ्यक्रमों में दाखिला लेने के लिए कुछ नए कोडर बनते हैं, जो महंगे हो सकते हैं.
  • अप्रत्याशित समस्याओं के लिए योजना बनाना असंभव है: यहां तक ​​कि अगर आप उन सभी चुनौतियों को दूर करते हैं और अंत में एक सुंदर वेबसाइट बनाते हैं, तो अधिक चुनौतियां समय के साथ दिख सकती हैं। उदाहरण के लिए, यदि आप अपनी साइट में साइडबार जोड़ना चाहते हैं या कुछ पृष्ठों के लिए अपनी साइट की पृष्ठभूमि बदलना चाहते हैं, तो आप समाधान सीखने के अपने समय के दिनों को बर्बाद कर सकते हैं।.

इतनी सारी बाधाओं को दूर करने के लिए, केवल आप ही तय कर सकते हैं कि आप किसी साइट को स्क्रैच से कोड करना चाहते हैं या नहीं। यदि आप कई वेबसाइट बिल्डरों की तरह हैं, तो आप अन्य विकल्पों पर विचार कर सकते हैं.

क्या एक आसान विकल्प है?

सबसे अच्छा जवाब एक वर्डप्रेस वेबसाइट बिल्डर के साथ एक वेबसाइट को कोड करना है.

एक वेबसाइट बिल्डर क्या है?

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

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

बीवर बिल्डर के साथ शुरू करते हैं.

विधि 1: वर्डप्रेस + बेवर बिल्डर के साथ एक वेबसाइट कोडिंग

बीवर निर्माता अनुकूलित-वर्डप्रेस

चरण 1. बीवर बिल्डर को स्थापित करना और सक्रिय करना

बीवर बिल्डर के साथ एक वेबसाइट को कोड करने के लिए, आपको सबसे पहले वर्डप्रेस इंस्टॉल करना होगा। फिर अपने वर्डप्रेस डैशबोर्ड से, बीवर बिल्डर प्लगइन को स्थापित और सक्रिय करें। एक बार जब आप अपनी वेबसाइट डिजाइन करने के लिए इसका उपयोग करना शुरू कर सकते हैं.

यहाँ है कि कैसे काम करता है:

वापस जाओ पेज »नया जोड़ें अपने वर्डप्रेस डैशबोर्ड में। अब आप देखेंगे कि गुटेनबर्ग संपादक आपको बीवर बिल्डर प्लगइन लॉन्च करने का विकल्प देता है.

बीवर बिल्डर

पर क्लिक करें बिल्डर बीवर लॉन्च करें.

यह बीवर बिल्डर विजुअल एडिटर लॉन्च करेगा जहां आप अपने डिजाइन पर काम कर सकते हैं। अपने दाईं ओर, आप पंक्तियों, मॉड्यूल और टेम्पलेट को जोड़ने के विकल्प देखेंगे। इसके पास एक टैब भी है बचाया जहां आप अपने पहले से सहेजे गए सभी टेम्पलेट देख सकते हैं.

बीवर बिल्डर, वेबसाइट कोड कैसे करें

चरण 2: अपनी वेबसाइट के लिए एक टेम्पलेट का चयन करना

अगला कदम अपने डिजाइन के लिए एक टेम्पलेट बनाना है। आप पर क्लिक करके एक टेम्पलेट का चयन कर सकते हैं टेम्पलेट्स अपने अधिकार पर टैब करें.

बीवर बिल्डर टेम्प्लेट, एक वेबसाइट को कैसे कोड करें

यहां आपको विभिन्न पूर्व-निर्मित टेम्पलेट दिखाई देंगे। आपके पास एक खाली टेम्प्लेट विकल्प भी होगा जिसे आप अधिक कस्टम लुक बनाने के लिए उपयोग कर सकते हैं.

इसके अलावा, बिल्डर बीवर अपने लैंडिंग पृष्ठों के लिए अलग विकल्प प्रदान करता है। इन पूर्व-निर्मित टेम्पलेट्स में से एक का चयन करके आप तुरंत शुरू कर सकते हैं। यह केवल पाठ, लोगो, टैगलाइन, और इसी तरह के विभिन्न तत्वों को अनुकूलित करने के लिए कुछ मोड़ लेता है.

चरण 3: पंक्तियों और मॉड्यूल को अपने लेआउट में जोड़ना

यह कदम आवश्यक है यदि आप अपने डिजाइन को खरोंच से बनाना चाहते हैं। या, आप पूर्व-निर्मित टेम्पलेट में भी पंक्तियों और स्तंभों को जोड़ सकते हैं.

अपने डिजाइन में पंक्तियों को जोड़ने के लिए बस का चयन करें पंक्तियाँ टैब और उन पंक्तियों की संख्या का चयन करें जिन्हें आप जोड़ना चाहते हैं। अब अपनी पंक्तियों को खींचें और उन्हें अपनी बाईं ओर छोड़ें। आप उनकी उपस्थिति को अनुकूलित करने के लिए इनमें से प्रत्येक टैब पर क्लिक कर सकते हैं.

बीवर बिल्डर लेआउट पंक्तियाँ

इन अनुकूलन विकल्पों का उपयोग करके आप आसानी से अपने कॉलम को स्थानांतरित कर सकते हैं, उन्हें डुप्लिकेट कर सकते हैं, पंक्ति की चौड़ाई समायोजित कर सकते हैं या प्रत्येक कॉलम पर व्यक्तिगत रूप से काम कर सकते हैं। अपने कॉलम संपादित करने के लिए, उस कॉलम पर क्लिक करें जहाँ आप परिवर्तन करना चाहते हैं। फिर पर क्लिक करें स्तंभ संपादित करें आरंभ करने के लिए आइकन। अब आप देखेंगे स्तंभ सेटिंग्स विकल्प.

कॉलम सेटिंग्स बीवर बिल्डर

यहां आप अपने कॉलम में टेक्स्ट, लिंक, बैकग्राउंड-कलर्स, बॉर्डर, एनीमेशन और कई अन्य एलिमेंट्स जोड़ सकते हैं। अब जब पंक्तियों को जोड़ा जाता है, तो आपके मॉड्यूल को जोड़ने का समय आ गया है.

मॉड्यूल जोड़ना आपकी पंक्तियों को जोड़ने के समान सरल है। बस के पास जाओ मॉड्यूल टैब, उस मॉड्यूल को खींचें जिसे आप अपने दाईं ओर से चाहते हैं, और इसे अपनी बाईं ओर छोड़ें.

बीवर बिल्डर में मॉड्यूल जोड़ना

आप इनमें से प्रत्येक मॉड्यूल को कस्टमाइज़ भी कर सकते हैं। उदाहरण के लिए, यदि आप अपनी हेडिंग पर काम करना चाहते हैं, तो आपको केवल अपने हेडिंग मॉड्यूल पर क्लिक करना होगा। आपको 3 अलग टैब के साथ अपनी स्क्रीन पर एक पॉपअप दिखाई देगा.

  1. सामान्य
  2. अंदाज
  3. उन्नत

में सामान्य टैब, आप अपना पाठ संपादित कर सकते हैं, एक शीर्षक टैग जोड़ सकते हैं, लिंक जोड़ सकते हैं, एक “नॉफ़ॉलो” टैग जोड़ सकते हैं, या यदि आप चाहें तो अपने लिंक एक नई विंडो में खोल सकते हैं.

अपने शीर्षक को अनुकूलित करना

अंदाज टैब आपको रंग, फ़ॉन्ट, शैली पर काम करने देता है & रिक्ति, और अधिक.

बीवर बिल्डर अनुकूलन

अंत में, वहाँ उन्नत टैब। इस टैब के तहत, आप रिक्ति जोड़ सकते हैं, दृश्यता को कस्टमाइज़ कर सकते हैं, एनिमेशन जोड़ सकते हैं, HTML एलिमेंट्स डाल सकते हैं, साथ ही अपने लेआउट को निर्यात या आयात कर सकते हैं.

बीवर बिल्डर स्टाइल विकल्प

बस पर क्लिक करने के लिए मत भूलना सहेजें बटन यदि आप अपनी सेटिंग नहीं खोना चाहते हैं.

आप अपनी वेबसाइट पर जोड़े गए सभी मॉड्यूल के साथ प्रक्रिया को दोहरा सकते हैं ताकि आप अपनी वेबसाइट के हर पहलू को अनुकूलित कर सकें। बीवर बिल्डर के साथ आप अपने पेज पर साइडबार, प्राइसिंग टेबल और अन्य तत्व भी जोड़ सकते हैं.

फिर वह सब बाईं ओर आपकी साइट को प्रकाशित कर रहा है.

चरण 4: आपकी वेबसाइट का प्रकाशन

एक बार जब सब कुछ ठीक से जोड़ और अनुकूलित हो जाता है, तो आपके लिए यह समय है प्रकाशित करना आपकी जगह। उसके लिए, आप देखेंगे प्रकाशित करना आपकी स्क्रीन के ऊपरी दाएँ कोने पर बटन.

बीवर बिल्डर लेआउट का प्रकाशन

और बस! अब आपने बीवर बिल्डर के साथ एक कस्टम साइट बनाई है जिसके लिए महंगे कोडिंग कोर्स की आवश्यकता नहीं है या कोडर फ़ोरम के लिए स्लीपिंग नाइट्स की आवश्यकता होती है.

हम बीवर बिल्डर के साथ क्या कर सकते हैं, इसकी मूल बातें खत्म कर चुके हैं, लेकिन आप गहरी गोताखोरी में दिलचस्पी ले सकते हैं। यदि हां, तो आपको यह लेख बीवर बिल्डर के साथ एक कस्टम लेआउट बनाने में मददगार होगा.

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

विधि 2: लगातार संपर्क बिल्डर के साथ एक वेबसाइट कोडिंग

अगली विधि आपकी वेबसाइट को लगातार संपर्क करने वाले वेबसाइट बिल्डर के साथ कोड करना है.

लगातार संपर्क एक ईमेल विपणन सेवा प्रदाता है जो आपकी ईमेल विपणन रणनीतियों को सुव्यवस्थित करता है.

लेकिन यह एक वेबसाइट बिल्डर भी प्रदान करता है जो आपको कोड की एक पंक्ति का उपयोग किए बिना अपने व्यवसाय के लिए पेशेवर वेबसाइट बनाने की सुविधा देता है। अपनी साइट बनाने के लिए इस बिल्डर का उपयोग करने का तरीका देखें.

प्रक्रिया शुरू करने के लिए, आधिकारिक कॉन्स्टैंट संपर्क वेबसाइट बिल्डर पेज पर जाएं और क्लिक करें अपनी फ्री साइट बनाएं आपकी स्क्रीन पर टैब.

लगातार संपर्क वेबसाइट बिल्डर

अब आप एक नई स्क्रीन पर होंगे जहां आपको अपनी वेबसाइट को एक श्रेणी में असाइन करने के लिए कहा जाएगा.

लगातार संपर्क बिल्डर

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

लगातार संपर्क वेबसाइट बिल्डर

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

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

लगातार संपर्क पृष्ठभूमि छवि

अपनी पृष्ठभूमि छवि का चयन करने के बाद, पर क्लिक करें जारी रखें अगले चरण पर जाने के लिए बटन जहाँ आप अपना लोगो अपलोड कर सकते हैं.

उस खाली क्षेत्र पर क्लिक करें जहाँ आपको विकल्प दिखाई देता है अपनी छवि अपलोड करने के लिए क्लिक करें और अपने डेस्कटॉप से ​​अपना लोगो अपलोड करें.

लगातार संपर्क बिल्डर लोगो

फिर मारा जारी रखें अगले चरण पर जाने के लिए बटन। अब आपको अपनी साइट की रंग योजना को चुनना होगा। आपके पास कई विकल्प हैं, सभी 2 विषयों से शुरू होते हैं: लाइट और डार्क। आप अपनी वेबसाइट और ब्रांड के लिए जो भी सबसे अच्छा होगा, चुन सकते हैं.

लगातार संपर्क रंग

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

संपर्क विवरण, निरंतर संपर्क डेमो

अब पर क्लिक करें समाप्त इसके नीचे बटन। आप अपने मुखपृष्ठ, गैलरी और अन्य पृष्ठों का अवलोकन देखेंगे, जिससे यह पुष्टि हो सके कि आप समग्र रूप से संतुष्ट हैं। यदि सब कुछ अच्छा लग रहा है, तो आप आगे बढ़ सकते हैं और हिट कर सकते हैं प्रकाशित करना आपकी स्क्रीन के ऊपरी दाएँ कोने पर बटन.

लगातार संपर्क साइट पूर्वावलोकन

और बस। आपकी सभी संपर्क वेबसाइट बिल्डर सेटिंग्स से परिचित होना बाकी है.

लगातार संपर्क वेबसाइट बिल्डर सेटिंग्स

यदि आपको अपनी साइट में कोई परिवर्तन करने की आवश्यकता है, तो आपको ऐसा करने के लिए सरल विकल्पों का भार मिला है। अपनी वेबसाइट बिल्डर संपादक के शीर्ष पर टैब का उपयोग करके, आप अपनी थीम बदल सकते हैं या अन्य सेटिंग्स पर भी काम कर सकते हैं.

लगातार संपर्क साइट पूर्वावलोकन

उदाहरण के लिए, यदि आप पर क्लिक करते हैं समायोजन आइकन आप अपनी साइट के प्रदर्शन के विभिन्न पहलुओं को बेहतर बनाने के लिए विभिन्न विकल्प देखेंगे

लगातार संपर्क सेटिंग्स

इन सेटिंग विकल्पों के साथ, आप अपना नाम और डोमेन, लोगो, फ़ेविकॉन, और यहां तक ​​कि अपनी साइट के एसईओ पर काम कर सकते हैं। आप अपने संपर्क विवरण को भी अपडेट कर सकते हैं मेरे व्यापार अपने बाईं ओर टैब करें.

यदि आप अपने सामाजिक लिंक जोड़ना चाहते हैं, तो पर क्लिक करें सामाजिक लेखा टैब.

लगातार संपर्क सामाजिक

इससे आप अपने सोशल मीडिया अकाउंट लिंक को अपनी साइट के पाद लेख पर प्रदर्शित कर सकते हैं। आप अपनी वेबसाइट के प्रदर्शन को भी ट्रैक कर सकते हैं नज़र रखना & एनालिटिक्स टैब। आपको बस अपने Google Analytics ट्रैकिंग आईडी को जोड़ना होगा.

यदि आप अभी तक अपना Google Analytics खाता सेट नहीं करते हैं तो यहां एक उपयोगी लेख है.

अंत में, के तहत कानूनी टैब, आप अपनी शर्तों और सेवाओं को जोड़ सकते हैं। आप इसमें कस्टम HTML भी जोड़ सकते हैं HTML इंजेक्शन टैब, लेकिन यह शुरुआती साइट रचनाकारों के लिए कम महत्वपूर्ण नहीं है.

आखिर तुमने इसे हासिल कर ही लिया है! अब आप देखते हैं कि वेबसाइट बिल्डर के साथ कस्टम वेबसाइट बनाना कितना आसान है। सबसे अच्छी बात यह है कि इसमें किसी भी कोड को लिखना या सीखना शामिल नहीं है.

साइट बिल्डर का उपयोग करने से आप समय के एक अंश में समान परिणाम प्राप्त कर सकते हैं.

बीवर बिल्डर या कॉन्स्टेंट कॉन्टैक्ट की वेबसाइट बिल्डर से आश्वस्त नहीं है? चिंता मत करो। हमारे पास आपके लिए अधिक वेबसाइट बिल्डर सुझाव हैं जो आपकी वेबसाइट डिजाइन करने की प्रक्रिया को सरल बना सकते हैं.

लेकिन अगर आपने अभी भी अपनी साइट को स्क्रैच से कोड करने की ठान ली है, लेकिन यह नहीं जानते कि शुरुआत कैसे करें, तो हमारे पास इसके लिए भी उपाय है। कोशिश करें Codecademy. यह किसी के लिए सबसे अच्छी शुरुआत है, जिसके पास समय है और एक निर्देशित कदम-दर-चरण पाठ्यक्रम के साथ कोडिंग सीखना चाहता है.

एक बार जब आपने कोड बनाना सीख लिया, और आप अपनी पहली वेबसाइट बनाने के लिए तैयार हो गए, तो आपको एक डोमेन नाम चुनने और एक अच्छी वेब होस्टिंग चुनने की आवश्यकता होगी जहाँ आप अपनी साइट होस्ट कर सकते हैं.

पढ़ने के लिए धन्यवाद और हमें उम्मीद है कि आपको यह लेख अच्छा लगा होगा। यदि आपने किया है, तो इसे किसी मित्र के साथ साझा क्यों न करें?

और क्या आपके पास साइट बिल्डरों के साथ काम करने के लिए कोई अच्छा सुझाव है?

नीचे टिप्पणी अनुभाग में हमें बताएं। हम अपने लगे हुए पाठकों से सुनना पसंद करते हैं!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map