एक फ़ाइल में नेविगेशन बार कैसे स्टोर करें?

मैं अपनी वेबसाइट के लिए एक नेविगेशन बार है:एक फ़ाइल में नेविगेशन बार कैसे स्टोर करें?

<div id='menu'><ul> 
    <li><a href='index.html'>Home</a></li> 
    <li><a href='about.html'>About Us</a></li> 
    <li><a href='http://www.brownpapertickets.com' target=_blank>Ticket Sales</a></li> 
    <li><a href='merch.html'>Merchandise</a> 
     <ul> 
      <li><a href='merch.html'>Products</a></li> 
      <li><a href='cart.html'>Shopping Cart</a></li> 
     </ul> 
    </li> 
    <li><a href='past.html'>Past Shows</a> 
     <ul> 
      <li><a href='photos.html'>Photo Gallery</a></li> 
      <li><a href='vids.html'>Video Clips</a></li> 
     </ul> 
    </li> 
</ul></div>

मैं इतना है कि हर बार जब मैं एक हाइपरलिंक या कुछ और मैं हर एक फ़ाइल को संपादित करने की जरूरत नहीं है जोड़ने के लिए एक केंद्रीय स्थान में इस संग्रहीत करना चाहते हैं। ऐसा करने का सबसे अच्छा तरीका क्या है?

स्रोत

2011-08-14 Jason

क्या आप PHP जैसी किसी सर्वर-साइड भाषा चला सकते हैं? – Wylie

सर्वर-साइड भाषा का उपयोग करने के विकल्प के रूप में, आप एक टेम्पलेट के साथ एक स्थिर साइट जनरेटर का उपयोग कर सकते हैं जो आपके पृष्ठों के कॉमन्स भागों को परिभाषित करता है। स्थिर वेबसाइट जेनरेटर की एक बड़ी सूची यहां दी गई है: http://iwantmyname.com/blog/2011/02/list-static-website-generators.html –

आईडी का उपयोग करके: http://www.webdeveloper.com/forum/showthread। php? 156367-बनाना-my-menu-load-from-external-file – Ampere

आप इस तरह पीएचपी के रूप में एक पटकथा भाषा का उपयोग कर रहे मान लिया जाये, तो आप बस कि HTML के ऊपर एक php फ़ाइल में बचाने header.php कहा जाता है (या अपने पसंद के हिसाब से कुछ) अपने अन्य php फाइलों में

तो फिर तुम लिखें:

include_once('header.php'); और यह वहां उस HTML को दाहिनी ओर ले जाएगा।

आप के लिए कुछ संसाधन:

http://php.net/manual/en/function.include.php

http://www.php.net/manual/en/function.include-once.php

http://php.about.com/od/tutorials/ht/template_site.htm

का आनंद लें!

स्रोत

2011-08-14 04:37:40 AlienWebguy

सुंदर, बहुत बहुत धन्यवाद! – Jason

आपका स्वागत है! खुशी है कि मैं मदद कर सकता हूं :) – AlienWebguy

क्या यह PHP के बिना किया जा सकता है? बस एचटीएमएल, सीएसएस (शायद पायथन ..) –

अद्यतन @AlienWebguy ने बताया कि इन समाधानों खोज इंजन परिणामों में अपनी रैंकिंग को नुकसान होगा। यदि आप इसके बारे में परवाह करते हैं, तो उनका उपयोग न करें। लेकिन मेरी राय में, मान्य विकल्पों के रूप में, वे इसके बारे में जानने लायक हैं।

फ्रेम्स
आपके सभी पृष्ठों में, एक में शामिल हैं:

