वर्डप्रेस के साथ बाह्य jQuery / जावास्क्रिप्ट फ़ाइलों को कैसे लिंक करें

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

समस्या को ठीक करने की कोशिश में मैंने हेडर फ़ाइल में एक टिप्पणी देखी, जिसकी उत्पत्ति ट्वेंटी टेन थीम से हुई थी:

/* Always have wp_head() just before the closing </head>
 * tag of your theme, or you will break many plugins, which
 * generally use this hook to add elements to <head>, such 
 * as styles, scripts, and meta tags
 */

तो यहाँ मेरी समस्या है, मैं इस धारणा के तहत हूँ कि jQuery फ़ाइल को किसी भी अन्य फ़ाइल से पहले सेट wp_head()किया जाना है जो इसका उपयोग करना चाहता है और <head>तत्व में अंतिम बात होनी चाहिए , मैं अब थोड़ा उलझन में हूं क्योंकि मुझे आश्चर्य हो रहा है मैंने wp_head()सबसे ऊपर रखा इसलिए WP शामिल jQuery फ़ाइल का उपयोग मेरे सभी प्लगइन्स के लिए किया जाएगा, भले ही वह ऐसा न करने के लिए कहता हो।

मैंने wp_head()फ़ंक्शन में jQuery लाइन पर टिप्पणी की, लेकिन यह व्यवस्थापक पृष्ठ के लिए आवश्यक है इसलिए मुझे इसे वापस लाना पड़ा।

मैं jQuery के Google CDN संस्करण का उपयोग करने के साथ (कम से कम प्रयोग) करना चाहता हूं, लेकिन इसे दो बार शामिल नहीं करना चाहता!

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

धन्यवाद!

— बेन एवरर्ड
स्रोत

इसे "वर्डप्रेस के साथ बाहरी jQuery / जावास्क्रिप्ट फ़ाइलों को कैसे लिंक करें" जैसी चीज़ों से पुन: जोड़ा जाना चाहिए।

— माइकस्किंकल

मैं सहमत हूं, मैं अनिश्चित था कि इसे क्या कहूं क्योंकि मैं उस समस्या से परिचित नहीं था जो मेरे पास थी :-)

— बेन एवरार्ड

जवाबों:

अपने प्रश्न के शब्दांकन से, आपको <script>अपने टेम्पलेट में टैग लिखकर स्क्रिप्ट जोड़ना होगा । wp_enqueue_script()अपने टेम्प्लेट के माध्यम से अपनी स्क्रिप्ट जोड़ें functions.php, उचित रूप से jQuery पर निर्भरता सेट करें, और wp_head()आपके लिए स्क्रिप्ट जोड़ देगा।

function my_scripts() {
    wp_enqueue_script( 'my-sweet-script', get_bloginfo('template_directory') . '/script.js', array('jquery') );
}
add_action('template_redirect', 'my_scripts');

अधिक जानकारी के लिए कोडेक्स पृष्ठ देखें ।

— अन्निका बैकस्ट्रॉम
स्रोत

आप यह सोचकर सही हैं कि मैं <script>टैग का उपयोग करके स्क्रिप्ट जोड़ रहा हूं , यह वह विकल्प है जिसकी मुझे तलाश थी, बहुत धन्यवाद! :-)

— बेन एवरार्ड

अगर आप अपनी स्क्रिप्ट को केवल फ्रंट एंड पर जोड़ना चाहते हैं, तो 'template_redirect'इसके बजाय हुक करें 'init'।

— जॉन पी बलोच

अच्छा सामान, मैं अपना जवाब अपडेट करूंगा। मैंने लगभग एनक्वे को लपेटने का सुझाव दिया is_admin()।

— अन्निका बैकस्ट्रॉम

