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

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

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

नोट : आगे बढ़ने से पहले, मुझे लगता है कि आप मूल HTML और CSS जानते हैं और सीएसएस कक्षाओं, ब्लॉक स्तर तत्वों, HTML तत्वों, विशेषताओं इत्यादि जैसी चीजों को समझ सकते हैं।

1. एक प्लगइन का उपयोग करना

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

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

1. किसी भी अन्य वर्डप्रेस प्लगइन की तरह TinyMCE कस्टम शैलियाँ शुरू करने, डाउनलोड करने, स्थापित करने और सक्रिय करने के लिए। सक्रिय करने के बाद, "सेटिंग्स -> TinyMCE कस्टम शैलियों" पर नेविगेट करके प्लगइन सेटिंग पृष्ठ पर जाएं।

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

3. नीचे स्क्रॉल करें और "नई शैली जोड़ें" बटन पर क्लिक करें। अब, शैली का नाम दर्ज करें, एक प्रकार का चयन करें (यानी, इनलाइन, ब्लॉक, या चयनकर्ता), प्रकार मान दर्ज करें, और फिर सीएसएस वर्ग दर्ज करें।

4. सही तरफ से यह चुनना न भूलें कि तत्व "रैपर" है या नहीं। यदि आप इस विकल्प का चयन करते हैं, तो शैली पोस्ट संपादक में चयनित ब्लॉक-स्तर तत्व के चारों ओर एक नया ब्लॉक-स्तर तत्व बनाएगी।

5. यदि आप चाहते हैं कि आप "सीएसएस स्टाइल" श्रेणी के अंतर्गत दिखाई देने वाली "नई शैली जोड़ें" पर क्लिक करके सीधे कस्टम सीएसएस शैलियों को भी जोड़ सकें। हालांकि, मैं अनुशंसा करता हूं कि आप अपनी थीम निर्देशिका में स्थित "editor-style.css" फ़ाइल में उन शैलियों को जोड़ें (यदि आपने दूसरे चरण में मेरे जैसे दूसरे विकल्प का चयन किया है)। यह प्रबंधन करना आसान बनाता है।

6. एक बार पूरा होने के बाद, पृष्ठ के अंत में दिखाई देने वाले "सभी सेटिंग्स सहेजें" बटन पर क्लिक करें।

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

8. यदि आपने संपादक-style.css फ़ाइल में आवश्यक शैलियों को जोड़ा है, तो जब आप ड्रॉपडाउन मेनू से स्टाइल विकल्प का उपयोग करते हैं तो उन शैलियों को पोस्ट एडिटर में दिखाई देगा।

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

संबंधित : वर्डप्रेस में अप्रयुक्त डेटाबेस टेबल्स को कैसे हटाएं

2. मैन्युअल विधि

यदि आप प्लगइन का उपयोग करना पसंद नहीं करते हैं, तो आप अपनी "functions.php" फ़ाइल में एक साधारण कोड स्निपेट जोड़ कर एक ही चीज़ प्राप्त कर सकते हैं। इसमें दो भाग हैं: एक सीएसएस कोड डालने के लिए टूलबार में बटन जोड़ने के लिए है, और दूसरी बात यह है कि सीएसएस शैली पोस्ट एडिटर में रहती है।

टूलबार में कस्टम सीएसएस स्टाइल बटन जोड़ें

अपनी "functions.php" फ़ाइल के अंत में निम्न जोड़ें। यह कोड वास्तव में वर्डप्रेस द्वारा प्रदान किया जाता है।

 // $ बटन सरणी में 'styl चयन' डालने के लिए कॉलबैक फ़ंक्शन my_mce_buttons_2 ($ बटन) {array_unshift ($ बटन, 'स्टाइलसेलेक्ट') फ़ंक्शन; $ बटन वापस करें; } // उचित कॉल add_filter ('mce_buttons_2', 'my_mce_buttons_2') पर हमारे कॉलबैक को पंजीकृत करें; // एमसीई सेटिंग्स को फ़िल्टर करने के लिए कॉलबैक फ़ंक्शन my_mce_before_init_insert_formats ($ init_array) फ़ंक्शन करें // // style_formats array $ style_formats = array परिभाषित करें (// प्रत्येक सरणी बच्चा अपनी स्वयं की सेटिंग्स सरणी ('शीर्षक' =>'translation 'के साथ एक प्रारूप है।, 'ब्लॉक' => 'ब्लॉकक्वोट', 'कक्षाएं' => 'अनुवाद', 'रैपर' => सत्य, ), सरणी ('शीर्षक' => '⇠.rtl', 'block' => 'blockquote', 'कक्षाएं' => 'आरटीएल', 'रैपर' => सत्य, ), सरणी ('शीर्षक' => '.ltr⇢', 'ब्लॉक' => 'ब्लॉकक्वोट', 'कक्षाएं' => 'ltr', ' रैपर '=> सच, ), ); // सरणी, JSON ENCODED, 'style_formats' $ init_array ['style_formats'] = json_encode ($ style_formats) में डालें; $ init_array वापस; } // 'tiny_mce_before_init' add_filter ('tiny_mce_before_init', 'my_mce_before_init_insert_formats') पर कॉलबैक संलग्न करें;

आपको अपने स्टाइल विकल्पों को प्रतिबिंबित करने के लिए कोड को कस्टमाइज़ करना होगा। उपरोक्त कोड में प्रत्येक सरणी एक अलग शैली विकल्प है। "शीर्षक" के बगल में स्थित "शीर्षक", "ब्लॉक" के बगल में स्थित ब्लॉक शीर्षक के आगे अपना शीर्षक शीर्षक दर्ज करें, और यदि तत्व एक रैपर है, तो "wrapper" के बगल में "सत्य" टाइप करें। यदि यह नहीं है, तो टाइप करें "असत्य।"

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

एक बार जब आप अनुकूलन के साथ कर लेंगे, तो अपने सर्वर पर संशोधित "functions.php" फ़ाइल को सहेजें और अपलोड करें।

संपादक स्टाइलशीट बनाएं

"Editor-style.css" नाम के साथ एक फ़ाइल बनाएं। अब, पोस्ट संपादक में प्रासंगिक सीएसएस शैलियों को देखना चाहते हैं। यह न भूलें कि आप "Editor-style.css" फ़ाइल में बना रहे सीएसएस वर्गों को उपरोक्त स्टाइल विकल्प कोड में सीएसएस कक्षाओं से मेल खाना चाहिए।

अब, अपनी थीम की "functions.php" फ़ाइल खोलें और निम्न कोड जोड़ें।

 // कस्टम संपादक स्टाइलशीट फ़ंक्शन mte_add_editor_styles () {add_editor_style ('editor-style.css') जोड़ें; } add_action ('init', 'mte_add_editor_styles');

अपने सर्वर पर "editor-style.css" और "functions.php" फ़ाइल दोनों अपलोड करें। ऐसा करने के लिए सब कुछ है। अब से आप वर्डप्रेस पोस्ट एडिटर से कस्टम स्टाइल विकल्पों का उपयोग कर सकते हैं।

आप रीयल-टाइम में लागू शैलियों को देख सकते हैं।

वर्डप्रेस पोस्ट एडिटर में कस्टम स्टाइल विकल्प जोड़ने के लिए उपरोक्त तरीकों का उपयोग करने के बारे में अपने विचारों और अनुभवों को साझा करने के नीचे टिप्पणी करें।