तो एक सर्वर साइड (PHP या कुछ अन्य भाषा का प्रयोग कर) शामिल हैं आप का उपयोग कर इसे कर सकता है एक विकल्प नहीं है iframe (सीमाओं या स्क्रॉलबार के बिना होने के लिए स्टाइल) और src को एक HTML फ़ाइल होने के लिए सेट करें जो आपके नेविगेशन मार्कअप को रखता है। बेशक, आप निम्नलिखित लिंक के साथ परेशानी में भागने जा रहे हैं और आपको 'सही' व्यवहार प्राप्त करने के लिए शायद जावास्क्रिप्ट का सहारा लेना होगा। यह संभवतः प्रयास के लायक नहीं है। सही ढंग से लिंक का पालन करने के लिए, आपको target attribute_top (या शायद _parent) पर अपने नेविगेशन लिंक में उपयोग करने की आवश्यकता होगी। यह शायद सबसे सरल समाधान है जो स्क्रिप्टिंग समर्थन के बिना उपयोगकर्ता एजेंटों में भी काम करना चाहिए। navbar.html इस तरह लग रही के साथ
```
<html> 
<body> 
    <iframe src="navbar.html" class="navbar" /> 
     
</body> 
</html 
```
:

उदाहरण के लिए, अपने पृष्ठ इस तरह दिखेगा
```
<html> 
<body> 
    <div id='menu'><ul> 
     <li><a href='index.html' target="_top">Home</a></li> 
     <li><a href='about.html' target="_top">About Us</a></li> 
     <li><a href='http://www.brownpapertickets.com' target="_blank">Ticket Sales</a></li> 
     <li><a href='merch.html' target="_top">Merchandise</a> 
      <ul> 
       <li><a href='merch.html' target="_top">Products</a></li> 
       <li><a href='cart.html' target="_top">Shopping Cart</a></li> 
      </ul> 
     </li> 
     <li><a href='past.html' target="_top">Past Shows</a> 
      <ul> 
       <li><a href='photos.html' target="_top">Photo Gallery</a></li> 
       <li><a href='vids.html' target="_top">Video Clips</a></li> 
      </ul> 
     </li> 
    </ul></div> 
</body> 
</html> 
```

अजाक्स
सहेजें एचटीएमएल आप नेवबार के लिए की जरूरत है एक HTML खंड (एक पूर्ण HTML दस्तावेज़ नहीं) के रूप में और पृष्ठ लोड पर AJAX का उपयोग करके इसे लोड करें। यहां jQuery का उपयोग करके एक उदाहरण दिया गया है। आपके पृष्ठ पर:

<html> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#menu').('navbar.html'); 
    }); 
</script> 

<body> 
    <div id='menu' /> 
</body> 
</html>

navbar।एचटीएमएल

<ul> 
    <li><a href='index.html' target="_top">Home</a></li> 
    <li><a href='about.html' target="_top">About Us</a></li> 
    <li><a href='http://www.brownpapertickets.com' target="_blank">Ticket Sales</a></li> 
    <li><a href='merch.html' target="_top">Merchandise</a> 
     <ul> 
      <li><a href='merch.html' target="_top">Products</a></li> 
      <li><a href='cart.html' target="_top">Shopping Cart</a></li> 
     </ul> 
    </li> 
    <li><a href='past.html' target="_top">Past Shows</a> 
     <ul> 
      <li><a href='photos.html' target="_top">Photo Gallery</a></li> 
      <li><a href='vids.html' target="_top">Video Clips</a></li> 
     </ul> 
    </li> 
</ul>

स्रोत

2011-08-14 04:42:28

-1 के उत्तर में उल्लिखित जावास्क्रिप्ट का उपयोग भी कर सकते हैं -1 यह एक बिल्कुल भयानक विचार है। आपका मुख्य नौसेना आपके एसईओ रस का दिल है। पृथ्वी पर क्यों आप इसे अजीब करेंगे ताकि Google आपके मुख्य पृष्ठों से कोई लिंक न देख सके? – AlienWebguy

@AlienWebguy मुझे लगता है कि डाउनवोट अनावश्यक था - बस ओपी को इंगित करता है कि अगर वह एसईओ की परवाह करता है, तो यह एक अच्छा विचार नहीं था (लेकिन वैध विकल्प आईएमओ)। मैंने योग्यता के साथ ओपीएस प्रश्न का उत्तर दिया कि उस स्थिति में जहां एक सर्वर पक्ष शामिल नहीं था, ये वैकल्पिक दृष्टिकोण थे। वेबसाइट बनाने के दौरान निश्चित रूप से अन्य विचार किए जाने हैं और जैसा कि आपने बताया है, शायद खोज इंजन रैंकिंग कुछ ऐसा है जिसे ओपी पर विचार करना चाहिए। लेकिन मुझे ऐसा लगता है कि प्रोग्रामिंग दृष्टिकोण से सवाल के लिए यह कुछ प्रासंगिक नहीं था। –

