विषय-सूची
यह ३०+ मुफ्त एलिमेंटर सेक्शन टेम्पलेट्स की एक लाइब्रेरी है जो लगभग हर वेबसाइट की जरूरत के दस खंडों को कवर करती है: सुविधाओं, के बारे में, आँकड़े, प्रशंसापत्र, मूल्य निर्धारण, टीम, अक्सर पूछे जाने वाले प्रश्न, कॉल-टू-एक्शन बैंड, संपर्क फ़ॉर्म और लोगो स्ट्रिप्स प्रत्येक एक छोटी जेएसओएन फ़ाइल के रूप में डाउनलोड करता है, मास्टर एडॉन्स विजेट बिल्डर के माध्यम से आयात करता है, और आपके एलिमेंटर पैनल में एक विजेट के रूप में भूमि जहां हर हेडलाइन, बटन, छवि और रंग एक लेबल फ़ील्ड है कोई जमे हुए लेआउट नहीं, कीमत बदलने के लिए नेस्टेड कंटेनरों के माध्यम से कोई शिकार नहीं।
हमने प्रत्येक टेम्पलेट को हाथ से बनाया है जैसे वास्तविक एचटीएमएल, सीएसएस और जावास्क्रिप्ट, फिर इसे विजेट बिल्डर विजेट में परिवर्तित किया अपने स्वयं के सामग्री और शैली नियंत्रण के साथ वह अंतिम चरण इस संग्रह और एक विशिष्ट एलिमेंटर टेम्पलेट लाइब्रेरी के बीच का अंतर है: आप एक पृष्ठ आयात नहीं कर रहे हैं जिसे आप रिवर्स-इंजीनियर में भरते हैं।
एक अनुभाग प्रकार उद्देश्य पर गायब है: नायकों। हमने पहले ही एक समर्पित संग्रह प्रकाशित कर दिया है निःशुल्क एलिमेंटर हीरो अनुभाग टेम्पलेट, एक ही विजेट-आधारित तरीके से बनाया गया है, इसलिए उन्हें यहां दोहराते हुए बस गिनती को पैड करेंगे उस पोस्ट से एक नायक चुनें, इस एक से नीचे के खंडों को ढेर करें, और आपने स्क्रैच से एक भी ब्लॉक डिजाइन किए बिना एक पूर्ण लैंडिंग पृष्ठ इकट्ठा किया है।
सभी ३०+ नीचे हैं, अनुभाग प्रकार द्वारा समूहीकृत, प्रत्येक एक स्क्रीनशॉट और एक प्रत्यक्ष डाउनलोड के साथ आपको जो चाहिए उन्हें पकड़ो या पढ़ें वॉकथ्रू आयात करें पहले।
स्लाइडर दूसरी चीज है जो आपको यहां नहीं मिलेगी एक हिंडोला एक अलग तरह का निर्माण है जैसे समय, खींचें, कीबोर्ड कदम, एआरआईए भूमिकाएं और इसलिए इसे अपना संग्रह मिला हिंडोला और स्लाइडर डिजाइन: एक थंबनेल गैलरी, एक मोज़ेक जिसकी टाइलों में फेरबदल होता है, वास्तविक तिथियों पर पिन की गई एक समयरेखा, एक टैब्ड पैनल सेट, और प्रगति मिलान के साथ एक उद्धरण स्लाइडर।
कुल मिलाकर बीस डिज़ाइन। मुफ़्त प्लगइन पर आठ आयात, इस पृष्ठ पर मौजूद हर चीज़ के समान; अन्य बारह को प्रो की आवश्यकता है। मार्ग किसी भी तरह से समान है, जेएसओएन को विजेट बिल्डर में छोड़ देता है और डिज़ाइन आपके पैनल में आपके द्वारा भरे गए विजेट के रूप में आता है।
पैक में क्या है
| अनुभाग प्रकार | टेम्पलेट्स | कूद पड़ना |
|---|---|---|
| विशेषताएँ/सेवाएँ | 4 | फ़ीचर अनुभाग टेम्पलेट्स |
| हमारे बारे में | 3 | अनुभाग टेम्पलेट्स के बारे में |
| आँकड़े/काउंटर | 2 | आँकड़े बैंड टेम्पलेट्स |
| प्रशंसापत्र | 4 | प्रशंसापत्र टेम्पलेट्स |
| मूल्य निर्धारण टेबल्स | 4 | मूल्य निर्धारण तालिका टेम्पलेट्स |
| टीम | 3 | टीम अनुभाग टेम्पलेट |
| अक्सर पूछे जाने वाले प्रश्न | 4 | अक्सर पूछे जाने वाले प्रश्न अनुभाग टेम्पलेट |
| सीटीए बैंड | 3 | सीटीए बैंड टेम्पलेट्स |
| संपर्क फ़ॉर्म | 3 | संपर्क अनुभाग टेम्पलेट्स |
| लोगो स्ट्रिप्स | 2 | लोगो पट्टी टेम्पलेट्स |
हीरो सेक्शन यहां उद्देश्य पर नहीं हैं हमने पहले से ही एक समर्पित पैक प्रकाशित किया है निःशुल्क एलिमेंटर हीरो अनुभाग टेम्पलेट उसी तरह बनाया गया इस एक से वर्गों के शीर्ष पर उस पोस्ट से एक नायक ढेर और आपने एक पूर्ण लैंडिंग पृष्ठ इकट्ठा किया है।
इन एलिमेंटर सेक्शन टेम्प्लेट को कैसे आयात करें
किसी अनुभाग टेम्पलेट को आयात करने के लिए, उसकी ज़िप डाउनलोड करें, उसे अनज़िप करें, फिर पर जाएँ मास्टर ऐडऑन → विजेट बिल्डर → आयात अपने वर्डप्रेस एडमिन में और JSON फ़ाइल अपलोड करें। टेम्पलेट आपके एलिमेंटर पैनल में एक नए विजेट के रूप में दिखाई देता है। इसे किसी भी पेज पर खींचें और सामग्री और स्टाइल टैब से सब कुछ संपादित करें।
- डाउनलोड करें और अनज़िप करें। प्रत्येक ज़िप में विजेट JSON, एक पूर्वावलोकन छवि और (जहां डिज़ाइन कलाकृति का उपयोग करता है) डेमो छवियां और प्रत्येक को उसके फ़ील्ड में मैप करने वाला एक README होता है।
- JSON आयात करें। वर्डप्रेस एडमिन → मास्टर ऐडऑन → विजेट बिल्डर → विजेट आयात करें। अपलोड करें
widget-*.jsonफ़ाइल। द विजेट बिल्डर मास्टर एडॉन्स प्रो के साथ जहाज; JSON डाउनलोड स्वयं निःशुल्क हैं। - एक पन्ने पर गिरा दो। एलिमेंट खोलें, विजेट का नाम खोजें, इसे खींचें यह स्क्रीनशॉट में आपके द्वारा देखे गए पूर्ण डेमो सामग्री के साथ प्रस्तुत करता है।
- अपना बना लो। प्रत्येक पाठ एक फ़ील्ड है, प्रत्येक बटन में एक लिंक नियंत्रण होता है, प्रत्येक आधार रंग स्टाइल टैब में एक पिकर होता है फ़ोटो का उपयोग करने वाले टेम्प्लेट में खाली छवि स्लॉट होते हैं; अपना स्वयं का या बंडल डेमो आर्ट अपलोड करें।
डेमो छवियों पर एक हेड-अप: वे एसवीजी फाइलें हैं, और वर्डप्रेस बॉक्स से एसवीजी अपलोड को ब्लॉक करता है या तो अपलोड करने से पहले उन्हें पीएनजी/वेबपी में परिवर्तित करें या एसवीजी-सक्षम प्लगइन स्थापित करें विजेट छवियों के बिना भी ठीक प्रस्तुत करते हैं [और छवि स्लॉट खुद को छिपाते हैं जब तक आप उन्हें भरते हैं।
ये विजेट क्यों हैं, पेज टेम्प्लेट क्यों नहीं
आपके द्वारा डाउनलोड किए गए अधिकांश एलिमेंटर सेक्शन सहेजे गए पृष्ठ के टुकड़े हैं वे तब तक सही दिखते हैं जब तक आप उन्हें संपादित करने का प्रयास नहीं करते हैं तब आप नेस्टेड कॉलम के माध्यम से क्लिक करके यह पता लगाने की कोशिश कर रहे हैं कि कौन सा आंतरिक कंटेनर मूल्य पाठ रखता है, और जिस क्षण आप एक रंग बदलते हैं आप इसे नौ स्थानों में बदल रहे हैं।
यहां प्रत्येक टेम्पलेट लेबल नियंत्रण के पीछे अपनी सामग्री के साथ एक एकल विजेट है व्यावहारिक जीतः
- बार-बार की चीजों के लिए दोहराने वाले। मूल्य निर्धारण योजनाएं, अक्सर पूछे जाने वाले प्रश्न आइटम, प्रशंसापत्र, टीम के सदस्य, लोगो सभी पुनरावर्तक फ़ील्ड एक चौथी योजना या दसवीं अक्सर पूछे जाने वाले प्रश्न जोड़ें और लेआउट, एनीमेशन स्टैगर, और नंबरिंग खुद को समायोजित करें अक्सर पूछे जाने वाले प्रश्न टैब टेम्पलेट यहां तक कि आपके द्वारा टाइप की जाने वाली किसी भी श्रेणी से अपनी श्रेणी टैब का पुनर्निर्माण करता है।
- चार से छह आधार रंग पूरे अनुभाग को फिर से थीम देते हैं। द्वितीयक रंगत, बॉर्डर, चमक और छाया सीएसएस वाले बेस पिकर्स से प्राप्त होते हैं
color-mix()। एक बार “Accent” बदलें और बुलेट डॉट्स, लिंक अंडरलाइन्स, फोकस रिंग्स और होवर स्टेट्स सभी अनुसरण करते हैं। - एनिमेशन अंदर भेज देते हैं। काउंट-अप काउंटर, प्रशंसापत्र हिंडोला, बिलिंग टॉगल, अकॉर्डियन भौतिकी, लोगो मार्की: सभी स्कोप जावास्क्रिप्ट जो सम्मान करते हैं
prefers-reduced-motionऔर पृष्ठ पर अन्य विजेट से नहीं लड़ेंगे पैक के पार जो ६९८ लेबल नियंत्रण काम कर रहा है आप अन्यथा कस्टम सीएसएस में करेंगे। - असली कॉपी, लोरेम इप्सम नहीं। प्रत्येक टेम्पलेट अपने स्क्रीनशॉट से काल्पनिक-ब्रांड सामग्री के साथ आयात करता है, इसलिए आप वाक्यों को संपादित कर रहे हैं, प्लेसहोल्डर सूप को घूर नहीं रहे हैं।
सुविधाएँ एवं सेवाएँ अनुभाग टेम्पलेट
किसी भी लैंडिंग पृष्ठ का वर्कहॉर्स चार शैलियों, क्योंकि “फीचर्स” का मतलब सौर इंस्टॉलर की प्रक्रिया व्याख्याकार की तुलना में सास ग्रिड के लिए कुछ अलग है।
१ चिह्न कार्ड ग्रिड

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

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

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

३ डी झुकाव के साथ तीन बड़े छवि कार्ड जो कर्सर का अनुसरण करते हैं, साथ ही हेडर और ग्रिड के बीच एक स्क्रॉलिंग कीवर्ड मार्की आप प्रत्येक टिकर कीवर्ड को एक बार जोड़ते हैं जावास्क्रिप्ट में निर्बाध लूप दोहराव होता है, इसलिए मार्की कभी भी सीम कार्ड नहीं दिखाता है एक छवि, बैज, शीर्षक, पाठ, और लिंक प्रत्येक; तीन पॉडकास्ट-टूल डेमो चित्र ज़िप में जहाज।
छवि शोकेस कार्ड टेम्पलेट डाउनलोड करें (।zip)
हमारे बारे में अनुभाग टेम्पलेट
तीन लेआउट के लिए“आप कौन हैं और मुझे क्यों परवाह करनी चाहिए” अनुभाग आपके पास क्या है द्वारा चुनें: एक अच्छी तस्वीर, एक अच्छी संख्या, या एक अच्छा मिशन।
५ कहानी के साथ छवि बची

एक पोलरॉइड-शैली होवर झुकाव के साथ बाईं ओर फोटो, दाईं ओर कहानी की प्रतिलिपि, तीन गिनती-अप आँकड़े, और एक हस्ताक्षर ब्लॉक आँकड़े पुनरावर्तक उपसर्ग, दशमलव और हजारों अल्पविराम को संभालता है डेमो आपके बिना २,४०० थोक भागीदारों तक गिनती करता है कोड को छूने के लिए बेकरी डेमो दृश्य एसवीजी के रूप में शामिल है।
छवि बाईं कहानी टेम्पलेट डाउनलोड करें (।zip)
६ फ्लोटिंग बैज के साथ छवि सही

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

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

कागज-सफेद, सेरिफ़ अंक, विभाजक रेखाओं पर चार काउंटर जो संख्याओं के चढ़ने के रूप में आकर्षित होते हैं एक कॉलम स्लाइडर डेस्कटॉप ग्रिड को पुन: कॉन्फ़िगर करता है यदि आप चार के बजाय तीन या पांच आँकड़े चलाते हैं, और एक एकल अवधि नियंत्रण धुनें कि सब कुछ कितनी तेजी से गिना जाता है।
लाइट स्टैट्स बैंड टेम्प्लेट (।zip) डाउनलोड करें
9। डार्क स्टैट्स बैंड

उच्च-विपरीत संस्करण: निकट-काली पृष्ठभूमि, चूने का उच्चारण, चमक पल्स के साथ प्रत्येक काउंटर के ऊपर एक आइकन प्रति कार्ड स्वचालित रूप से प्रतीक चक्र (बोल्ट, टरबाइन, घर, ढाल) और प्रत्येक स्टेट अपनी गणना-अप अवधि निर्धारित करता है, इसलिए संख्याएं अनुक्रम में भूमि के बजाय सभी एक बार में तीन क्षेत्रों में विभाजित होती हैं इसलिए उच्चारण शब्द जहां भी आप इसे चाहते हैं वहां बैठता है।
डार्क स्टैट्स बैंड टेम्प्लेट (।zip) डाउनलोड करें
प्रशंसापत्र अनुभाग टेम्पलेट
सबूत दिखाने के चार तरीके, एक पूर्ण हिंडोला से एक एकल विनाशकारी उद्धरण तक यदि आप इस समूह से केवल एक चीज लेते हैं: हिंडोला के डॉट्स आपकी स्लाइड गिनती से उत्पन्न होते हैं, क्योंकि हम सभी ने चार डॉट्स और छह स्लाइड के साथ स्लाइडर्स देखे हैं।
१० प्रशंसापत्र हिंडोला

एक उचित स्लाइडर: तीर बटन, क्लिक करने योग्य डॉट्स, कीबोर्ड नेविगेशन, और ऑटो-ऊंचाई इसलिए छोटे उद्धरण एक लंबा खाली कार्ड नहीं छोड़ते स्लाइड एक पुनरावर्तक (उद्धरण, नाम, भूमिका, अवतार), और डॉट्स हैं और कुल के “एन” लेबल खुद को फिर से बनाते हैं हालांकि आप कई ज़िप में चार डेमो अवतार जहाज करते हैं।
प्रशंसापत्र हिंडोला टेम्पलेट (।zip) डाउनलोड करें
11. चिनाई ग्रिड

सीएसएस-कॉलम चिनाई में छह कार्ड कंपित खुलासा के साथ प्रत्येक पुनरावर्तक पंक्ति एक उद्धरण लेती है (साथ ही लंबे कार्ड के लिए वैकल्पिक दूसरा पैराग्राफ), एक १,५ स्टार रेटिंग, अवतार सर्कल के लिए प्रारंभिक, और एक “फीचरडंबग टॉगल जो एक कार्ड को उच्चारण उपचार देता है सितारे रेटिंग मूल्य से प्रस्तुत करते हैं, इसलिए ४-स्टार समीक्षा चार भरे हुए सितारों को दिखाती है, न कि जो भी हार्डकोड किया गया था।
चिनाई ग्रिड टेम्पलेट (।zip) डाउनलोड करें
12। एकल बड़ा उद्धरण

एक उद्धरण, विशाल सेरिफ़ प्रकार, एक मुखौटा एनीमेशन के साथ लाइन द्वारा लाइन का खुलासा किया आप उद्धरण को एक पैराग्राफ के रूप में पेस्ट करते हैं; जावास्क्रिप्ट इसे संतुलित लाइनों में विभाजित करता है और प्रकट होने का समय देता है, इसलिए १५-शब्द उद्धरण और ४०-शब्द उद्धरण दोनों सही ढंग से चेतन होते हैं नीचे एक छोटी मेटा स्ट्रिप (कमरे, रेटिंग, वर्ष) एक पुनरावर्तक है जिसे आप पूरी तरह से खाली कर सकते हैं।
एकल उद्धरण टेम्पलेट (।zip) डाउनलोड करें
१३ सारांश के साथ रेटिंग कार्ड

समीक्षा-एग्रीगेटर देखो: एक बड़ा गिनती-अप स्कोर, एनिमेटेड वितरण सलाखों (पांच सितारे: ८४%, चार: ११%...), फिर प्रति-कार्ड बैज रंगों के साथ मंच द्वारा टैग किए गए चार समीक्षा कार्ड आंशिक रेटिंग पेंट आंशिक सितारों में से एक में प्रशंसापत्र समूह का सबसे अधिक नियंत्रण है, २४, क्योंकि स्कोर के तहत कैप्शन के लिए बार प्रतिशत से सब कुछ संपादन योग्य है।
रेटिंग कार्ड टेम्पलेट डाउनलोड करें (।zip)
मूल्य निर्धारण तालिका अनुभाग टेम्पलेट
एक वाणिज्यिक साइट पर उच्चतम-दांव अनुभाग, इसलिए हमने एक “universal” तालिका के बजाय चार वेरिएंट बनाए जो किसी के लिए भी फिट नहीं होते हैं। ये चारों काउंट-अप एनिमेशन के माध्यम से अपनी कीमतें चलाते हैं और प्रत्येक बटन पर पूर्ण लिंक नियंत्रण लगाते हैं।
14. क्लासिक तीन स्तरीय

तीन कार्ड, कंपित प्रवेश, कीमतें जो स्क्रॉल पर गिनती हैं योजनाएं एक पुनरावर्तक हैं विशेषताएं एक टेक्स्टएरिया में प्रति सुविधा एक पंक्ति के रूप में जाती हैं, इसलिए योजनाओं में पांच सुविधाएं या खाली स्लॉट के बिना नौ हो सकती हैं एक प्रति-योजना “लोकप्रिय” टॉगल स्विच करता है कि कार्ड का बटन भूत से ठोस उच्चारण तक।
तीन स्तरीय मूल्य निर्धारण टेम्पलेट (।zip) डाउनलोड करें
15। हाइलाइट की गई योजना

एक ही तीन-स्तंभ हड्डियों, लेकिन लोकप्रिय योजना शारीरिक रूप से एक चमक नाड़ी और एक रिबन के साथ अपने पड़ोसियों से ऊपर उठती है हाइलाइट प्रत्येक पुनरावर्तक पंक्ति में एक टॉगल का अनुसरण करता है, इसलिए अगली तिमाही में एक अलग योजना को बढ़ावा देना एक स्विच है, न कि एक फुटर्स आँकड़े पंक्ति (अपटाइम, डेटा सेंटर, समर्थन) बंद किया जा सकता है।
हाइलाइट किए गए प्लान टेम्पलेट (।zip) डाउनलोड करें
१६ तुलना सुविधा सूची

एक वास्तविक फीचर मैट्रिक्स: तीन प्लान कॉलम, फीचर पंक्तियां हां/नहीं/कस्टम मानों के साथ (“५ उपयोगकर्ता”, “अनलिमिटेड”), और एक विस्तार योग्य ब्लॉक जो एक चिकनी ऊंचाई एनीमेशन के साथ छह और पंक्तियों को प्रकट करता है टाइप करें yes या no एक सेल में और यह एक चेक या क्रॉस के रूप में प्रस्तुत करता है; कुछ और टाइप करें और यह पाठ के रूप में प्रिंट करता है कौन सी योजना को “बेस्ट वैल्यूंबाल कॉलम हाइलाइट मिलता है एक ड्रॉपडाउन है ३८ नियंत्रण पर यह पैक में सबसे गहरा टेम्पलेट है।
तुलना सूची टेम्पलेट डाउनलोड करें (।zip)
17। मासिक/वार्षिक टॉगल

सास मानक एक सुलभ स्विच मासिक और वार्षिक मूल्य निर्धारण के बीच प्रत्येक कार्ड को थोड़ा मूल्य-फ्लिप एनीमेशन के साथ फ़्लिप करता है; प्रत्येक योजना में दोनों कीमतें और दोनों “बिल किए गए एस्सेम्ब नोट्स को उसकी पुनरावर्तक पंक्ति में रखा जाता है। “सेव 20%” बैज टेक्स्ट एक फ़ील्ड है, गणित बदलें, बैज बदलें।
बिलिंग टॉगल टेम्पलेट डाउनलोड करें (।zip)
टीम अनुभाग टेम्पलेट
लोग लोगों से खरीदते हैं आप कितना व्यक्तित्व दिखाना चाहते हैं इसके आधार पर तीन लेआउट तीनों प्रति-सदस्य पुनरावर्तक क्षेत्रों के माध्यम से तस्वीरें लेते हैं और स्लॉट खाली होने पर सुंदर रूप से नीचा दिखाते हैं।
18. फोटो कार्ड ग्रिड

ज़ूम-एंड-बॉर्डर-स्वीप होवर के साथ चार पोर्ट्रेट कार्ड प्रति सदस्य नाम, भूमिका और एक-पंक्ति जैव; प्रवेश द्वार किसी भी सदस्य की गिनती के लिए पुनर्गणना करता है यदि आपको वास्तविक हेडशॉट्स एकत्र करते समय प्लेसहोल्डर की आवश्यकता होती है तो चार डेमो पोर्ट्रेट चित्र ज़िप में आते हैं।
टीम कार्ड ग्रिड टेम्पलेट (।zip) डाउनलोड करें
19. होवर-प्रकटीकरण बायोस

पोर्ट्रेट जो होवर, फोकस या टैप पर बायो पैनल को स्लाइड करते हैं, इसलिए यह कीबोर्ड और फोन पर काम करता है, न कि केवल माउस के साथ। प्रत्येक सदस्य पंक्ति में लिंक्डइन, इंस्टाग्राम और ईमेल लिंक नियंत्रण होते हैं, और यदि आपकी टीम ऐसा नहीं करेगी तो पूरी सामाजिक पंक्ति को बंद किया जा सकता है।
होवर बायो टेम्प्लेट (।zip) डाउनलोड करें
20. टीम स्लाइडर

एक समय में एक सदस्य: बड़ी तस्वीर, भूमिका टैग, एक फुलर बायो, और एक “०१/०५” काउंटर जो आपके वास्तविक सदस्य गिनती से पुनर्निर्माण करता है, डॉट्स के समान तीर कुंजी काम करती है छोटी टीमों के लिए अच्छा है जहां प्रत्येक व्यक्ति एक व्यवसाय कार्ड से अधिक का हकदार है।
टीम स्लाइडर टेम्पलेट डाउनलोड करें (।zip)
अक्सर पूछे जाने वाले प्रश्न अनुभाग टेम्पलेट
इस पैक में सबसे बड़ा खोज क्लस्टर और वह अनुभाग जो आपके अंतिम सीटीए से पहले आपत्तियों को मारता है चार बनाता है वे सभी प्रश्न पाठ को वास्तविक शीर्षकों के रूप में प्रस्तुत करते हैं और एआरआईए वायरिंग को बरकरार रखते हैं, जो कहीं और की तुलना में अक्सर पूछे जाने वाले प्रश्न अनुभागों में अधिक मायने रखता है।
21. समझौता

चिकनी ऊंचाई एनीमेशन और घूर्णन प्लस आइकन के साथ एकल-खुला अकॉर्डियन प्रश्न और उत्तर एक पुनरावर्तक हैं; क्या पहला आइटम खुला शुरू होता है एक टॉगल है पाद पंक्ति (“अभी भी अटक गई है हमें लिखें”) का अपना लिंक और ईमेल फ़ील्ड है, क्योंकि वह पंक्ति हमेशा हार्डकोडेड समाप्त होती है और अन्यथा भूल जाती है।
FAQ अकॉर्डियन टेम्पलेट (।zip) डाउनलोड करें
22। दो-स्तंभ प्रश्नोत्तर

कोई क्लिक नहीं सभी छह उत्तर एक क्रमांकित दो-स्तंभ ग्रिड में दिखाई देते हैं, जिसमें कंपित खुलासा होता है ०१,०६ नंबरिंग सीएसएस काउंटर है, इसलिए जब आप सातवें को जोड़ते हैं तो आइटम खुद को फिर से नंबर देते हैं एक अकॉर्डियन से बेहतर जब आपके उत्तर छोटे होते हैं और आप वास्तव में आगंतुकों को पढ़ना पसंद करते हैं।
दो-कॉलम FAQ टेम्पलेट (।zip) डाउनलोड करें
23. श्रेणी टैब

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

बाईं ओर अकॉर्डियन (इस बार बहु-खुला), एक चित्रण, संपर्क चैनल, और तीन अवतार स्लॉट के साथ एक टीम नोट के साथ दाईं ओर एक चिपचिपा समर्थन कार्ड संपर्क चैनल एक चैट/ईमेल/फोन/घड़ी आइकन पिकर प्रति पंक्ति के साथ एक पुनरावर्तक कार्ड का चिपचिपा ऑफसेट एक स्लाइडर है, जब आपकी साइट में वसा तय हेडर होता है।
FAQ समर्थन स्प्लिट टेम्पलेट (।zip) डाउनलोड करें
कॉल-टू-एक्शन बैंड टेम्प्लेट
आखिरी चीज जो आगंतुक पाद लेख से पहले देखते हैं तीन ऊर्जा स्तर: जोर से, उत्पाद-आधारित, और शांत।
25. बोल्ड ग्रेडिएंट

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

बाईं ओर कॉपी और चेकलिस्ट, फ्लोटिंग स्पेक बैज (क्षमता, चार्ज समय, वजन) के साथ दाईं ओर शूट किया गया उत्पाद जो खुद को फिर से स्थापित करता है हालांकि आप कई जोड़ते हैं स्टार रेटिंग डेमो में २,३१८ समीक्षाओं में से ४.८ तक की गणना करती है, और दोनों संख्याएं फ़ील्ड के लिए बनाई गई हैं एक भौतिक उत्पाद लेकिन किसी भी चीज के लिए काम करता है जिसके बारे में डींग मारने लायक चश्मा।
स्प्लिट इमेज सीटीए टेम्पलेट (।zip) डाउनलोड करें
27। न्यूनतम केन्द्रित

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

जानकारी कॉलम (ईमेल, फोन, कार्यालय, साइकलिंग आइकन के साथ एक पुनरावर्तक के रूप में) नाम, ईमेल, कंपनी, एक बजट ड्रॉपडाउन और एक संदेश क्षेत्र के साथ एक फॉर्म के बगल में बजट रेंज अपने स्वयं के पुनरावर्तक हैं प्रत्येक लेबल और प्लेसहोल्डर संपादन योग्य है, जो उस दिन मायने रखता है जब आप साइट का अनुवाद करते हैं।
फॉर्म जानकारी स्प्लिट टेम्पलेट (।zip) डाउनलोड करें
२९ मानचित्र के साथ फार्म

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

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

एक ग्रिड में आठ लोगो, होवर होने तक ग्रेस्केल, नीचे एक काउंट-अप स्टेट के साथ (“1,400+ टीमों के लिए रिपोर्टिंग को सशक्त करना”)। कॉलम एक स्लाइडर हैं, स्टेट पंक्ति टॉगल करने योग्य है, और ग्रेस्केल-टू-कलर होवर आपके द्वारा अपलोड किए गए किसी भी पीएनजी या एसवीजी लोगो पर काम करता है।
स्थिर लोगो ग्रिड टेम्पलेट (।zip) डाउनलोड करें
32. स्क्रॉलिंग मार्की

किनारे के साथ एक अनंत मार्की फीका पड़ जाता है जो होवर पर रुक जाता है और कम गति वाले आगंतुकों के लिए रुक जाता है आप प्रत्येक लोगो को एक बार जोड़ते हैं; जावास्क्रिप्ट में सीमलेस लूप क्लोन को संभाला जाता है स्क्रॉल गति एक स्लाइडर है; डेमो 28-सेकंड का लूप चलाता है, जो उन्मत्त के बजाय आत्मविश्वासपूर्ण लगता है।
स्क्रॉलिंग मार्की टेम्पलेट (।zip) डाउनलोड करें
लैंडिंग पृष्ठ को वास्तव में किन अनुभागों की आवश्यकता होती है?
एक उच्च-परिवर्तित लैंडिंग पृष्ठ एक काफी स्थिर स्क्रॉल ऑर्डर का पालन करता है: नायक, लोगो पट्टी, विशेषताएं, के बारे में या सामाजिक प्रमाण, मूल्य निर्धारण, अक्सर पूछे जाने वाले प्रश्न, अंतिम सीटीए, और संपर्क प्रत्येक पृष्ठ को उन सभी की आवश्यकता नहीं होती है, लेकिन आदेश मायने रखता है, क्योंकि प्रत्येक अनुभाग पिछले एक द्वारा उठाए गए आपत्ति का जवाब देता है।
पैटर्न हम सास, एजेंसी और स्थानीय-व्यापार पृष्ठों में देखते हैं: नायक एक दावा करता है, लोगो पट्टी कहती है कि “अन्य ने इस पर विश्वास किया,” विशेषताएं इसे समझाती हैं, प्रशंसापत्र इसे साबित करते हैं, मूल्य निर्धारण इसे मात्राबद्ध करता है, अक्सर पूछे जाने वाले प्रश्न “हाँ, लेकिन” क्षणों को संभालते हैं, और सीटीए बैंड हर किसी को पकड़ता है जो अभी तक अभी भी अनिर्णीत है स्क्रॉल ऑर्डर इस संग्रह का अनुसरण करता है, ऊपर से नीचे तक आप इस पोस्ट से पूरे पृष्ठ को इकट्ठा कर सकते हैं प्लस द हीरो पैक, या एक पूर्ण से शुरू करें टेम्पलेट किट और अलग-अलग अनुभागों की अदला-बदली करें।
अक्सर पूछे जाने वाले प्रश्न
क्या ये एलिमेंटर सेक्शन टेम्प्लेट वास्तव में मुफ्त हैं?
३०+ टेम्पलेट फ़ाइलें डाउनलोड करने और साइटों की किसी भी संख्या पर उपयोग करने के लिए स्वतंत्र हैं, वाणिज्यिक परियोजनाओं में शामिल हैं उन्हें आयात करने से विजेट बिल्डर का उपयोग होता है, जो का हिस्सा है मास्टर एडॉन्स प्रो, इसलिए आपको प्लगइन सक्रिय की आवश्यकता है, लेकिन आप कभी भी टेम्पलेट्स के लिए भुगतान नहीं करेंगे।
मैं एलिमेंट में एक सेक्शन टेम्पलेट कैसे आयात करूं?
मास्टर ऐडऑन पर जाएं → विजेट बिल्डर → अपने वर्डप्रेस एडमिन में विजेट आयात करें, ज़िप से जेएसओएन फ़ाइल अपलोड करें, फिर एलिमेंटर के साथ कोई भी पेज खोलें और पैनल से नए विजेट को खींचें पूरे राउंड ट्रिप में लगभग दो मिनट लगते हैं; द ऊपर वॉकथ्रू प्रत्येक चरण को कवर करता है।
क्या मैं आयात करने के बाद टेम्प्लेट संपादित कर सकता हूँ?
यही कारण है कि प्रारूप का बिंदु है हर शीर्षक, अनुच्छेद, बटन लेबल, लिंक, छवि, और आधार रंग विजेट की सामग्री और शैली टैब में एक लेबल नियंत्रण है, साथ ही टाइपोग्राफी नियंत्रण और लेआउट स्लाइडर्स अंतराल और कोने त्रिज्या के लिए दोहराए गए आइटम (योजनाएं, अक्सर पूछे जाने वाले प्रश्न, प्रशंसापत्र, लोगो) पुनरावर्तक हैं, इसलिए आप मार्कअप डुप्लिकेट करने के बजाय प्रविष्टियों को जोड़ते हैं और हटाते हैं।
क्या टेम्प्लेट किसी वर्डप्रेस थीम के साथ काम करते हैं?
हाँ प्रत्येक विजेट की शैलियों को अपने स्वयं के रैपर वर्ग के लिए स्कोप किया जाता है, इसलिए यह न तो आपके थीम के अनुभाग स्टाइल को विरासत में लेता है और न ही इसमें शैलियों को लीक करता है टेम्प्लेट मोबाइल के लिए उत्तरदायी हैं और आगंतुक की कम-गति वरीयता का सम्मान करते हैं।
छवियाँ एसवीजी फ़ाइलों के रूप में क्यों आती हैं?
डेमो कलाकृति वेक्टर है, इसलिए यह किसी भी आकार में तेज रहता है वर्डप्रेस डिफ़ॉल्ट रूप से एसवीजी अपलोड को अवरुद्ध करता है, हालांकि, अपलोड करने से पहले बंडल कला को पीएनजी या वेबपी में परिवर्तित करें, या एसवीजी-सक्षम प्लगइन स्थापित करें आपकी खुद की तस्वीरें हर छवि स्लॉट में बिना किसी रूपांतरण के काम करती हैं।
