Drupal साठी ZURB फाउंडेशन थीम वापरणे

एक Drupal थीम मध्ये ZURB फाउंडेशन फ्रेमवर्क ताकद मिळवा

ट्विटर बूटस्ट्रॅप होताच, तेथे (आणि आहे) झुरब फाउंडेशन, एक चौकट ज्यामुळे आपण बरेच बटणे, ब्लॉक ग्रिड, प्रगती बार, मूल्यनिर्धारण सारणी आणि बर्याच चांगल्या दर्जाच्या सीएसएस वर्गांसह बरेच काही करू शकता. ड्रुपलसाठी झुरब फाऊंडेशन थीमसह, आपण आपल्या ड्रापल साइटवर घातक सहजतेने हे सर्व ब्लिइंग करू शकता.

ZURB फाऊंडेशन फ्रेमवर्क म्हणजे काय?

ZURB फाऊंडेशन फ्रेमवर्क म्हणजे सीएसएस आणि जावास्क्रिप्ट कोडचा संग्रह जो आपल्यास कदाचित आपल्या वेबसाइटवर हवे आहे. यामध्ये केवळ क्लिक करण्यायोग्य डोळा कँडी नसून उपरोक्त बटनांचा समावेश आहे परंतु काही खरोखर अद्भुत प्रतिसाद शक्ती देखील समाविष्ट आहे.

आपण विशेष CSS वर्ग जोडून यापैकी बहुतांश वैशिष्ट्ये वापरता. उदाहरणार्थ:

येथे बटण आहे.

आणि हा "लहान बटन"> लहान बटन आहे.

झुरब फाऊंडेशनची रूपरेखा ड्रupलपासून पूर्णपणे वेगळी आहे. लोक हे वर्डप्रेस, जूमला आणि अगदी स्थिर HTML साइट्सवर वापरतात.

ZURB फाउंडेशन Drupal थीम काय आहे?

Drupal ZURB फाऊंडेशन थीम आपल्याला डाउनलोड आणि एक थीम सक्षम करून (आणि दस्तऐवज वाचन आणि काही अतिरिक्त पावले, नक्कीच) करून ही सर्व ZURBish शक्ती मुक्त करण्यासाठी परवानगी देते.

उदाहरणार्थ, झर्ब फाऊंडेशन जीओएस्क्रिप्ट लायब्ररीवर आधारीत आहे, म्हणजे आपल्याला कदाचित jQuery अपडेट स्थापित करावे लागेल. आपण jQuery वर अवलंबून असणार्या कोणत्याही अन्य मोड्यूल्स वापरत आहात किंवा नाही हे तपासा. आपण jQuery ची नवीन आवृत्ती वापरत असल्यास, हे मॉड्यूल कार्य करणे थांबवू शकतात.

तसेच, आपण आपल्या स्वतःच्या सानुकूल थीमसाठी मूळ थीम म्हणून ही थीम वापरू इच्छित असाल ZURB फाउंडेशन खरोखर shines जेथे पसंतीचे आहे.

ड्रुपलमध्ये झुरब फाऊंडेशनचा उपयोग करण्यासाठी तुम्हाला ही थीम आवश्यक आहे का?

ZURB फाउंडेशन फ्रेमवर्कचा वापर करण्यासाठी आपल्याला या थीमची आवश्यकता नाही. त्याच्या सोपा वेळी, ही थीम आपल्या साइटवर फक्त ZURB फाउंडेशन CSS आणि Javascript जोडते आणि आपण ती स्वतः करू शकता

पण ही थीम त्यास सोपी करते, आणि यात द्रुपलसह काही आणखी एकीकरण देखील समाविष्ट आहे.

तसेच, पुढील एकात्मता साठी आपण लहान अतिरिक्त मॉड्यूल्स जोडू शकता. उदाहरणार्थ, झिरबर्ग ऑर्बिॅट मॉड्यूल आपल्याला इमेज फील्डसह ऑर्बिट स्लाइडशो तयार करू देते. ZURB क्लियरिंग मॉड्यूल आपल्याला माध्यम प्रतिमांसह प्रतिसाद लाइटबॉक्सेस तयार करू देतो.

टीप: मी या लहान मॉड्यूल स्वत: अद्याप वापरलेले नाहीत, त्यामुळे ते धोक्यात अडकले असतील. या लेखन म्हणून, ZURB क्लियरिंगला Media-2.x-dev ची आवश्यकता आहे, जे सध्या आपण Media 1.x वापरत असल्यास धोकादायक सुधारणा असू शकते. आणि मॉड्यूलच्या एका विकासासाठी आवश्यक असलेली आवश्यकता नेहमी एक विराम देणे आवश्यक आहे. अद्याप, या आणि इतर ZURB मॉड्यूल मध्ये पहात किमतीची आहेत.

ZURB फाऊंडेशनच्या कोणत्या आवृत्तीचा वापर करावा ते निवडा

आपण ZURB फाउंडेशन थीम डाउनलोड करण्यापूर्वी, आपण कोणती आवृत्ती वापरावी हे तपासा. झर्ब फाऊंडेशनच्या वेगवेगळ्या प्रमुख आवृत्त्या आहेत, आणि थीमसाठीचा मुख्य आवृत्ती क्रमांक फ्रेमवर्कशी संबंधित आहे ज्यायोगे तो कार्य करतो. म्हणून, फाउंडेशन 3 , 7.x- 4 .x आवृत्तींचे फाउंडेशन 4 , आणि 7.x- 5 सह कार्य करते थीमचा 7.x- 3 .x आवृत्ती फाउंडेशन 5 सह कार्य करतात.

