मैं वर्डप्रेस में एक साधारण jQuery स्क्रिप्ट कैसे जोड़ूँ?


121

मैंने वर्डप्रेस में jQuery का उपयोग करने के बारे में कोडेक्स और कुछ ब्लॉग पोस्ट पढ़ा, और इसकी बहुत निराशा हुई। मैं functions.phpफ़ाइल में jQuery लोड करने के रूप में दूर के रूप में मिल गया है , लेकिन सभी गाइड वहाँ भद्दा हैं क्योंकि वे मानते हैं कि आपके पास पहले से ही WordPress अनुभव का एक टन है। उदाहरण के लिए, वे कहते हैं कि अब मैं functions.phpफ़ाइल के माध्यम से jQuery लोड कर रहा हूँ , अब मुझे बस इतना करना है कि मेरे jQuery को लोड करना है।

मैं वास्तव में यह कैसे करूँ? क्या फ़ाइलें, विशेष रूप से, क्या मैं कोड जोड़ूं? मैं इसे केवल एक वर्डप्रेस पेज के लिए कैसे जोड़ सकता हूँ?


3
आपने क्या कोशिश की है कि आपको लगता है कि सभी गाइड बाहर भद्दे हैं?
अपरिष्कृत

1
में जो पर गाइड जो कदम आप में चलाने की थी जो समस्या?
पिक्सेल

क्या आप विशिष्ट हो सकते हैं? आपने क्या प्रयास किया और क्या काम नहीं किया?
अहमद फवाद

4
मैं @ सिटीजन से सहमत हूं, यह समझने के लिए कि मेरा क्या करना है, यह पहले से ही एक माइनर फील्ड है क्योंकि ऑनलाइन पाए गए कुछ गाइड में शुरुआती लोगों के लिए निर्देश बहुत गहन नहीं हैं।
हैरी

नीचे दिए गए लिंक की जाँच करें: wpseoblogs.com/how-to-add-javascript-code-when-published-post
पटेल

जवाबों:


192

मुझे पता है कि आप ट्यूटोरियल के बारे में क्या सोचते हैं। यहां बताया गया है कि मैं यह कैसे करता हूं:

पहले आपको अपनी स्क्रिप्ट लिखने की जरूरत है। अपने थीम फोल्डर में 'js' जैसी एक फोल्डर बनाएं। अपने जावास्क्रिप्ट के लिए उस फ़ोल्डर में एक फ़ाइल बनाएँ। उदा। आपकी पटकथा। Js। अपनी jQuery स्क्रिप्ट को उस फ़ाइल में जोड़ें (आपको <script>.js फ़ाइल में टैग की आवश्यकता नहीं है )।

यहाँ एक उदाहरण दिया गया है कि आपकी jQuery स्क्रिप्ट (wp-content / themes / your-theme / js / your-scrript.js में) कैसे दिख सकती है:

jQuery(document).ready(function($) {
  $('#nav a').last().addClass('last');
})

ध्यान दें कि मैं jQuery का उपयोग करता हूं और फ़ंक्शन की शुरुआत में $ नहीं।

ठीक है, अब अपनी थीम के functions.php फ़ाइल को खोलें। आप wp_enqueue_script()फ़ंक्शन का उपयोग करना चाहते हैं ताकि आप अपनी स्क्रिप्ट को जोड़ सकें और साथ ही वर्डप्रेस को यह भी बता सकें कि यह jQuery पर निर्भर है। यहाँ है कि कैसे करना है:

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_enqueue_script(
        'your-script', // name your script so that you can attach other scripts and de-register, etc.
        get_template_directory_uri() . '/js/your-script.js', // this is the location of your script file
        array('jquery') // this array lists the scripts upon which your script depends
    );
}

यह मानते हुए कि आपके विषय में wp_head और wp_footer सही स्थानों पर हैं, यह काम करना चाहिए। मुझे बताना, अगर आप को किसी भी अधिक मदद की ज़रूरत हो।