मैं आमतौर पर ऊपर की टेम्प्लेट फ़ाइल में स्क्रिप्ट्स को संलग्न करता हूं get_header(), ऐसा करने से यह functions.phpहर उस पृष्ठ पर होगा , जिसकी आवश्यकता नहीं हो सकती है। यदि मेरे पास एक वैश्विक एक है, तो मैं इसे header.phpपहले wp_head()कहा जाता है। इस तरह से बाते हैं जहाँ आप उनसे उम्मीद करेंगे कि<head>

— जो हॉयल

कभी-कभी पृष्ठ के निचले भाग पर स्क्रिप्ट जोड़ना बेहतर होता है। यह codex.wordpress.org/Function_Reference/wp_enqueue_script (5th, $ in_footer) का अंतिम पैरामीटर है , इसे सही पर सेट करें। उन लोगों के लिए थोड़ी जानकारी जिन्हें अधिक नियंत्रण की आवश्यकता है।

— हकर्रे

मेरा सुझाव है कि वर्डप्रेस के साथ jQuery का उपयोग करने के लिए 5 युक्तियों पर एक नज़र डालें । अन्य बातों के अलावा, यह Google की लाइब्रेरी से jQuery लोड करने के लिए आवश्यक कोड दिखाता है:

function my_init() {
    if (!is_admin()) {
        // comment out the next two lines to load the local copy of jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js', false, '1.3.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'my_init');

आप Google लायब्रेरी प्लगइन का उपयोग भी देख सकते हैं ।

— ट्रैविस नॉर्थकट
स्रोत

यह वास्तव में एक बेहतर उत्तर है, क्योंकि यह दिखाता है कि jQuery के Google CDN संस्करण को कैसे कतारबद्ध किया जाए। हालांकि, जैसे जॉन ने कहीं और सुझाव दिया, यदि आप केवल सामने के छोर पर यह करना चाहते हैं, तो template_redirectइसके बजाय हुक करें init।

— EAMann

अच्छी बात यह है कि यह कहाँ लोड होता है। हालांकि वास्तव में, व्यवस्थापक क्षेत्र jQuery का उपयोग भी करता है, है ना? किसी भी तरह से, यह दिखाने के लिए धन्यवाद कि इसे कैसे नियंत्रित किया जाए।

— ट्रैविस नॉर्थकट

हाँ, मुझे सिर्फ jquery / wp पोस्ट के लिए 5 सुझाव मिले, आपके उत्तर के लिए धन्यवाद :-)

— बेन एवरार्ड

वर्डप्रेस के साथ jQuery का उपयोग करने के लिए 5 युक्तियाँ - लिंक अब काम नहीं कर रहा है।

— 22

नोट: उदाहरण में jQuery का एक "पुराना" संस्करण शामिल है, वर्तमान WP संस्करण (3.0.1) jQuery 1.4.2 चल रहा है ...

— t31os

हालाँकि @tnorthcutt सही है कि आपको WP के नेटिव जेकरी को ठीक से डिक्लेयर करना चाहिए अगर आप अपना खुद का लोड करना चाहते हैं, तो आप निश्चित रूप से मुद्दों में भाग लेना चाहते हैं जब आप एक अलग jquery संस्करण लोड कर रहे हैं जो WP कोर। कोर और प्लगइन्स दोनों वहाँ होने पर भरोसा करते हैं। इसलिए यदि आप WP के अपडेट होने पर हर बार नवीनतम थीम के साथ अपने विषय को अपडेट नहीं करते हैं, तो आपकी साइट टूट सकती है।

निम्नलिखित कोड यह सुनिश्चित करेगा कि आपका विषय हमेशा jquery के सही संस्करण को लोड करता है, पहले यह देख कर कि WP कौन सा संस्करण उपयोग कर रहा है और फिर उस Google से लोड कर रहा है:

$wp_jquery_version = $GLOBALS['wp_scripts']->registered['jquery-core']->ver;
$jquery_version = ( $wp_jquery_version == '' ) ? '1.8.3' : $wp_jquery_version; // fallback, just in case 
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/'. $jquery_version .'/jquery.min.js', $jquery_version, false );
wp_enqueue_script('jquery');

— cjbj
स्रोत