द कोड फ़ील्ड एक वास्तविक कोड संपादक को कस्टम विजेट के पैनल में डालता है सिंटैक्स हाइलाइटिंग, मोनोस्पेस्ड टेक्स्ट, लाइन नंबर, सभी ऐस संपादक के सौजन्य से यह उन मामलों के लिए मौजूद है जहां एक संपादक को गद्य लिखने के बजाय मार्कअप पेस्ट करने की आवश्यकता होती है: एम्बेड स्निपेट, स्कीमा ब्लॉक, बैज एचटीएमएल एक तीसरे पक्ष के मास्टर एडॉन्स के अंदर विजेट बिल्डर, आप हाइलाइटिंग भाषा चुनते हैं और संपादक पैनल में कितना लंबा बैठता है।
प्रत्येक विजेट बिल्डर फ़ील्ड की तरह, कोड फ़ील्ड समर्थन करता है शर्तों पैनल दृश्यता के लिए, और इसके टोकन प्रिंट के माध्यम से ट्विग-सिंटैक्स टेम्पलेट इंजन स्वचालित रूप से सुरक्षित एचटीएमएल के माध्यम से अनुमति दी सेटअप और सीमाओं के लिए दोनों गाइड देखें।
आउटपुट वर्डप्रेस सैनिटाइजेशन के माध्यम से जाता है मूल्य एक सामान्य टोकन के साथ प्रिंट करता है, और रनटाइम इसे पास करता है wp_kses_post, वही फ़िल्टर वर्डप्रेस पोस्ट सामग्री पर लागू होता है सुरक्षित एचटीएमएल टैग जीवित रहते हैं; <script> टैग छीन लिए गए हैं वह डिफ़ॉल्ट साइट को फ़ील्ड में चिपकाया जाने वाले किसी भी चीज़ से बचाता है।
कोड फ़ील्ड क्या करता है #
- विजेट के एलिमेंटर पैनल में एक ऐस कोड संपादक प्रस्तुत करता है, जिसमें आपके द्वारा चुनी गई भाषा के लिए सिंटैक्स हाइलाइटिंग होती है।
- चिपकाया कोड को स्ट्रिंग के रूप में संग्रहीत करता है।
- उस स्ट्रिंग को प्रिंट करता है
{{ your_field_name }}के साथ सैनिटाइज किया गयाwp_kses_postइसलिए अनुमत HTML रेंडर और स्क्रिप्ट हटा दिए जाते हैं। - ऑफर ए
|rawफ़िल्टर एस्केप हैच जो विश्वसनीय-व्यवस्थापक परिदृश्यों के लिए स्वच्छता को बायपास करता है। - पंक्तियों के विकल्प के माध्यम से इसकी दृश्यमान ऊंचाई निर्धारित करता है, इसलिए लंबे स्निपेट को पैनल में जगह मिलती है।
यदि आपने बिल्डर के साथ कभी विजेट नहीं बनाया है, तो पढ़ें विजेट बिल्डर अवलोकन पहला; फ़ील्ड पृष्ठ उस आधारभूत कार्य को मानते हैं।
इससे पहले कि आप शुरू करें #
- वर्डप्रेस साथ तत्व स्थापित और सक्रिय।
- एलिमेंट के लिए मास्टर ऐडऑन स्थापित और सक्रिय प्लगइन के लिए नया? देखना स्थापना गाइड.
- विजेट बिल्डर संपादक में एक कस्टम विजेट खुला हमारा उदाहरण एक ट्रस्ट बैज विजेट है जहां एक कोड फ़ील्ड का नाम दिया गया है
badge_markupबैज HTML स्वीकार करता है जो भुगतान और समीक्षा प्रदाता सौंपते हैं।
कोड फ़ील्ड कैसे जोड़ें #
खींचना कोड फ़ील्ड पैनल से नीचे एक अनुभाग में फ़ील्ड करें सामग्री टैब। मैदान के विकल्प उतरते ही बाईं ओर खुल जाते हैं।
कोड फ़ील्ड विकल्पों की व्याख्या की गई #
- लेबलः एलिमेंटर में संपादक के ऊपर दिखाया गया पाठ, उदाहरण के लिए “बैज मार्कुपैग्मा।
- नाम: आपके टेम्प्लेट जिस विशिष्ट पहचानकर्ता को संदर्भित करते हैं। उदाहरण के लिए, केवल अक्षर, संख्याएँ और अंडरस्कोर
badge_markup. - डिफ़ॉल्टः विजेट जहाजों को कोड शुरू करना, फ़ील्ड क्या अपेक्षा करता है इसके भरे हुए उदाहरण के रूप में उपयोगी है।
- भाषा: सिंटैक्स हाइलाइटिंग मोड, एचटीएमएल, सीएसएस, जावास्क्रिप्ट, और अन्य सामान्य मोड यह केवल हाइलाइटिंग को प्रभावित करता है, न कि टाइप किया जा सकता है।
- पंक्तियाँ: पैनल में संपादक की दृश्यमान ऊंचाई।
कोड फ़ील्ड को उसके टोकन से कनेक्ट करें #
कोड फ़ील्ड एक टोकन फ़ील्ड है इसे प्रिंट करें जहां चिपकाया गया मार्कअप एचटीएमएल पैनल में उतरना चाहिएः
<div class="tb-badges">
{{ badge_markup }}
</div>आउटपुट पर, मान चलता है wp_kses_post। व्यवहार में इसका मतलब है कि वर्डप्रेस पोस्ट सामग्री में टैग की अनुमति देता है। [+] <div>, <a>, <img>, <span>और बाकी, चिपकाए गए के रूप में प्रस्तुत करें, जबकि <script> टैग और इवेंट-हैंडलर विशेषताओं को छीन लिया जाता है सादे मार्कअप से निर्मित बैज या स्कीमा स्निपेट के लिए, डिफ़ॉल्ट व्यवहार बिल्कुल वही है जो आप चाहते हैं।
ध्यान रखें कि केएसईएस चुपचाप टैग को स्ट्रिप्स करता है यदि कोई चिपकाया हुआ स्निपेट पृष्ठ पर आधा-खाली हो जाता है, तो कुछ भी गलत नहीं हुआ; फ़िल्टर ने एक अस्वीकृत टैग को हटा दिया और बाकी को रखा क्लाइंट को विजेट सौंपने से पहले एक बार स्टेजिंग पेज पर प्रदाता स्निपेट का परीक्षण करें, ताकि आप जान सकें कि कौन से हिस्से जीवित हैं।
जब एक स्निपेट को वास्तव में अछूता रहने की आवश्यकता होती है, तो |raw फ़िल्टर स्वच्छता को बायपास करता हैः
{{ badge_markup|raw }}सावधान रहें: |raw आउटपुट जो कुछ भी चिपकाया गया था, स्क्रिप्ट शामिल हैं केवल इसके लिए पहुंचें जब विजेट को संपादित करने वाले सभी लोग पहले से ही अनफ़िल्टर्ड एचटीएमएल, प्रभावी रूप से व्यवस्थापक-स्तर के उपयोगकर्ताओं के साथ भरोसा करते हैं, और कभी भी विजेट पर नहीं जो निचले-विशेषाधिकार संपादकों या क्लाइंट को छू सकते हैं डिफ़ॉल्ट सैनिटाइज़्ड टोकन आपके द्वारा शिप किए गए लगभग हर विजेट के लिए सही विकल्प है।
एक खाली फ़ील्ड के खिलाफ गार्ड जैसे आप किसी भी वैकल्पिक मान को करेंगे, इसलिए एक अप्रयुक्त कोड फ़ील्ड पीछे कोई आवारा रैपर नहीं छोड़ता हैः
{% if badge_markup %}
<div class="tb-badges">{{ badge_markup }}</div>
{% endif %}एलिमेंटर में कोड नियंत्रण का उपयोग करें #
एलिमेंटर में एक पृष्ठ पर अपना कस्टम विजेट जोड़ें, या संपादक को फिर से लोड करें यदि पृष्ठ पहले से ही खुला था कोड फ़ील्ड आपके लेबल के तहत एक अंधेरे संपादक ब्लॉक के रूप में दिखाई देता है, जो आपके द्वारा सेट की गई पंक्तियों के आकार का है।
स्निपेट को चिपकाएं या टाइप करें हाइलाइटिंग आपके द्वारा बिल्डर में चुनी गई भाषा का अनुसरण करती है, जो पृष्ठ को हिट करने से पहले विकृत मार्कअप को स्पॉट करना आसान बनाती है, और पूर्वावलोकन अपडेट फ़ील्ड के रूप में बदलता है।
सामान्य उपयोग के मामले #
- बैज और प्रमाणन मार्कअप भुगतान, सुरक्षा और समीक्षा प्रदाताओं से।
- स्कीमा और संरचित-डेटा स्निपेट एक एसईओ प्लगइन कवर नहीं करता है।
- एम्बेड कोड खिलाड़ियों और रूपों के लिए, जहां सैनिटाइज्ड सबसेट पर्याप्त है।
- कस्टम तालिका या सूची मार्कअप अलग-अलग क्षेत्रों के साथ पुनर्निर्माण करना दर्दनाक होगा।
- विज्ञापन या प्रोमो ब्लॉक जिसका HTML विजेट को पुनः प्रकाशित किए बिना प्रति अभियान बदलता है।
कोड फ़ील्ड के साथ काम करने के लिए युक्तियाँ #
- डिफ़ॉल्ट सैनिटाइजेशन पर भरोसा करें।
wp_kses_postसामान्य मार्कअप बरकरार रखता है और चुपचाप खतरनाक भागों को हटा देता है अधिकांश “my स्निपेट टूट गया है” रिपोर्ट एक छीन ली गई है<script>टैग अपना काम कर रहा है। - रिजर्व
|rawकेवल व्यवस्थापक विजेट के लिए। यह उस टोकन के लिए सुरक्षा जाल को पूरी तरह से अक्षम कर देता है। - सामग्री से मेल खाने के लिए भाषा सेट करें। हाइलाइटिंग एक प्रूफरीडिंग सहायता है; HTML मोड एक नज़र में गायब समापन टैग को दृश्यमान बनाता है।
- एक डिफ़ॉल्ट स्निपेट शिप करें। एक टिप्पणी किया गया उदाहरण संपादकों को दिखाता है कि क्षेत्र में कोड का आकार वास्तव में क्या है।
- टोकन को लपेटें
{% if %}जब स्निपेट वैकल्पिक होता है, तो एक खाली फ़ील्ड कोई खाली कंटेनर नहीं देता है। - गद्य के लिए WYSIWYG का प्रयोग करें। यदि संपादक मार्कअप पेस्ट करने के बजाय टेक्स्ट लिखेंगे, तो WYSIWYG फ़ील्ड मित्रवत नियंत्रण है।
अक्सर पूछे जाने वाले प्रश्न #
मास्टर एडॉन्स विजेट बिल्डर में कोड फ़ील्ड क्या है?
कोड फ़ील्ड एक कस्टम एलिमेंटर विजेट के पैनल में एक सिंटैक्स-हाइलाइटेड ऐस संपादक जोड़ता है संपादक इसमें मार्कअप या स्निपेट पेस्ट करते हैं, और टेम्पलेट इसके साथ मूल्य प्रिंट करता है {{ field_name }}के माध्यम से साफ किया गया wp_kses_post इसलिए अनुमत HTML रेंडर और स्क्रिप्ट टैग हटा दिए जाते हैं।
मेरा चिपकाया गया <स्क्रिप्ट> टैग क्यों नहीं चल रहा है?
सैनिटाइजेशन ने इसे हटा दिया आउटपुट गुजरता है wp_kses_post, जो स्क्रिप्ट टैग की अनुमति नहीं देता है यदि विजेट केवल कभी भी विश्वसनीय व्यवस्थापक द्वारा संपादित किया जाता है, तो {{ field_name|raw }} पेस्ट को अनफ़िल्टर्ड आउटपुट करने की कीमत पर, फ़िल्टर को बायपास करता है।
कोड फ़ील्ड और WYSIWYG फ़ील्ड के बीच क्या अंतर है?
कोड फ़ील्ड सिंटैक्स हाइलाइटिंग के साथ कच्चा स्रोत दिखाता है और मार्कअप और स्निपेट्स के लिए है WYSIWYG फ़ील्ड एक TinyMCE रिच-टेक्स्ट एडिटर दिखाता है जिसका उद्देश्य स्वरूपित गद्य लिखना है। दोनों आउटपुट को स्वच्छ करते हैं wp_kses_post.
क्या भाषा विकल्प प्रतिबंधित करता है कि क्या दर्ज किया जा सकता है?
नहीं, यह केवल सिंटैक्स हाइलाइटिंग मोड, एचटीएमएल, सीएसएस, जावास्क्रिप्ट, और इसी तरह का चयन करता है मोड की परवाह किए बिना किसी भी पाठ को चिपकाया जा सकता है।
क्या मैं HTML पैनल के अलावा कहीं और कोड प्रिंट कर सकता हूँ?
टोकन सभी तीन पैनलों में काम करता है, लेकिन एचटीएमएल पैनल वह जगह है जहां स्निपेट अभ्यास में हैं एक स्टाइलशीट या स्क्रिप्ट ब्लॉक के अंदर सैनिटाइज्ड मार्कअप का बहुत कम अर्थ है।
क्या ग्राहकों को कोड फ़ील्ड वाला विजेट देना सुरक्षित है?
डिफ़ॉल्ट टोकन के साथ, हाँ कारण के भीतरः wp_kses_post उसी HTML उपसमुच्चय को लागू करता है जिसे वर्डप्रेस पोस्ट सामग्री में अनुमति देता है। बचना |raw क्लाइंट-संपादन योग्य विजेट पर, क्योंकि यह उस प्रवर्तन को हटा देता है।
लपेटकर #
विजेट बिल्डर कोड फ़ील्ड बदल जाता है “अपने स्निपेट को यहां पेस्ट करेंसंक्षेप में एक उचित वर्कफ़्लो: पैनल में एक हाइलाइट किया गया संपादक, टेम्पलेट में एक टोकन, और पेस्ट और पेज के बीच वर्डप्रेस-ग्रेड सैनिटाइजेशन के लिए इसका उपयोग करें मार्कअप, रखें |raw दुर्लभ विश्वसनीय मामले के लिए, और तक पहुंचें WYSIWYG फ़ील्ड जब सामग्री कोड के बजाय गद्य है बाकी का अन्वेषण करें मास्टर ऐडऑन विजेट और एक्सटेंशन, और देखें मूल्य निर्धारण पृष्ठ प्रत्येक योजना में क्या शामिल है।