वर्डप्रेस सवाल पर अधिक कहा जा सकता है वर्डप्रेस जवाब


15
मुझे add_action ('wp_enqueue_scripts', 'add_my_script') जोड़ना था; इसे लोड करने के लिए, लेकिन यह अभी भी सबसे स्पष्ट उत्तर है।
ग्यारह मुंजेली २ Ele

आपने इसे किस फाइल में जोड़ा है? @EleMunjeli
फ्रांसिस्को

10
धन्यवाद, Ele Munjeli, add_action करने के लिए टिप के लिए। ALSO: यदि आप चाइल्ड थीम के साथ काम कर रहे हैं, तो इसके बजाय get_stylesheet_directory_uri का उपयोग करें।
स्क्रीनबैक

धन्यवाद दोस्त। आप मेरा दिन बचाते हैं, जब आप
छीन लेते हैं

इसका अनुसरण करते हुए, मैं अभी भी प्राप्त कर रहा हूं Uncaught TypeError: Cannot read property 'fn' of undefinedऔर Uncaught TypeError: undefined is not a functionत्रुटियां हो रही हैं, तब भी जब फ़ंक्शंस फ़ाइल में किसी अन्य स्क्रिप्ट को पंक्तिबद्ध किया जा रहा है, और यह ठीक काम करता है
ली

44

बहुत खोज के बाद, मुझे आखिरकार कुछ मिला जो नवीनतम वर्डप्रेस के साथ काम करता है। यहाँ चरणों का पालन करें:

  1. अपनी थीम की निर्देशिका खोजें, अपने कस्टम js के लिए निर्देशिका में एक फ़ोल्डर बनाएं ( custom_js इस उदाहरण में ) के ।
  2. इस निर्देशिका में ( .quest_test.js इस निर्देशिका में .js फ़ाइल में अपना कस्टम jQuery डालें )।
  3. सुनिश्चित करें कि आपका कस्टम jQuery .js इस तरह दिखता है:

    (function($) {
    $(document).ready(function() {
    $('.your-class').addClass('do-my-bidding');
    })
    })(jQuery);
  4. विषय की निर्देशिका पर जाएं, फ़ंक्शन खोलें

  5. इस तरह दिखने वाले शीर्ष के पास कुछ कोड जोड़ें:

    //this goes in functions.php near the top
    function my_scripts_method() {
    // register your script location, dependencies and version
       wp_register_script('custom_script',
       get_template_directory_uri() . '/custom_js/jquery_test.js',
       array('jquery'),
       '1.0' );
     // enqueue the script
      wp_enqueue_script('custom_script');
      }
    add_action('wp_enqueue_scripts', 'my_scripts_method');
  6. सुनिश्चित करें कि यह काम करता है अपनी साइट की जाँच करें!

8
धन्यवाद, इससे मुझे बहुत मदद मिली!। चाइल्ड थीम के साथ काम करने वाले किसी भी व्यक्ति के लिए, get_template_directory_uri () के स्थान पर get_stylesheet_directory_uri () का उपयोग करें
David

इस चरण-दर-चरण स्पष्टीकरण के लिए धन्यवाद, स्टेन! (और बच्चे के विषयों के साथ इस का उपयोग करने के बारे में नोट, @DavidTaiaroa)
marky

यह शानदार ढंग से काम कर रहा है, लेकिन मुझे केवल एक पृष्ठ पर आग लगाने की आवश्यकता है। क्या इसे संशोधित करने का कोई तरीका है ताकि यह केवल पृष्ठ पर ही आग लगा दे? या यह कि व्यवहार के लिए एक पूरी तरह से अलग WP फ़ंक्शन की आवश्यकता है?
HPWD

जब मैं अपने पेज में jquery प्राप्त कर सकता हूं, लेकिन मुझे कंसोल में एक त्रुटि भी मिलती है, जो किसी भी गंभीर मुद्दे का कारण नहीं बनती है: Gust australiana.auspro.com.au/wp-content/themes/twentytwy/assets/… net :: ERR_ABORTED 404 (नहीं मिला) मैं इससे कैसे छुटकारा पा सकता हूं?
रेज.नेट

