CSS और JS को जोड़ने वाले Magento में पाद लेख शामिल है

मैं अपने Magento साइट के कुछ Yslow अनुकूलन कर रहा हूँ और साइट के पाद लेख में CSS और Js जोड़ने की कोशिश कर रहा हूँ।

फिलहाल मैं लेआउट XML में एक सिर संदर्भ टैग का उपयोग कर रहा हूँ और का उपयोग कर addJsऔर addCssकार्यों को अपनी सभी फ़ाइल शामिल करने के लिए। मैंने पाद लेख के लिए संदर्भ को स्वैप करने की कोशिश की, लेकिन जब मैंने साइट को देखने की कोशिश की तो एक त्रुटि दी गई। वहाँ ऐसा करने का एक तरीका है local.xml या यह पाद लेख टेम्पलेट फ़ाइल में हार्डकोड किया जाना है?

layout javascript css

— क्रिस मॉरिस
स्रोत

के संभावित डुप्लिकेट ले जाएँ सभी जावास्क्रिप्ट </ body> से पहले करने के लिए भी शामिल है

— बेन Lessani - Sonassi

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

— एलन स्टॉर्म

जेएस को फुटर में ले जाने के अलावा, मुझे पूरा यकीन है कि आप सीएसएस को पाद पर स्थानांतरित नहीं करना चाहते हैं। इसमें होना चाहिए <head>।

— pspahn

मेरे पुराने पोस्ट से लिंकआउट @sonassi समाधानों में से एक सही था और काम करता है, लेकिन ध्यान रखें कि जब आप विलय करते हैं तो आपको कई मर्ज की गई जेएस फाइलें मिलती हैं। ऐसा लगता है कि यदि आप जेएस को अलग-अलग हैंडल के साथ-साथ शामिल करते हैं।

— मार्क वेस्टन

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

— फासको लैब्स

जवाबों:

मुझे पता है कि यह आपके सवाल का जवाब नहीं है, लेकिन कुछ ऐसा है जिस पर आप फिर भी विचार कर सकते हैं।

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

आप CSS और JS को Magento में बनाए गए औजारों और Gzip कम्प्रेशन और दूर की गति बढ़ाने वाले हेडर का उपयोग करके उन्हें तेज करने के लिए तेज और बेहतर बंद कर सकते हैं। इस तरह जावास्क्रिप्ट और सीएसएस के कारण होने वाले 'लैग' को डिफ़ॉल्ट मैगनेटो और थर्ड पार्टी एक्सटेंशन लेआउट को बदलने की आवश्यकता के बिना न्यूनतम रखा जाएगा। इस तरह, जब आप अपने Magento या एक्सटेंशन को अपग्रेड करते हैं, तो आपको सभी काम फिर से करने की ज़रूरत नहीं है।

HTML5 बॉयलरप्लेट परियोजना द्वारा प्रदान किया गया .htaccess इस gzip संपीड़न और दूर की समाप्ति हेडर प्रदान करता है, कृपया http://inchoo.net/ecommerce/magento/magento-boilerplate/ देखें

— सैंडर मंगल
स्रोत

ओपी की त्रुटियां ऑर्डर लोडिंग के कारण बहुत कम होती हैं - अधिकांश इनलाइन स्क्रिप्ट के लिए प्रोटोटाइप एट अल की आवश्यकता होती है। यदि आप इसे केवल पाद लेख में लोड कर रहे हैं तो बहुत देर हो चुकी है। इनलाइन को हटाना जेएस पहला कदम होगा। बहुत काम - शुभकामनाएँ।

— क्रिस्टोफ़ फ़ॉमन

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

    <block type="page/html_head" name="foot" as="foot" template="page/html/foot.phtml"/>

अब आप अपनी किसी भी XML फाइल में इस कमांड का उपयोग करके JS / CSS (हालांकि पाद लेख में CSS अनुशंसित नहीं है) जोड़ सकते हैं:

    <reference name="foot">
        <action method="addItem">
            <type>skin_js</type>
            <name>js/somefile.js</name>
        </action>
        <action method="addItem">
            <type>skin_js</type>
            <name>js/main.js</name>
        </action>
    </reference>

अंदर page/html/foot.phtml:

<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>
<?php echo $this->helper('core/js')->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>

अपने पेज टेम्प्लेट फ़ाइलों (जैसे page/1column.phtml) में आपको बॉडी टैग बंद करने से पहले इस ब्लॉक को आउटपुट करना होगा:

    <?php echo $this->getChildHtml('foot') ?>

यदि आप डिफ़ॉल्ट Magento टेम्प्लेट का उपयोग कर रहे हैं तो आपको JS त्रुटियाँ मिलेंगी। उदाहरण के लिए मिनी खोज फ़ॉर्म लें ( catalogsearch/form.mini.phtml)। इसकी यह इनलाइन स्क्रिप्ट है:

<script type="text/javascript">
    //<![CDATA[
    var searchForm = new Varien.searchForm('search_mini_form', 'search', '<?php echo $this->__('Search Redset...') ?>');
    //]]>
</script>

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

अन्य समस्या जिसका आप सामना कर सकते हैं, यदि आप noConflict मोड में प्रोटोटाइप के साथ jQuery का उपयोग कर रहे हैं। आपको यह सुनिश्चित करने की आवश्यकता होगी कि प्रोटोटाइप से पहले jQuery लोड किया गया है ताकि कोई टकराव न हो।

— jharrison.au
स्रोत

Magento v1.6 + (पुराने संस्करणों में परीक्षण करने की आवश्यकता) के लिए;

1 - page/html/footer/extras.phtmlइस सामग्री के साथ एक टेम्पलेट फ़ाइल बनाएँ :

<?php echo $this->getCssJsHtml() ?>

2 - इस HTML नोड को अपने लेआउट xml में जोड़ें:

<reference name="before_body_end">
<block type="page/html_head" name="extra_js" as="extraJs" after="-" template="page/html/footer/extras.phtml">
    <action method="addItem"><type>skin_js</type><name>js/jquery.min.js</name></action>
</block>

3 - यही है!

— मर्सियो मैकील
स्रोत

क्लोज़िंग बॉडी टैग से पहले js स्क्रिप्ट जोड़ने के लिए ऊपर की तुलना में बहुत सरल विधि

— asherrard