वर्डप्रेस के लिए एक विजेट प्लग इन कैसे बनाएं

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


चरण 1: अपना विजेट प्लग इन बनाएं

मैंने हाल ही में “फ्रीलांसर विजेट्स बंडल” नामक एक प्लगइन बनाया, और कुछ लोगों ने मुझसे पूछा कि इस तरह का प्लगइन कैसे बनाया जाए, इसलिए मैंने इस पोस्ट को लिखने का फैसला किया। पहला कदम प्लगइन का निर्माण है। और जैसा कि आप देखेंगे, यह सबसे कठिन हिस्सा नहीं है। एक बार जब आप इसे सक्रिय कर लेते हैं तो प्लगइन एक अतिरिक्त वर्डप्रेस होता है। वर्डप्रेस सभी उपलब्ध प्लगइन्स को पुनः प्राप्त करने के लिए एक फ़ोल्डर के माध्यम से एक लूप बनाता है और उन्हें बैक ऑफिस में सूचीबद्ध करता है। अपना प्लगइन बनाने के लिए, आपको कोडा (मैक), या ड्रीमविवर (पीसी और मैक) जैसे संपादक की आवश्यकता होगी। मैं आपको अपना प्लगइन वर्डप्रेस की एक स्थानीय स्थापना में बनाने की सलाह देता हूं, इसे लाइव सर्वर पर बनाने से त्रुटि होने पर कुछ परेशानी हो सकती है। तो कृपया, अपने होस्टिंग को रखने से पहले हमारे प्लगइन का परीक्षण करने की प्रतीक्षा करें.

अब फ़ोल्डर wp-content / plugins खोलें। यह वह जगह है जहाँ आप अपना प्लगइन जोड़ने जा रहे हैं। एक नई निर्देशिका बनाएं और इसे “विजेट-प्लगइन” कहें (वास्तव में, यह नाम जो भी आप चाहते हैं) हो सकता है। यहां तक ​​कि अगर हमारे प्लगइन में केवल एक ही फ़ाइल होगी, तो प्रत्येक प्लगइन के लिए एक फ़ोल्डर का उपयोग करना हमेशा बेहतर होता है। अपनी निर्देशिका में, “विजेट-plugin.php” नामक एक नई फ़ाइल बनाएं (यह नाम भी बदला जा सकता है), और इसे खोलें। अब हम कोड की अपनी पहली पंक्तियों को जोड़ने वाले हैं। वर्डप्रेस के तहत एक प्लगइन की परिभाषा कुछ नियमों का पालन करती है जो आप पढ़ सकते हैं यहाँ कोडेक्स पर. यहाँ बताया गया है कि वर्डप्रेस एक प्लगइन को कैसे परिभाषित करता है:

इसलिए, हमें अपनी आवश्यकताओं को पूरा करने के लिए इस कोड को संशोधित करना होगा:

अपनी फ़ाइल सहेजें। हमारे विजेट-plugin.php फ़ाइल में केवल कोड जोड़कर हमने एक प्लगइन बनाया है! ठीक है, अब के लिए प्लगइन कुछ भी नहीं करता है, लेकिन वर्डप्रेस इसे पहचानता है। यह सुनिश्चित करने के लिए कि यह मामला है, अपने प्रशासन पर जाएं, और "प्लगइन्स" मेनू के तहत जाएं। यदि आपका प्लगइन प्लगइन्स सूची में दिखाई देता है तो आप अच्छे हैं, अन्यथा सुनिश्चित करें कि आपने मेरे निर्देशों का पालन किया है और फिर से प्रयास करें। अब आप प्लगइन को सक्रिय कर सकते हैं.

चरण 2: विजेट बनाएं

अब हम स्वयं विजेट बनाने जा रहे हैं। यह विजेट कोर वर्डप्रेस क्लास का विस्तार करने वाला एक PHP वर्ग होगा WP_Widget. मूल रूप से, हमारे विजेट को इस तरह परिभाषित किया जाएगा:

// विजेट क्लास
वर्ग My_Custom_Widget WP_Widget {

// मुख्य रचनाकार
सार्वजनिक समारोह __construct () {
/ * ... * /
}

// विजेट फॉर्म (बैकएंड के लिए)
सार्वजनिक समारोह फॉर्म ($ उदाहरण) {
/ * ... * /
}

// विजेट सेटिंग्स अपडेट करें
सार्वजनिक फ़ंक्शन अपडेट ($ new_instance, $ old_instance) {
/ * ... * /
}

// विजेट प्रदर्शित करें
सार्वजनिक समारोह विजेट ($ args, $ उदाहरण) {
/ * ... * /
}

}

// विजेट रजिस्टर करें
फ़ंक्शन my_register_custom_widget () {
register_widget ('My_Custom_Widget');
}
add_action ('widgets_init', 'my_register_custom_widget');