8

यदि आप अपने विषय में स्क्रिप्ट जोड़ने के लिए वर्डप्रेस चाइल्ड थीम का उपयोग करते हैं, तो आपको उदाहरण के लिए get_template_directory_uri फ़ंक्शन को get_stylesheet_directory_uri में बदलना चाहिए:

मूल विषय:

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_register_script(
        'parent-theme-script', 
        get_template_directory_uri() . '/js/your-script.js', 
        array('jquery') 
    );

    wp_enqueue_script('parent-theme-script');
}

बाल थीम:

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_register_script(
       'child-theme-script', 
       get_stylesheet_directory_uri() . '/js/your-script.js', 
       array('jquery') 
    );

    wp_enqueue_script('child-theme-script');
}

get_template_directory_uri: / your-site / wp-content / themes / parent-theme

get_stylesheet_directory_uri: / your-site / wp-content / themes / child-theme


6

आप विषय के function.php फ़ाइल में jQuery या जावास्क्रिप्ट जोड़ सकते हैं। कोड इस प्रकार है:

add_action( 'wp_enqueue_scripts', 'add_my_script' );

function add_my_script() {
wp_enqueue_script(
    'your_script_name', // your script unique name 
    get_template_directory_uri().'/js/your-script.js', //script file location
    array('jquery') //lists the scripts upon which your script depends
);
}

अधिक विवरण के लिए इस ट्यूटोरियल पर जाएँ: http://www.codecanal.com/add-simple-jquery-script-wordpress/


4

स्क्रिप्ट को फ़ंक्शंस में डालने के अलावा, आप हेडर, फ़ुटर, जहाँ भी हो, में एक लिंक (एक लिंक rel टैग जो है) शामिल कर सकते हैं। आपको केवल यह सुनिश्चित करने की आवश्यकता है कि मार्ग सही है। मैं कुछ इस तरह का उपयोग करने का सुझाव देता हूं (यह मानते हुए कि आप अपने विषय की निर्देशिका में हैं)।

<script type="javascript" href="<?php echo get_template_directory_uri();?>/your-file.js"></script>

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

<script type="javascript"><?php include('your-file.js');?></script>

यह 2019 में बुरा अभ्यास है।
फिल हिले

सहमत थे, लेकिन यह 5 साल पहले लिखा गया था। Enqueueing और क्या नहीं का सबसे अच्छा अभ्यास है।
josh.chavanne 19

1
इस पोस्ट को इंगित करने के लायक है क्योंकि यह पोस्ट Google पर काफी महत्वपूर्ण है। मैं किसी के यहाँ आने और बुरी प्रथाओं का उपयोग करने से नफरत करने लगा क्योंकि वे एक पुराने q & a पर लड़खड़ा गए थे।
फिल हीली

3

** # विधि 1: ** अपने jquery कोड को एक अलग js फ़ाइल में डालने का प्रयास करें।

अब उस स्क्रिप्ट को functions.php फाइल में रजिस्टर करें।

function add_my_script() {
    wp_enqueue_script(
      'custom-script', get_template_directory_uri() . '/js/your-script-name.js', 
        array('jquery') 
    );
}
add_action( 'wp_enqueue_scripts', 'add_my_script' );

अब तुम हो गए।

फ़ंक्शंस में स्क्रिप्ट रजिस्टर करने से उसे फ़ायदा होता है क्योंकि यह तब आता है <head>जब पेज लोड होता है और इस तरह यह शीर्ष लेख का एक हिस्सा होता है। इसलिए जब भी आप एक नई HTML सामग्री लिखते हैं तो आपको अपना कोड दोहराना नहीं पड़ता है।

# मैथोड 2:<script> टैग के तहत पेज बॉडी के अंदर स्क्रिप्ट कोड डालें। फिर आपको इसे कार्यों में पंजीकृत नहीं करना होगा।


विधि 2 आग से खेल रही है।
19

