वर्डप्रेस JavaScript चा योग्य प्रकारे परिचय कसा करतो?JS आणि CSS फाइल्सचे सानुकूल लोडिंग

च्या साठीवर्डप्रेस वेबसाइटप्रोग्रामर, विकसनशीलवर्डप्रेस प्लगइनकिंवा वर्डप्रेस थीम सानुकूलित करताना, काही JavaScript आणि CSS स्क्रिप्टिंग संसाधने संदर्भित केली जातात.

• सहसा, लोक थेट HTML साठी लिंक, स्क्रिप्ट टॅग वापरतात.
• खरं तर, वर्डप्रेसमध्ये अत्याधुनिक फंक्शन्स आणि स्क्रिप्ट्स संदर्भित करण्याच्या पद्धती अंगभूत आहेत.
• तर, वर्डप्रेसच्या अंगभूत पद्धती संदर्भ वापरणे अधिक व्यावसायिक आणि अधिक विस्तारनीय आहे.

सदोष उद्धरण पद्धत

दोन सामान्य उद्धरण पद्धती आहेत, ते ठीक आहे, ते फक्त परिपूर्ण किंवा वाजवी नाही.

प्रकार २:लिंक टॅग सीएसएस फाइल्सचा संदर्भ घेतात

• स्क्रिप्ट टॅग जेएस फाइल्स लागू करतात.येथे तपशीलवार नाही.

प्रकार २:wp_head फंक्शन वापरा

• wp_head फंक्शन काही कस्टम किंवा सिस्टम-परिभाषित सामग्री आउटपुट करण्यासाठी वापरले जाते.
• या फाईलचा संदर्भ देण्यासाठी आम्ही कधीकधी खालील कोड वापरतो:

<?php
add_action('wp_head', 'wpcwl_normal_script');
function wpcwl_normal_script() {
echo '资源文件的链接';
}
?>

• संबंधित फाइल्सचा संदर्भ देण्यासाठी वरील कोड functions.php फाइलमध्ये कॉपी करा.

वर्डप्रेस एनक्यू स्क्रिप्ट संसाधन यंत्रणा

आपल्या सर्वांना माहित आहे की, वर्डप्रेसमध्ये बरेच प्लगइन आहेत:

• जवळजवळ प्रत्येक प्लगइन काही संसाधन फाइलचा संदर्भ देते.
• अपरिहार्यपणे, दोन प्लगइन्सद्वारे संदर्भित संसाधनांमध्ये संघर्ष होईल, जे अस्थिर होतील आणि कार्यक्षमतेवर परिणाम करू शकतात.

wp_enqueue_script फंक्शन वापरा

• वर्डप्रेसमधील संसाधनाचा संदर्भ घेण्यासाठी तुम्ही वापरावेwp_enqueue_scriptएक फंक्शन ज्यामध्ये enqueue हा शब्द enqueueed किंवा sorted function च्या नावावर असतो.
• वर्डप्रेसच्या संसाधने (एनक्यू स्क्रिप्ट्स) एन्क्यूइंग करण्याच्या पद्धतीसह, संदर्भ संबंधित फाइल्स आणि कोर कोडपासून वेगळे केले जातात.
• जर वापरकर्त्याला संसाधन अक्षम करायचे असेल, तर तो कोर कोडमधून बदल न करता तो हटवू शकतो, सुधारू शकतो आणि टिप्पणी करू शकतो.

तसेच, काही सामान्यतः वापरल्या जाणार्‍या लायब्ररी जसे की jQuery, jQuery UI इ. वर्डप्रेसमध्ये तयार केल्या आहेत.

आम्ही अंगभूत लायब्ररीला थेट कॉल करण्यासाठी wp_enqueue_script फंक्शन वापरू शकतो, जे कोड आणि क्लिनर तपशील वाचवते.

तुम्ही तुमच्या स्वतःच्या JS आणि CSS फाइल्सचा संदर्भ देण्यासाठी हे फंक्शन वापरत असल्यास, तुम्हाला ते वापरावे लागेलwp_register_scriptफंक्शन एक अभिज्ञापक (हँडल) नोंदणीकृत करते आणि नंतर वापरतेwp_enqueue_scriptफंक्शन या ध्वजाशी संबंधित संसाधनाला कॉल करते.