यह कोड वर्डप्रेस को सिस्टम को विजेट का उपयोग करने में सक्षम होने के लिए आवश्यक सभी जानकारी देता है:

  1. निर्माता, विजेट शुरू करने के लिए
  2.  फार्म () फ़ंक्शन प्रशासन में विजेट फॉर्म बनाने के लिए
  3. अद्यतन () फ़ंक्शन, संस्करण के दौरान विजेट डेटा को बचाने के लिए
  4. और यह विजेट () फ़ंक्शन सामने की ओर विजेट सामग्री प्रदर्शित करने के लिए

1 - कंस्ट्रक्टर

कंस्ट्रक्टर कोड का हिस्सा है जो विजेट नाम और मुख्य तर्कों को परिभाषित करता है, नीचे एक उदाहरण है कि यह कैसा दिख सकता है.

// मुख्य रचनाकार
सार्वजनिक समारोह __construct () {
माता-पिता :: __ निर्माण (
'My_custom_widget',
__ ('मेरा कस्टम विजेट', 'text_domain'),
सरणी (
'अनुकूलित_सेप्टिव_रेफ्रेश' => सत्य,
)
);
}

कृपया विजेट नाम के आसपास __ () का उपयोग न करें, यह फ़ंक्शन वर्डप्रेस द्वारा अनुवाद के लिए उपयोग किया जाता है। मैं वास्तव में आपको हमेशा उपयोग करने की सलाह देता हूं ये कार्य, अपने विषय को पूरी तरह से अनुवाद योग्य बनाने के लिए। और _ Custom_selective_refresh 'पैरामीटर के उपयोग से विजेट को ताज़ा किया जा सकता है रूप> अनुकूलित करें पूरे पृष्ठ को ताज़ा करने के बजाय विजेट को संपादित करते समय केवल विजेट को ताज़ा किया जाता है जब परिवर्तन किया जाता है.

2 - रूप () फ़ंक्शन

यह फ़ंक्शन वह है जो वर्डप्रेस व्यवस्थापक क्षेत्र में विजेट फॉर्म सेटिंग्स बनाता है (या तो सूरत> विजेट या सूरत> कस्टमाइज़> विजेट) के तहत। यह आप वेबसाइट पर प्रदर्शित होने के लिए अपना डेटा दर्ज करेंगे। इसलिए मैं समझाता हूं कि आप अपने विजेट फ़ॉर्म सेटिंग्स में टेक्स्ट फ़ील्ड, टेक्स्ट क्षेत्र, चयन बॉक्स और चेकबॉक्स कैसे जोड़ सकते हैं.

// विजेट फॉर्म (बैकएंड के लिए)
सार्वजनिक समारोह फॉर्म ($ उदाहरण) {

// विजेट डिफॉल्ट सेट करें
$ चूक = सरणी (
'शीर्षक' => '',
'पाठ' => '',
'textarea' => '',
'चेकबॉक्स' => '',
'चुनें' => ',
);

// डिफ़ॉल्ट के साथ वर्तमान सेटिंग्स पार्स करें
निकालने (wp_parse_args ((सरणी) $ उदाहरण, $ चूक)); ?>


get_field_id ('पाठ')); ?> "> get_field_id ('textarea')); ?> ">

/>

यह कोड केवल विजेट (शीर्षक, पाठ, टेक्स्टारिया, चयन और चेकबॉक्स) में 5 फ़ील्ड जोड़ रहा है। तो पहले आप अपने विजेट के लिए डिफॉल्ट्स को परिभाषित करते हैं, फिर अगला फ़ंक्शन डिफॉल्ट्स के साथ आपके विजेट के लिए परिभाषित / सहेजे गए वर्तमान सेटिंग्स को पार्स करता है (इसलिए ऐसी कोई भी सेटिंग जो मौजूद नहीं है, डिफ़ॉल्ट पर वापस नहीं आएगी, जैसे कि जब आप पहली बार एक विजेट जोड़ते हैं आपका साइडबार)। और अंतिम प्रत्येक क्षेत्र के लिए HTML है। प्रपत्र फ़ील्ड जोड़ते समय esc_attr () के उपयोग पर ध्यान दें, यह सुरक्षा कारणों से किया जाता है। जब भी आप अपनी साइट पर एक उपयोगकर्ता-परिभाषित चर गूँजते हैं, तो आपको यह सुनिश्चित करना चाहिए कि यह पहले स्वच्छता है.

3 - अद्यतन () फ़ंक्शन

अद्यतन () फ़ंक्शन वास्तव में सरल है। जैसा कि वर्डप्रेस कोर डेवलपर्स ने वास्तव में शक्तिशाली विजेट एपीआई जोड़ा है, हमें केवल प्रत्येक फ़ील्ड को अपडेट करने के लिए इस कोड को जोड़ना होगा:

// विजेट सेटिंग्स अपडेट करें
सार्वजनिक फ़ंक्शन अपडेट ($ new_instance, $ old_instance) {
$ उदाहरण = $ old_instance;
$ उदाहरण ['शीर्षक'] = isset ($ new_instance ['title'])? wp_strip_all_tags ($ new_instance ['title']): '';
$ उदाहरण ['पाठ'] = isset ($ new_instance ['text'])? wp_strip_all_tags ($ new_instance ['text']): '';
$ उदाहरण ['textarea'] = isset ($ new_instance ['textarea'])? wp_kses_post ($ new_instance ['textarea']): '';
$ उदाहरण ['चेकबॉक्स'] = isset ($ new_instance ['चेकबॉक्स'])? 1: गलत;
$ उदाहरण ['चयन'] = isset ($ new_instance ['select'])? wp_strip_all_tags ($ new_instance ['select']): '';
$ उदाहरण वापस करें;
}

जैसा कि आप देख सकते हैं कि हमें प्रत्येक सेटिंग की जांच करनी है और यदि यह खाली नहीं है तो इसे डेटाबेस में सहेजें। Wp_strip_all_tags () और wp_kses_post () फ़ंक्शन के उपयोग पर ध्यान दें, इनका उपयोग डेटाबेस में जोड़े जाने से पहले डेटा को सैनिटाइज़ करने के लिए किया जाता है। जब भी आप किसी उपयोगकर्ता द्वारा सबमिट की गई सामग्री को डेटाबेस में डाल रहे हैं, तो आपको यह सुनिश्चित करने की आवश्यकता है कि उसके पास कोई दुर्भावनापूर्ण कोड नहीं है। पहला फ़ंक्शन wp_strip_all_tags मूल पाठ को छोड़कर सब कुछ हटा देता है, इसलिए आप इसे किसी भी फ़ील्ड के लिए उपयोग कर सकते हैं जहां अंतिम मान एक स्ट्रिंग है और दूसरा फ़ंक्शन wp_kses_post () पोस्ट सामग्री के लिए उपयोग किया जाने वाला एक ही फ़ंक्शन है और यह मूल HTML के अलावा सभी टैग हटाता है जैसे लिंक , स्पैन, डिव, चित्र, आदि.

4 - विजेट () फ़ंक्शन

विजेट () फ़ंक्शन वह है जो वेबसाइट पर सामग्री का उत्पादन करेगा। यह वही है जो आपके आगंतुक देखेंगे। यह फ़ंक्शन सीएसएस कक्षाओं को शामिल करने के लिए अनुकूलित किया जा सकता है, और विशिष्ट थीम आपके थीम डिस्प्ले से पूरी तरह से मेल खाने के लिए। यहाँ कोड है (कृपया नहीं कि यह कोड आपकी आवश्यकताओं के अनुसार आसानी से संशोधित किया जा सकता है):

// विजेट प्रदर्शित करें
सार्वजनिक समारोह विजेट ($ args, $ उदाहरण) {

अर्क ($ args);

// विजेट विकल्पों की जाँच करें
$ शीर्षक = isset ($ उदाहरण ['शीर्षक'])? apply_filters ('widget_title', $ उदाहरण ['शीर्षक']): ’’;
$ पाठ = isset ($ उदाहरण ['पाठ'])? $ उदाहरण ['पाठ']: '';
$ textarea = isset ($ उदाहरण ['textarea']); $ उदाहरण ['textarea']: '';
$ चयन = isset ($ उदाहरण ['चयन'])? $ उदाहरण ['चयन']: '';
$ चेकबॉक्स =! खाली ($ उदाहरण ['चेकबॉक्स'))? $ उदाहरण ['चेकबॉक्स']: गलत;

// वर्डप्रेस कोर से पहले_गेट हुक (हमेशा शामिल)
गूंज $ पहले_गेट;

// विजेट प्रदर्शित करें
गूंज '
'; // डिस्प्ले विजेट शीर्षक यदि परिभाषित किया गया है अगर ($ शीर्षक) { $। $ शीर्षक। after_title $; } // टेक्स्ट फ़ील्ड प्रदर्शित करें अगर ($ पाठ) { गूंज '

'। $ पाठ। '

'; } // टेक्सटेरिया फ़ील्ड प्रदर्शित करें अगर ($ textarea) { गूंज '

'। $ बनावट। '

'; } // चुनिंदा फ़ील्ड प्रदर्शित करें अगर ($ चयन) { गूंज '

'। $ का चयन करें। '

'; } // चेकबॉक्स सही होने पर कुछ प्रदर्शित करें अगर ($ चेकबॉक्स) { गूंज '

कुछ कमाल है

'; } गूंज '
'; // वर्डप्रेस कोर after_widget हुक (हमेशा शामिल) इको $ after_widget; }

यह कोड जटिल नहीं है, आपको केवल यह याद रखना है कि एक चर सेट है या नहीं, अगर आप इसे प्रिंट करना चाहते हैं, तो आपको यह जांचना है कि आपको एक त्रुटि संदेश मिलेगा.

पूरा विजेट प्लगइन कोड

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

जीथब पर पूरा कोड देखें

निष्कर्ष

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

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map