3

आप इस प्लगइन का उपयोग करके कस्टम जावास्क्रिप्ट या jquery जोड़ सकते हैं।
https://wordpress.org/plugins/custom-javascript-editor/

जब आप jQuery का उपयोग करते हैं तो jquery noconflict मोड का उपयोग न भूलें


3

पेज में शामिल करने के लिए अपनी स्क्रिप्ट को जोड़ने के लिए यहां कई ट्यूटोरियल और उत्तर दिए गए हैं। लेकिन मुझे जो नहीं मिला वह यह है कि उस कोड को कैसे बनाया जाए ताकि यह ठीक से काम करे। यह $ JQuery के इस रूप में उपयोग नहीं किए जाने के कारण है।

तो यहाँ मेरा कोड है और आप इसे एक टेम्पलेट के रूप में उपयोग कर सकते हैं।

jQuery(document).ready(function( $ ){
  $("#btnCalculate").click(function () {
        var val1 = $(".visits").val();
        var val2 = $(".collection").val();
        var val3 = $(".percent").val();
        var val4 = $(".expired").val();
        var val5 = $(".payer").val();
        var val6 = $(".deductible").val(); 
        var result = val1 * (val3 / 100) * 10 * 0.25;
        var result2 = val1 * val2 * (val4 / 100) * 0.2;
        var result3 = val1 * val2 * (val5 / 100) * 0.2;
        var result4 = val1 * val2 * (val6 / 100) * 0.1;
        var val7 = $(".pverify").val();
        var result5 = result + result2 + result3 + result4 - val7;
        var result6 = result5 * 12;
        $("#result").val("$" + result);
        $("#result2").val("$" + result2);
        $("#result3").val("$" + result3);
        $("#result4").val("$" + result4);
        $("#result5").val("$" + result5);
        $("#result6").val("$" + result6);
  });
});

3

यहाँ से उत्तर: https://premium.wpmudev.org/blog/adding-jquery-scripts-wordpress/

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

चूँकि jQuery अभी भी सबसे अधिक इस्तेमाल किया जाने वाला जावास्क्रिप्ट फ्रेमवर्क है, आइए एक नज़र डालते हैं कि आप अपने विषय या प्लगइन में एक साधारण स्क्रिप्ट कैसे जोड़ सकते हैं।

jQuery की संगतता मोड

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

यह बात उबलती है कि आप डॉलर के संकेत का सीधे उपयोग नहीं कर सकते हैं जैसा कि आप अन्य परियोजनाओं में करेंगे। वर्डप्रेस के लिए jQuery लिखते समय आपको इसके बजाय jQuery का उपयोग करने की आवश्यकता होती है। नीचे दिए गए कोड पर एक नज़र डालें कि मेरा क्या मतलब है:


2

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

जावास्क्रिप्ट परिप्रेक्ष्य से शुरू:

  1. एक अलग ".js" फ़ाइल में अपने जावास्क्रिप्ट कार्यों को लिखें

अपने पोस्ट के html में महत्वपूर्ण जावास्क्रिप्ट को शामिल करने के बारे में भी न सोचें - अपने कोड के साथ एक जावास्क्रिप्ट फ़ाइल, या फ़ाइलें बनाएँ।

  1. अपने पोस्ट के HTML के साथ अपने जावास्क्रिप्ट को इंटरफेस करें

यदि आपका जावास्क्रिप्ट विजेट html नियंत्रण और फ़ील्ड के साथ इंटरैक्ट करता है, तो आपको यह समझने की आवश्यकता होगी कि जावास्क्रिप्ट से उन तत्वों को कैसे क्वेरी और सेट करें, और यूआई तत्वों को आपके जावास्क्रिप्ट कार्यों को कैसे करने दें। यहां कुछ उदाहरण दिए गए हैं; सबसे पहले, जावास्क्रिप्ट से:

var val = document.getElementById(“AM_Freq_A_3”).value;

और html से:

<input type="range" id="AM_Freq_A_3" class="freqSlider" min="0" max="1000" value="0" oninput='sliderChanged_AM_widget(this);'/>
  1. अपने जावास्क्रिप्ट विजेट के आरंभीकरण फ़ंक्शन को कॉल करने के लिए jQuery का उपयोग करें

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

jQuery(document).ready(function( $ ) {
    your_init_function();
});
  1. अपने पोस्ट के HTML कोड में, अपनी पोस्ट के लिए आवश्यक स्क्रिप्ट लोड करें

वर्डप्रेस कोड एडिटर में, मैं आमतौर पर पोस्ट के अंत में स्क्रिप्ट निर्दिष्ट करता हूं। उदाहरण के लिए, मेरे पास मेरी मुख्य निर्देशिका में एक स्क्रिप्ट फ़ोल्डर है। मेरे अंदर आम जावास्क्रिप्ट के साथ एक उपयोगिताओं की निर्देशिका है जो मेरे कुछ पोस्ट साझा कर सकते हैं - इस मामले में मेरे अपने गणित उपयोगिता फ़ंक्शन और फ़्लोट्र 2 प्लॉटिंग लाइब्रेरी में से कुछ। उदाहरण के लिए, मीडिया प्रबंधक का उपयोग करने के बजाय दिनांक के आधार पर उपनिर्देशिकाओं के साथ एक और निर्देशिका में पोस्ट-विशिष्ट जावास्क्रिप्ट को समूहित करना मुझे अधिक सुविधाजनक लगता है।

<script type="text/javascript" src="/scripts/utils/flotr2.min.js"></script>
<script type="text/javascript" src="/scripts/utils/math.min.js"></script>
<script type="text/javascript" src="/scripts/widgets/20161207/FreqRes.js"></script>
  1. Enqueue jQuery

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

सबसे पहले, किसी विषय को संपादित करना एक बुरा विचार है - विषय का कोई भी भविष्य का अद्यतन आपके परिवर्तनों को मिटा देगा। बच्चे की थीम बनाओ। ऐसे:

https://developer.wordpress.org/themes/advanced-topics/child-themes/

बच्चे के फ़ंक्शन.php फ़ाइल एक ही नाम के मूल विषय की फ़ाइल को ओवरराइड नहीं करती है, यह इसमें जोड़ता है। चाइल्ड-थीम ट्यूटोरियल सुझाव देता है कि माता-पिता और बच्चे के स्टाइल को कैसे बनाया जाए। फाइल। हम बस उस समारोह में jQuery के लिए भी एक और लाइन जोड़ सकते हैं। बाल विषय के लिए यहाँ मेरे पूरे कार्य हैं।

<?php
add_action( 'wp_enqueue_scripts', 'earlevel_scripts_enqueue' );
function earlevel_scripts_enqueue() {
    // styles
    $parent_style = 'parent-style';
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );

    // posts with js widgets need jquery
    wp_enqueue_script('jquery');
}

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

1

वर्डप्रेस प्लगइन में स्क्रिप्ट फ़ाइल को जोड़ने के लिए आप वर्डप्रेस पूर्वनिर्धारित फ़ंक्शन का उपयोग कर सकते हैं।

wp_enqueue_script( 'script', plugins_url('js/demo_script.js', __FILE__), array('jquery'));

उस पोस्ट को देखें जो आपको यह समझने में मदद करती है कि आप वर्डप्रेस प्लगइन में jQuery और CSS को कितनी आसानी से लागू कर सकते हैं।


1

स्क्रिप्ट को फ़ंक्शंस में डालने के अलावा, आप हेडर, फ़ुटर, जहाँ भी हो, में एक लिंक (एक लिंक rel टैग जो है) शामिल कर सकते हैं।

नहीं। आपको वर्डप्रेस में कभी भी किसी बाहरी स्क्रिप्ट का लिंक नहीं जोड़ना चाहिए। फ़ंक्शन.php फ़ाइल के माध्यम से उन्हें एन्केस्टिंग करना सुनिश्चित करता है कि स्क्रिप्ट सही क्रम में लोड की गई हैं।