या लेखनाप्रमाणे, थीमचे नवीनतम स्थिर आवृत्ती 7.x-4.x आहे, जे फाऊंडेशन 4 सह कार्य करते. 7.x-5.x आवृत्ती अजूनही विकासामध्ये आहे. तर, जरी फाऊंडेशन फ्रेमवर्क वेबसाइट आपल्याला गृहीत धरते की आपण फाऊंडेशन 5 वापरणार आहोत, आता आपल्याला फाऊंडेशन 4 सह रहावे लागेल.

लक्षात घ्या की फाउंडेशन 5 कडे अतिरिक्त आवश्यकता आहे, विशेषतः jQuery 1.10. फाउंडेशन 4 ला फक्त jQuery 1.7+ ची गरज आहे.

आपण ऑनलाइन दस्तऐवजीकरण वाचता तेव्हा आपण वापरत असलेल्या फाउंडेशनची आवृत्ती जाणून घ्या. आपण फ्रेमवर्कच्या नवीनतम आवृत्तीचा वापर करत नसल्यास हे विशेषतः खरे आहे. आपल्या फाऊंडेशन 4 साइटवर नवीन गुणविशेष कार्य करत नसल्यास फाउंडेशन 5 चे म्हणणे डॉक्युमेंटमध्ये वाचणे फारच सोपे आहे, नंतर निराश व्हा.

उदाहरणार्थ, फाउंडेशन 5 मध्ये मध्यम-आकाराच्या स्क्रीनसाठी मध्यम श्रेणीचा संपूर्ण संच समाविष्ट असतो. फाऊंडेशन 4 मध्ये तुम्ही अतिरिक्त पावले उचलली नाहीत तर हे अनाकलनीय ठरतील.

SASS, होकायंत्र आणि & # 34; _variables.scss & # 34; वापरा

आपण या थीमसाठी सीएसएस सुधारण्यास जात असाल तर, आपण हे सुनिश्चित करा:

• आपल्या स्वत: च्या कस्टम उप-थीमसाठी मूळ थीम म्हणून ZURB फाउंडेशन थीमचा वापर करा
• थीमद्वारे प्रदान केलेल्या ड्रश कमांडचा वापर करुन ही उपप्रथा व्युत्पन्न करा. सारखे: ड्रॉ फस्ट your_theme_name
• सुट्टीतील उत्कृष्ट _variables.scss फाईल वाचणे

_variables.scss फाइल स्वयंचलितपणे ड्रश एफएसटी बनवली जाते. या एकल फाईलमध्ये व्हेरिएबल्स आहेत ज्यामुळे आपण आपल्या थीम CSS मध्ये जबरदस्ती करू शकता. हे आश्चर्यकारक आहे! सर्व एकाच ठिकाणी, आपण डीफॉल्ट फॉन्टवरून स्क्रीन रुंदीपर्यंत ब्रेडक्रंबांवर सर्व सीमा सेट करू शकता.

अर्थात, आपण नेहमीच अतिरिक्त फाइल्स देखील सेट करू शकता. पण _variables.scss प्रारंभ करण्यासाठी भव्य अशी जागा आहे.

फाईल एक्सटेन्शनकडे लक्ष द्या: scss, CSS नाही. _ Varariables.scss वापरण्यासाठी, आपल्याला SASS (एक सीएसएस विस्तार भाषा) आणि होकायंत्र (SASS सह तयार केलेले एक चौकट) सेट करणे आवश्यक आहे. जेव्हा आपण होसमझ कंपाइल कराल, तेव्हा आपली स्केब फाइल्स वेगवेगळ्या फाइल्सना सुंदर CSS मध्ये बदलेल. (मी कोपझड घड्याळ प्राधान्य देतो - आपण सीसीएस फाइल्स ट्विक केल्याप्रमाणे हे सीएसटी चालू ठेवते आणि अपडेट करते.)

आपण खरोखर तर, खरंच SASS सह घाबरून करू इच्छित नाही, आपण नेहमीप्रमाणे सीएसएस फायली लिहू आणि आपल्या थीमच्या .info फाइलमध्ये त्यांना सूचीबद्ध करू शकता. पण माझ्यावर विश्वास ठेवा - _variables.scss संकलित करण्यासाठी पुरेसे शिकण्यास लहान वेळ गुंतवणूक जवळजवळ तात्काळ परत दिली जाईल.

आपण ZURB फाउंडेशनचा वापर करण्यापूर्वी

झर्ब फाऊंडेशन उत्कृष्ट आहे, परंतु हे फक्त एक फ्रंट-एंड फ्रेमवर्क नाही जे Drupal सह एकत्रित केले आहे. आपल्याला कदाचित बूटस्ट्रॅप , त्याच फ्रेमवर्कचा विचार करावा लागेल ज्यामध्ये ड्रुपल थीम देखील आहे. आता मी झुरब फाउंडेशनचा उपयोग करीत आहे, पण हेच कारण माझ्या शोधाने सूचित केले की बूटस्ट्रॅपपेक्षा सानुकूल करणे सोपे होते.

तसेच, जॉयराइडचा घटक खूपच सुंदर आहे.

आणि आपण ZURB फाऊंडेशन, बूटस्ट्रॅप किंवा काही अन्य चौकट वापरत असाल, तरी ही ड्रपलसह फ्रेमवर्क वापरण्यावर या टिप्स मिळविण्याची खात्री करा.