वर्डप्रेसमध्ये जेएस आणि सीएसएस फायली योग्यरित्या कशा इंपोर्ट करायच्या?

वर्डप्रेस जेएस आणि सीएसएस पद्धतींचा वाजवी परिचय देते.

प्लगइनमध्ये plugin.css फाइल इंपोर्ट करण्यासाठी तुम्ही खालील कोड वापरू शकता ▼

<?php
function wpcwl_add_styles() {
wp_register_script('plugin_stylesheet', plugins_url('plugin.css', __FILE__));
wp_enqueue_script('plugin_stylesheet');
}

add_action( 'wp_enqueue_scripts', 'wpcwl_add_styles' ); 
?>

आयडेंटिफायर प्लगइन_स्टाईलशीटसह संसाधन तयार करण्यासाठी वरील wp_register_script फंक्शन वापरते.

त्यानंतर, त्याच्या रांगेत विनंत्या जोडाwp_enqueue_scriptsक्रिया चालू आहेत.

फंक्शनचे नाव स्क्रिप्ट असले तरी, त्याचा रिसोर्स फाइलच्या प्रकाराशी काहीही संबंध नाही आणि ते CSS आणि JS दोन्हीसाठी वैध आहे.

wp_register_script फंक्शन खरोखर इतके सोपे नाही, त्यात पाच पॅरामीटर्स असू शकतात:

1) $हँडल:संसाधन ओळखकर्ता.

• 由wp_enqueue_scriptहस्तांतरण

2) $src:संसाधनाचे स्थान.

• सापेक्ष किंवा निरपेक्ष पत्ते पत्ते इत्यादी मिळविण्यासाठी वर्डप्रेस अंगभूत फंक्शन्स वापरतात.
• सामान्यपोझिशनिंगफंक्शन आहेplugins_url,get_template_directory_uriथांबा

3) $deps:विसंबून

• जर तुम्ही jQuery प्लगइनचा संदर्भ घेत असाल आणि तुम्हाला jQuery बिल्डवर अवलंबून राहायचे असेल तर तुम्हाला jQuery भरणे आवश्यक आहे.
• लक्षात घ्या की ते अॅरे म्हणून पास केले आहे.

४) $ver:संसाधन आवृत्ती, पर्यायी.

5) $in_footer:तुम्ही तळाशी ठेवता का?

• साधारणपणे, JS फाइल्स पानाच्या तळाशी ठेवल्या पाहिजेत, तुम्ही हे पॅरामीटर True वर सेट करू शकता, रिकामे किंवा False वर आउटपुट करू शकता.

चला अधिक संपूर्ण JavaScript फाइल संदर्भ उदाहरण पाहूया ▼

<?php
function wpcwl_add_scripts() {
wp_register_script('plugin_script', plugins_url('plugin_script.js', __FILE__), array('jquery'),'1.1', true);
wp_enqueue_script('plugin_script');
}

add_action( 'wp_enqueue_scripts', 'wpcwl_add_scripts' ); 
?>

वर्डप्रेस थीम संसाधने आयात करण्यासाठी wp_enqueue_script वापरतात

वर्डप्रेस थीम डेव्हलपमेंटमधील प्रोग्रामर, वापराwp_enqueue_scriptसंसाधने आयात करा.

• वरील उदाहरणे वर्डप्रेस प्लगइन विकासासाठी संदर्भित संसाधनांची उदाहरणे आहेत.
• विषयात संदर्भित पद्धत समान आहे.

मुख्य फरक म्हणजे थीम अंतर्गत संसाधन फाइल पत्ता मिळविण्यासाठी थीम निर्देशिका मिळविण्यासाठी संबंधित फंक्शन वापरणे.

你 可以 使用get_template_directory_uriवर्तमान थीम निर्देशिका मिळविण्यासाठी फंक्शन.

जर तुम्ही चाइल्ड थीम वापरत असाल तर तुम्हाला ते वापरावे लागेलget_stylesheet_directory_uriसंबंधित संसाधने मिळविण्यासाठी फंक्शनला मूळ थीमची निर्देशिका मिळते.