उन्हें लागू करने में विफलता के कारण आपकी स्क्रिप्ट काम नहीं कर सकती है, हालांकि यह सही तरीके से लिखी गई है।


1

आप अपनी स्क्रिप्ट को किसी अन्य फ़ाइल में लिख सकते हैं। और अपनी फ़ाइल को इस तरह संलग्न करें जैसे कि आपका स्क्रिप्ट नाम है image-ticker.js

wp_enqueue_script( 'image-ticker-1', plugins_url('/js/image-ticker.js', __FILE__), array('jquery', 'image-ticker'), '1.0.0', true ); 

आप के स्थान पर /js/image-ticker.jsअपने जेएस फ़ाइल पथ रखना चाहिए।


1

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

wp_register_script( $handle, $src )
wp_enqueue_script( $handle, $src )

इन कार्यों को हुक के अंदर कहा जाता है wp_enqueue_script

अधिक विवरण और उदाहरणों के लिए, आप wp_register_script और wp_enqueue_script का उपयोग करके Wordpress में JS फ़ाइलों को जोड़ सकते हैं

उदाहरण:

function webolute_theme_scripts() {
    wp_register_script( 'script-name', get_template_directory_uri() . '/js/example.js', array('jquery'), '1.0.0', true );
    wp_enqueue_script( 'script-name' );
}
add_action( 'wp_enqueue_scripts', 'webolute_theme_scripts' );

1

"हमारे पास Google है"। ठीक से वर्डप्रेस के अंदर स्क्रिप्ट का उपयोग करने के लिए होस्ट किए गए पुस्तकालयों को जोड़ें। गूगल की तरह

चयनित लाइब्रेरी के बाद जिसे आपको अपनी कस्टम स्क्रिप्ट से पहले लिंक की आवश्यकता है: exmpl

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

और अपनी स्क्रिप्ट के बाद

<script type="text/javascript">
    $(document).ready(function () {
        $('.text_container').addClass("hidden");
    });
</script>

0

क्या आपको केवल jquery को लोड करने की आवश्यकता है?

1) जैसे अन्य गाइड कहते हैं, अपने स्क्रिप्ट को अपने कार्यों में पंजीकृत करें। ऐसा करें फाइल:

// register scripts
if (!is_admin()) {
    // here is an example of loading a custom script in a /scripts/ folder in your theme:
    wp_register_script('sandbox.common', get_bloginfo('template_url').'/scripts/common.js', array('jquery'), '1.0', true);
    // enqueue these scripts everywhere
    wp_enqueue_script('jquery');
    wp_enqueue_script('sandbox.common');
}

2) ध्यान दें कि हमें jQuery को पंजीकृत करने की आवश्यकता नहीं है क्योंकि यह पहले से ही कोर में है। सुनिश्चित करें कि wp_footer () को आपके footer.php और wp_head () में कहा जाता है, जिसे आपके शीर्ष लेख में कहा जाता है। (यह वह जगह है जहाँ यह स्क्रिप्ट टैग को आउटपुट करेगा), और jQuery हर पृष्ठ पर लोड होगा। जब आप jQuery को वर्डप्रेस से जोड़ते हैं तो यह "नो संघर्ष" मोड में होगा, इसलिए आपको $ के बजाय jQuery का उपयोग करना होगा। यदि आप चाहें तो jQuery को deregister कर सकते हैं और wp_deregister_script ('jquery') करके अपना पंजीकरण करा सकते हैं।


नहीं, मुझे यह हिस्सा मिल गया। लोड हो रहा है jquery आसान है। मुझे यह जानने की आवश्यकता है कि मेरे jquery कोड को किस फ़ाइल को जोड़ना है, और कैसे।
नागरिक

Wp_enqueue_script ('स्क्रिप्ट का नाम') डालें; टेम्पलेट के get_header () से पहले आप चाहते हैं कि स्क्रिप्ट को नीचे रखना है।
एली कोल

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.