एक HTML फ़ाइल को दूसरे में कैसे शामिल करें

click fraud protection

पता करने के लिए क्या

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

यह लेख बताता है कि "शामिल है" कैसे काम करता है और सर्वर साइड इनक्लूसिव, पीएचपी इनक्लूसिव और जावास्क्रिप्ट इनक्लूसिव का उपयोग करने के लिए चरण प्रदान करता है।

सर्वर साइड का उपयोग करना शामिल है

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

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

instagram viewer

यहां एक उदाहरण दिया गया है कि आप अपने सभी वेब पेजों में HTML के एक स्निपेट को शामिल करने के लिए SSI का उपयोग कैसे कर सकते हैं:

  1. अपनी साइट के सामान्य तत्वों के लिए HTML को अलग फ़ाइलों के रूप में सहेजें। उदाहरण के लिए, आपका नेविगेशन अनुभाग इस रूप में सहेजा जा सकता है नेविगेशन.एचटीएमएल या नेविगेशन.एसएसआई.

  2. प्रत्येक पृष्ठ में उस HTML दस्तावेज़ के कोड को शामिल करने के लिए निम्नलिखित SSI कोड का उपयोग करें।


    या।

    शामिल निर्देश दो मापदंडों को स्वीकार करता है। वास्तविक मानता है कि फ़ाइल नाम वेबसाइट के दस्तावेज़ रूट के सापेक्ष है, जबकि फ़ाइल एक पूर्ण फ़ाइल पथ स्वीकार करता है।

  3. इस कोड को हर उस पेज पर जोड़ें जिसमें आप फ़ाइल शामिल करना चाहते हैं।

PHP का उपयोग करना शामिल है

एसएसआई की तरह, पीएचपी एक सर्वर-स्तरीय तकनीक है। यदि आप सुनिश्चित नहीं हैं कि आपकी वेबसाइट पर PHP कार्यक्षमता है, तो अपने होस्टिंग प्रदाता से संपर्क करें।

यहां एक साधारण PHP स्क्रिप्ट है जिसका उपयोग आप किसी भी PHP-सक्षम वेब पेज पर HTML के एक स्निपेट को शामिल करने के लिए कर सकते हैं:

  1. फ़ाइलों को अलग करने के लिए अपनी साइट के सामान्य तत्वों, जैसे नेविगेशन, के लिए HTML सहेजें। उदाहरण के लिए, आपका नेविगेशन अनुभाग इस रूप में सहेजा जा सकता है नेविगेशन.एचटीएमएल या नेविगेशन.एसएसआई.

  2. प्रत्येक पृष्ठ में उस HTML को शामिल करने के लिए निम्नलिखित PHP कोड का उपयोग करें (अपनी फ़ाइल के पथ और फ़ाइल नाम को उद्धरण चिह्नों के बीच प्रतिस्थापित करना).

  3. प्रत्येक पृष्ठ पर यह वही कोड जोड़ें, जिसमें आप फ़ाइल शामिल करना चाहते हैं।

जावास्क्रिप्ट शामिल है

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

यहां बताया गया है कि आप कैसे कर सकते हैं जावास्क्रिप्ट का उपयोग करके HTML का एक स्निपेट शामिल करें:

अपनी साइट के सामान्य तत्वों के लिए HTML को JavaScript फ़ाइल में सहेजें। इस फ़ाइल में लिखे गए किसी भी HTML को स्क्रीन पर प्रिंट किया जाना चाहिए दस्तावेज़.लिखें समारोह।

  1. उस फाइल को अपनी वेबसाइट पर अपलोड करें।

  2. का उपयोग करो 

  3. प्रत्येक पृष्ठ पर उसी कोड का उपयोग करें जिसमें आप फ़ाइल शामिल करना चाहते हैं।

HTML में क्या शामिल है?

एक शामिल HTML का एक भाग है जो अपने आप में एक पूर्ण HTML दस्तावेज़ नहीं है। इसके बजाय, यह दूसरे पेज का एक हिस्सा है जिसे प्रोग्रामिंग के माध्यम से एक पूर्ण वेब पेज में डाला जा सकता है। अधिकांश में फ़ाइलें शामिल हैं वे उपरोक्त आइटम हैं जिन्हें वेबसाइट के कई पृष्ठों पर दोहराया जाता है। उदाहरण के लिए:

  • पथ प्रदर्शन
  • कॉपीराइट संबंधी जानकारी
  • शीर्षलेख क्षेत्र
  • पाद क्षेत्र

कैसे 'शामिल' वेब डिज़ाइन को और अधिक कुशल बनाता है

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

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

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

एचटीएमएल फ़ाइलें

सामग्री प्रबंधन प्रणालियों में दोहराई गई सामग्री

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

यदि आप अपनी साइट के लिए सामग्री प्रबंधन प्रणाली का उपयोग नहीं करते हैं, तब भी आप शामिल फ़ाइलों का लाभ उठा सकते हैं। एचटीएमएल में, शामिल अपनी साइट के इन टेम्प्लेटेड क्षेत्रों को प्रबंधित करने में आसान बनाने में सहायता करें।

अन्य तरीके शामिल करें

अपने पृष्ठों पर HTML शामिल करने के कई अन्य तरीके हैं। कुछ दूसरों की तुलना में अधिक जटिल हैं, और उनमें से कई वास्तव में आज के मानकों से पुराने हैं।

  • सीजीआई में शामिल हैं: आप उपयोग कर सकते हैं पर्ल या किसी अन्य प्रोग्रामिंग भाषा को अपने पेज बनाने के लिए और फिर जो कुछ भी आप चाहते हैं उसे शामिल करें, या तो "आवश्यकता" फाइलों के रूप में या उन्हें मैन्युअल रूप से पढ़कर
  • फ्लैश शामिल है: यदि आप अपनी साइट पूरी तरह से Adobe Flash में बनाते हैं, तो आप साइट के तत्वों को शामिल करने के लिए इसका उपयोग कर सकते हैं। यह विधि पुरानी है और इन दिनों वेब पर पूर्ण फ़्लैश साइटें दुर्लभ हैं।
  • फ्रेम्स शामिल हैं: कई पृष्ठों पर एक ही तत्व का बार-बार उपयोग करने के बजाय, एक ऐसी फ़्रेमयुक्त साइट बनाएं, जहां फ़्रेम साइट के डुप्लीकेट भाग हों. हालांकि, आईफ्रेम तत्व को छोड़कर, HTML5 में फ़्रेम अप्रचलित हैं.
  • सामग्री प्रबंधन उपकरण शामिल हैं: टेम्प्लेटिंग सीएमएस के प्रमुख विक्रय बिंदुओं में से एक है और यह वास्तव में आज अधिकांश साइटों पर यह काम कैसे किया जाता है।
instagram story viewer