चुनना

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

नियंत्रण चुनें की विकल्प कुंजियाँ सीधे काम करती हैं शर्तों, इसलिए अन्य फ़ील्ड चुने गए विकल्प के आधार पर और इसके साथ दिखाई दे सकते हैं ट्विग-सिंटैक्स टेम्पलेट इंजन, जहां एक चेक की तरह {% if align == "center" %} अपना मार्कअप स्विच करता है दोनों गाइड विवरण को कवर करते हैं।

चयन की तरह, आपके टेम्पलेट को सौंपा गया मूल्य विकल्प की कुंजी है, न कि इसका शीर्षक चुनें शीर्ष पर क्या जोड़ता है: प्रति विकल्प एक आइकन, एक वैकल्पिक टॉगल-ऑफ व्यवहार, और संरेखण जैसे शुद्ध सीएसएस विकल्पों के लिए एलिमेंट के चयनकर्ताओं तंत्र में एक सीधा रास्ता।

चुनें फ़ील्ड क्या करता है #

• आइकन बटन की एक पंक्ति प्रस्तुत करता है एलिमेंटर पैनल में, आपके द्वारा परिभाषित प्रति विकल्प एक।
• एक कुंजी रखती है परिभाषित सेट से, एक समय में बिल्कुल एक बटन सक्रिय होता है।
• प्रत्येक विकल्प को एक ईकॉन के साथ जोड़ता है, जैसे कि eicon-text-align-left, तो विकल्प एक नज़र में पढ़ता है।
• वैकल्पिक रूप से टॉगल बंद: टॉगल विकल्प चालू होने पर, सक्रिय बटन पर क्लिक करने से यह फिर से अचयनित हो जाता है और मान खाली हो जाता है।
• एक उत्तरदायी ध्वज का समर्थन करता है और सीएसएस सीधे एक चयनकर्ता के माध्यम से लिख सकते हैं, नीचे कवर किया गया।

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

इससे पहले कि आप शुरू करें #

• वर्डप्रेस साथ तत्व स्थापित और सक्रिय।
• एलिमेंट के लिए मास्टर ऐडऑन स्थापित और सक्रिय प्लगइन के लिए नया? देखना स्थापना गाइड.
• विजेट बिल्डर संपादक में एक कस्टम विजेट खुला हमारा उदाहरण एक प्रशंसापत्र विजेट है जिसमें एक “कोट संरेखण” चयनकर्ता है: बाएं, केंद्र, दाएं।

फ़ील्ड चुनें कैसे जोड़ें #

विजेट बिल्डर संपादक में, खोजें चुनना बाईं ओर पैनल में फ़ील्ड, अन्य पसंदीदा फ़ील्ड के साथ समूहीकृत।

इसे नीचे एक अनुभाग में खींचें शैली टैब; संरेखण-प्रकार सेटिंग्स स्वाभाविक रूप से वहां रहते हैं एक बार जब यह भूमि, बाईं ओर क्षेत्र के विकल्प खुले।

समझाए गए फ़ील्ड विकल्प चुनें #

• लेबलः एलिमेंटर में बटन के बगल में दिखाया गया पाठ, उदाहरण के लिए “Quote Alignment”।
• नाम: उदाहरण के लिए, केवल फ़ील्ड, अक्षरों, संख्याओं और अंडरस्कोर के लिए विशिष्ट पहचानकर्ता quote_align.
• विकल्प: प्रत्येक विकल्प एक कुंजी प्लस एक शीर्षक और एक आइकन है शीर्षक बटन का टूलटिप बन जाता है और आइकन एक ईकॉन क्लास है, उदाहरण के लिए eicon-text-align-left कुंजी के लिए left.
• टॉगल करेंः चालू होने पर, सक्रिय बटन पर क्लिक करने से यह फिर से अचयनित हो जाता है और फ़ील्ड का मान खाली हो जाता है यदि विजेट को हमेशा एक मान की आवश्यकता होती है तो इसे छोड़ दें।
• डिफ़ॉल्टः विजेट पहली बार एक पृष्ठ पर ड्रॉप होने पर कुंजी सक्रिय होती है।
• उत्तरदायी: डिवाइस आइकन जोड़ता है ताकि संरेखण प्रति ब्रेकपॉइंट भिन्न हो सके।
• विवरण, लेबल दिखाएँ, विभाजकः मानक प्रदर्शन सेटिंग्स, साथ ही फ़ील्ड दिखाने की शर्तें केवल तभी जब किसी अन्य नियंत्रण का एक निश्चित मान हो।

