बॉक्स छाया

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

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

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

बॉक्स शैडो फ़ील्ड क्या करता है #

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

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

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

• वर्डप्रेस साथ तत्व स्थापित और सक्रिय।
• एलिमेंट के लिए मास्टर ऐडऑन स्थापित और सक्रिय प्लगइन के लिए नया? देखना स्थापना गाइड.
• विजेट बिल्डर संपादक में एक कस्टम विजेट खुला हमारा उदाहरण एक प्रशंसापत्र विजेट है जिसका <article class="quote-card"> संपादक-नियंत्रित छाया ले जाना चाहिए।

बॉक्स छाया फ़ील्ड कैसे जोड़ें #

विजेट बिल्डर संपादक में, बाईं ओर फ़ील्ड पैनल को तब तक स्क्रॉल करें जब तक आपको यह न मिल जाए बॉक्स छाया फ़ील्ड, अन्य शैली समूह फ़ील्ड जैसे पृष्ठभूमि और टेक्स्ट शैडो के साथ सूचीबद्ध है।

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

बॉक्स छाया फ़ील्ड विकल्पों की व्याख्या की गई #

• लेबलः एलिमेंटर में नियंत्रण के बगल में दिखाया गया पाठ, उदाहरण के लिए “कार्ड शैडो”।
• नाम: केवल फ़ील्ड, अक्षरों, संख्याओं और अंडरस्कोर के लिए विशिष्ट पहचानकर्ता।
• चयनकर्ता: सीएसएस चयनकर्ता छाया लागू होता है यह कनेक्शन ही है, अगले कवर किया गया।
• फ़ील्ड विकल्प: समूह के अंदर उप-नियंत्रण के लिए ओवरराइड करता है, जैसे कि छाया शुरू होने वाले डिफ़ॉल्ट मान को बदलना।
• विवरण, शो लेबल, सेपरेटर और शर्तें सामान्य प्रदर्शन विकल्प हैं।

अपने चयनकर्ता पर फ़ील्ड इंगित करें #

हर समूह नियंत्रण की तरह, बॉक्स शैडो फ़ील्ड में कोई नहीं है {{shortcode}} अपने सीएसएस के लिए। एक छाया कई मूल्यों को एक संपत्ति में लुढ़का हुआ है, और एक {{ token }} फ़ील्ड प्रिंट के लिए कुछ भी उपयोगी नहीं है। द चयनकर्ता विकल्प संपूर्ण कनेक्शन है।

प्रशंसापत्र कार्ड के लिए, चयनकर्ता हैः

{{WRAPPER}} .quote-card

• {{WRAPPER}} विजेट के अपने कंटेनर के लिए खड़ा है और छाया को इस विजेट पर स्कोप रखता है समूह नियंत्रण चयनकर्ता का उपयोग ठीक उसी तरह करते हैं जैसे आप इसे लिखते हैं, इसलिए टाइप करें {{WRAPPER}} अपने आप।
• .quote-card क्या आपके विजेट HTML के अंदर वह तत्व है जिस पर छाया पड़ती है।

सावधान रहें: बिना चयनकर्ता {{WRAPPER}} हर से मेल खाता है .quote-card पृष्ठ पर, इसलिए एक विजेट की छाया सेटिंग्स उन सभी को पुनर्स्थापित करती हैं कुछ भी आपको चेतावनी नहीं देता है शैलियों बस फैल जाती हैं।

विजेट के सीएसएस टैब में एक फ़ॉलबैक छाया रखें यदि डिज़ाइन एक पर निर्भर करता है यह पहली बूंद पर नज़र है, और एक संपादक पॉपओवर खोलने के बाद नियंत्रण के मूल्यों को ले जाता है।

एलिमेंटर में बॉक्स शैडो नियंत्रण का उपयोग करें #

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

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

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

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

बॉक्स शैडो फ़ील्ड के साथ काम करने के लिए युक्तियाँ #

• चयनकर्ता विकल्प संपूर्ण कनेक्शन है। सीएसएस टैब के लिए कोई बॉक्स शैडो टोकन नहीं है; समूह नियंत्रण के साथ एक की अपेक्षा करना सबसे आम गतिरोध है।
• चयनकर्ता को हमेशा इसके साथ प्रारंभ करें {{WRAPPER}}. फ़ील्ड इसे कच्चे का उपयोग करता है, और इसे छोड़ने से पृष्ठ पर प्रत्येक मिलान तत्व पर छाया फैल जाती है।
• इसे सीमा और आयामों के साथ समूहित करें। तीन फ़ील्ड मिलकर पैनल में एक संपूर्ण कार्ड-स्टाइलिंग अनुभाग बनाते हैं।
• रंग अल्फा पर झुकें, अंधेरे पर नहीं। १० से १५ प्रतिशत अस्पष्टता पर एक काली छाया एक ठोस ग्रे से बेहतर पढ़ती है, और यह आपके क्षेत्र के विवरण में एक नोट के लायक है।
• विजेट सीएसएस में फ़ॉलबैक रखें। यदि डिज़ाइन को डिफ़ॉल्ट रूप से छाया की आवश्यकता है, तो इसे स्टाइलशीट में शिप करें और नियंत्रण को इसे ओवरराइड करने दें।

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

लपेटकर #

विजेट बिल्डर बॉक्स शैडो फ़ील्ड संपादकों को गहराई पर वास्तविक नियंत्रण देता है: एक फ़ील्ड, एक चयनकर्ता से शुरू होता है {{WRAPPER}}और पूरा शैडो पॉपओवर पैनल में दिखाई देता है। यह उसी चयनकर्ता मॉडल पर काम करता है टाइपोग्राफी क्षेत्रू, तो सेटअप समूह नियंत्रणों के बीच सीधे ले जाता है बाकी का अन्वेषण करें मास्टर ऐडऑन विजेट और एक्सटेंशन, और देखें मूल्य निर्धारण पृष्ठ प्रत्येक योजना में क्या शामिल है।