कैसे एक प्लगइन में JavaScripts enqueue करने के लिए


14

मैं इस समय एक बहुत संघर्ष कर रहा हूं जिसमें प्लगइन फोल्डर में जावास्क्रिप्ट फाइल शामिल है।

मैं थीम निर्देशिका से विजेट फ़ाइलों को स्थानांतरित करके एक प्लगइन बनाने की कोशिश कर रहा हूं। मैंने विजेट फ़ाइल की प्रतिलिपि बनाई, लेकिन वह विजेट फ़ाइल एक जावास्क्रिप्ट फ़ाइल पर निर्भर थी इसलिए मैंने प्लगइन निर्देशिका में एक / js / फ़ोल्डर बनाया। जहाँ इस फाइल को "jquery.repeatable.js" होस्ट किया गया है

मैंने इस कोड का उपयोग किया है, लेकिन यह js फ़ाइल को शामिल नहीं करता है -

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

मैंने इसे मंच पर खोजा- /programming/31489615/call-a-js-file-from-a-plugin-directory

लेकिन फिर भी यह मददगार नहीं था।

मैं अपने प्रश्न का पुन: सारांश प्रस्तुत कर रहा हूं। मेरी प्लगइन निर्देशिका में इस फ़ोल्डर के अंतर्गत एक js फ़ाइल है - / js /

मैं इसे शामिल करना चाहता हूं कि सही प्रक्रिया क्या है, क्या मुझे कुछ भी पंजीकृत करने की आवश्यकता है?

क्या इस हिस्से में कुछ गड़बड़ है - 'admin_enqueue_scripts'?


जवाबों:


30

आपका कोड सही प्रतीत होता है, लेकिन यह स्क्रिप्ट को केवल उस व्यवस्थापक क्षेत्र में लोड करेगा, जहां आप स्क्रिप्ट को admin_enqueue_scriptsक्रिया में संलग्न कर रहे हैं ।

स्क्रिप्ट को फ़्रंट में लोड करने के लिए, wp_enqueue_scriptsएक्शन का उपयोग करें (जो कि wp_enqueue_script()फ़ंक्शन समान नहीं है ):

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

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

उदाहरण के लिए, यदि स्क्रिप्ट का संस्करण 1.0 है:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

यदि आप इसे व्यवस्थापक क्षेत्र में लोड करना चाहते हैं:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

1

अपडेट:

इसके बजाय इस कोड का उपयोग करें

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

3 पैरामीटर निर्भरता घोषित करने के लिए है और 4 एक संस्करण को परिभाषित करने के लिए है।

के सेट 5rd पैरामीटर wp_enqueue_script()के लिए true। इसका अर्थ है, यह फ़ाइल पाद लेख में लोड की जाएगी।


का तीसरा पैरामीटर wp_enqueue_script()स्क्रिप्ट की निर्भरता घोषित करना है। यदि आप पाद लेख में या हेडर में स्क्रिप्ट लोड करना चाहते हैं तो पांचवा पैरामैटर चुनना है। वैसे भी, मुझे नहीं लगता कि वें स्थान को लोड करने से कोई फर्क पड़ता है।
साइबरमेट

धन्यवाद। मैंने कहीं किसी अन्य प्लगइन में पढ़ा कि कुछ इस तरह से कर रहे हैं - wp_enqueue_script ('जम्पर', get_template_directory_uri ()। '/js/jquery.zumper.min.js',array('jquery'),false,true); आपने कहा कि 3 जी को सही तरीके से सेट करने का मतलब है कि यह पाद में लोड होगा, फिर यह गलत, सच्चा संयोजन का क्या मतलब है?
WP इंटरमीडिएट

मैंने अपना उत्तर अपडेट कर दिया है। क्या यह काम करता है?
mukto90

1

मैं आमतौर पर enqueue प्राप्त करने के लिए plugins_url () विधि का उपयोग करता हूं

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugins_url('js/jquery.repeatable.js', __FILE__ ), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.