अपने टेम्पलेट या चयनकर्ता को चुनें से कनेक्ट करें #

दो तारों की शैली हैं संरेखण उदाहरण या तो के साथ काम करता है।

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

<blockquote class="quote align--{{ quote_align }}">
  {{ quote_text }}
</blockquote>

साथ .align--center { text-align: center; } और सीएसएस टैब में दोस्तों सशर्त भी काम करते हैंः {% if quote_align == 'center' %}। चयन की तरह, कुंजी से तुलना करें, शीर्षक से कभी नहीं।

चयनकर्ता विकल्प। चुनें भी एलिमेंट के चयनकर्ताओं तंत्र के माध्यम से सीएसएस लिख सकते हैं, टेम्पलेट को पूरी तरह से छोड़ दें इससे पहले कि आप इस पर भरोसा करें, एक बात पता है: डिफ़ॉल्ट संपत्ति एलिमेंट एक चयनकर्ता चुनें के लिए इंजेक्ट करता है color: {{VALUE}}, जो संरेखण के लिए बेकार है एक कस्टम चयनकर्ता प्रविष्टि को वास्तविक संपत्ति का उच्चारण करना होगाः

text-align: {{VALUE}};

फिर कुंजियाँ वैध CSS मान होनी चाहिए (left, center, right पहले से ही हैं), और {{WRAPPER}} इस प्रकार के मूल्य नियंत्रण के लिए स्वचालित रूप से जोड़ा जाता है, इसलिए शैलियाँ आपके विजेट को लिखे बिना ही आपके पास रहती हैं।

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

एलिमेंट में नियंत्रण चुनें का उपयोग करें #

एलिमेंटर में एक पृष्ठ पर अपना कस्टम विजेट जोड़ें, संपादक को फिर से लोड करना यदि पृष्ठ पहले से ही खुला था नियंत्रण आपके लेबल के तहत आइकन बटन की एक पंक्ति के रूप में दिखाई देता है, जिसमें डिफ़ॉल्ट कुंजी का बटन सक्रिय होता है।

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

सामान्य उपयोग के मामले #

• पाठ संरेखण शीर्षकों, उद्धरणों और कैप्शन के लिए, नियंत्रण का घरेलू मैदान।
• तत्व स्थिति जैसे मीडिया-और-टेक्स्ट कार्ड में बाईं छवि या दाईं छवि।
• दिशा स्विच क्षैतिज बनाम ऊर्ध्वाधर सूचियों और समयसीमा के लिए।
• आकार प्रीसेट जैसे छोटे, मध्यम और बड़े को संशोधक वर्गों में मैप किया गया।
• शो-साइड विकल्प बैज और रिबन के लिए, ऊपर-बाएँ से नीचे-दाएँ कोने तक।

क्षेत्र चुनें के साथ काम करने के लिए युक्तियाँ #

• इसे दो, तीन या चार विकल्पों पर रखें। सात आइकन बटनों की एक पंक्ति पोशाक पहने हुए एक ड्रॉपडाउन है; इसके बजाय चयन करें का उपयोग करें।
• चयनकर्ता का उपयोग करते समय सीएसएस मानों की कुंजी का मिलान करें। चाबियाँ पसंद left और center सीधे अंदर आओ text-align: {{VALUE}} कोई अनुवाद परत के साथ।
• कस्टम चयनकर्ताओं में वास्तविक संपत्ति को परिभाषित करें। डिफ़ॉल्ट इंजेक्टेड प्रॉपर्टी है color: {{VALUE}}है, जो केवल वास्तविक रंग विकल्पों के अनुरूप है।
• यदि टॉगल चालू है तो खाली मान की योजना बनाएं। एक अचयनित फ़ील्ड एक खाली कुंजी प्रिंट करता है, इसलिए align-- कक्षाओं और सशर्त इसे सहन करना चाहिए, या टॉगल बंद रखना चाहिए।
• सशर्त में कुंजियों के विरुद्ध तुलना करें। विकल्प शीर्षक केवल पैनल वाला टेक्स्ट है और कभी भी मेल नहीं खाता {% if %}.
• संरेखण के लिए उत्तरदायी का उपयोग करें। सेंटर-ऑन-मोबाइल, लेफ्ट-ऑन-डेस्कटॉप दो के बजाय एक नियंत्रण है।

अक्सर पूछे जाने वाले प्रश्न #

लपेटकर #

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