हम नहीं जानते कि क्या ओपी सार्वजनिक साइट या आंतरिक एक विकसित कर रहा है - बाद के मामले में, मुझे विचारों की सूची में एसईओ आंकड़े बहुत अधिक संदेह करते हैं। किसी भी तरह से, मैंने प्रश्न में जानकारी देने पर विचार करने के लिए ओपी विकल्प दिए। –

आप AJAX इस्तेमाल कर सकते हैं और फिर वहाँ पर सिर्फ मेनू कोड के साथ एक अलग पेज बनाते हैं।

असल में आप बस jQuery के .load() का उपयोग कर सकते हैं जो उपयोग करना बहुत आसान है।

<script type="text/javascript"> 
$(document).ready(function() { 
$('#nav-container').load('/path/to/nav.html'); 
}); 
</script>

तुम बस प्रत्येक पृष्ठ के लिए इस कोड जोड़ सकते हैं और वहाँ पर एक div है, लेकिन एक बार आप ऐसा करते हैं, तो आप 'करने के लिए होगा:

यहाँ एक उदाहरण आईडी के लिए #nav-container साथ एक div में nav.html लोड हो रहा है केवल अद्यतन करने के लिए nav.html

नोट होगा: यह यह करने के लिए यदि आप PHP उपयोग नहीं कर सकते सबसे अच्छा तरीका है, के रूप में आई अब और है कि अच्छा बस नहीं हैं। पृष्ठ को लोड होने के साथ ही यह वास्तव में पृष्ठ पर nav.html से कोड लोड करेगा। (<html>, <body>, और अन्य पेज टैग स्वीकार करते हैं। यह nav.html पृष्ठ पर <body></body> भीतर केवल कोड।

जावास्क्रिप्ट के बिना अपने उपयोगकर्ताओं के लिए, बस <noscript></noscript> टैग में एक iframe डाल देता हूँ तुम सच में करना चाहते हैं। यदि उपयोगकर्ताओं को आपकी साइट का उपयोग करने के बावजूद जावास्क्रिप्ट सक्षम होना है तो आपको इसके साथ परेशान करने की आवश्यकता नहीं है। (Iframes के साथ याद रखें, आपको नेविगेशन में सभी लिंक पर लक्ष्य और सामान सेट करना होगा।)

अपने head टा में jQuery फ़ाइल लिंक शामिल करना याद रखें यदि आप पहले से नहीं हैं तो अपने सभी पृष्ठों पर जीएस nav.html लोड हो रहे हैं।

आशा है कि यह सहायक होगा।

स्रोत

2011-08-14 04:47:12 Nathan

आप अपने एनवी बार के मार्कअप को फ़ाइल मेनू.htm में डाल सकते हैं और अपने पृष्ठों पर स्पॉट में एक (सर्वर-साइड शामिल) का उपयोग कर सकते हैं जहां आप अपने मेनू के मार्कअप चाहते हैं। https://stackoverflow.com/a/2216356/2303079

यहाँ एक समान चर्चा है: Have a single menu on multiple pages?

स्रोत

2013-05-02 18:08:37 CaptainJanuary

मैं smartmenus for jquery उपयोग कर रहा हूँ जो आवश्यकता है कि आप

$('#main-menu').smartmenus();

जोड़ें यदि आपने सबमेनू

मैंने पाया है कि आप करने के लिए लोड का विस्तार करता है, तो :

$('#menu').load('navbar.html',function(){ 
    $('#main-menu').smartmenus(); 
});

यह ठीक काम करता है। जहां मुख्य मेनू मेनू ब्लॉक के उल का वर्ग है।

स्रोत

2016-09-13 11:03:05 APA

एक फ़ाइल में नेविगेशन बार कैसे स्टोर करें?

उत्तर

संबंधित मुद्दे