ဒရူးပယ်လ်များအတွက် ZURB Foundation မှအဓိကအကြောင်းအရာအသုံးပြုခြင်း

တစ်ဦး Drupal Theme အတွက် ZURB ဖောင်ဒေးရှင်းမှမူဘောင်ရဲ့ Power ကိုရယူပါ

အဲဒီမှာမဖြစ်မီ က Twitter Bootstrap , ZURB ဖောင်ဒေးရှင်းမှ, သင်တော်တော်လေးခလုတ်, ပိတ်ပင်တားဆီးမှု Grid, ဘားတိုး, စျေးနှုန်းစားပွဲ add ပြီးအများကြီးပိုအနည်းငယ်ကောင်းမွန်စွာနေရာချ CSS ကိုအတန်းနှင့်အတူပေးနိုင်ပါတယ်တဲ့မူဘောင်ရှိခဲ့ (နှင့်ဖြစ်ပါသည်) ။ ဒရူးပယ်လ်များအတွက် ZURB ဖောင်ဒေးရှင်းမှဆောင်ပုဒ်နှင့်အတူ, သငျသညျဆိုးဝါးလွယ်ကူခြင်းနှင့်သင်၏ဒရူးပယ်လ် site ပေါ်တွင်ဤအမှုအလုံးစုံတို့ကို bling တိုက်ဖျက်မည်နိုင်ပါတယ်။

အဆိုပါ ZURB ဖောင်ဒေးရှင်းမှမူဘောင်ဆိုတာဘာလဲ

အဆိုပါ ZURB ဖောင်ဒေးရှင်းမှမူဘောင်သင်ဖြစ်နိုင်သင့်ရဲ့ website မှာချင်သောပစ္စည်းပစ္စယများတစည်းများအတွက် CSS ကိုနှင့် Javascript ကုဒ်တစ်ခုစုဆောင်းခြင်းဖြစ်ပါသည်။ ဒါကဖျောပွခလုတ်နဲ့တူနှိပ်မျက်စိသကြားလုံးဒါပေမယ့်လည်းအချို့သောအမှန်တကယ်အံ့သြဖွယ်မသာလည်းပါဝင်သည် တုံ့ပြန်မှု ပါဝါ။

သငျသညျအထူး CSS ကိုအတန်းထည့်သွင်းခြင်းဖြင့်ဤအင်္ဂါရပ်အများစုအသုံးပြုပါ။ ဥပမာအားဖြင့်:

ဒီနေရာမှာတစ်ဦး

။ button ကို ဖြစ်ပါသည်ပြီးတော့ဒီမှာ ဖြစ်ပါတယ်သေးငယ်သော button ကို

အဆိုပါ ZURB ဖောင်ဒေးရှင်းမှမူဘောင်ဒရူးပယ်လ်ကနေလုံးဝသီးခြားဖြစ်ပါသည်။ ပြည်သူ့ WordPress ကို, Joomla, ပင်ပေါ်အသုံးပြုရန် ငြိမ် HTML ကို က်ဘ်ဆိုက်များ။

အဆိုပါ ZURB ဖောင်ဒေးရှင်းမှ Drupal Theme ဆိုတာဘာလဲ

အဆိုပါဒရူးပယ်လ် ZURB ဖောင်ဒေးရှင်းမှဆောင်ပုဒ် (သင်တန်း၏, နှင့်စာရွက်စာတမ်းများကိုဖတ်ရှုခြင်းနှင့်အနည်းငယ်အပိုခြေလှမ်းများယူပြီး) သင်ဖွင့်ဒေါင်းလုဒ်ဖွင့်တဲ့ဆောင်ပုဒ်အားဖြင့်ဤအမှုအလုံးစုံတို့ကို ZURBish ပါဝါတိုက်ဖျက်မည်ခွင့်ပြုပါတယ်။

ဥပမာ, ZURB ဖောင်ဒေးရှင်း jQuery Javascript ကိုစာကြည့်တိုက်များပေါ်တွင်မူတည်သည်, ဒါကြောင့်သင်ဖြစ်ကောင်း jQuery Update ကိုအင်စတောလုပ်ရပါလိမ့်မယ်။ သငျသညျ jQuery အပေါ်အားကိုးအခြား module တွေအသုံးပြုနေခြင်းရှိမရှိစစ်ဆေးပါ။ သငျသညျ jQuery ၏လွန်းသစ်ကိုတစ်ဦးဗားရှင်းကိုသုံးလျှင်, ဤ module တွေအလုပ်လုပ်ရပ်တန့်စေနိုင်သည်။

ဒါ့အပြင်သင်ဖြစ်နိုင်သင့်ကိုယ်ပိုင်ထုံးစံဆောင်ပုဒ်တစ်ခုအခြေစိုက်စခန်းဆောင်ပုဒ်အတိုင်းဤဆောင်ပုဒ်ကိုအသုံးပြုချင်ပါလိမ့်မယ်။ ZURB Foundation မှတကယ်ထွန်းလင်းဘယ်မှာ customization ဖြစ်ပါတယ်။

သင်ကဒရူးပယ်လ်အတွက် ZURB Foundation မှသုံးပါရန်ဒီ Theme လိုအပ်ပါသလား

သင်က ZURB ဖောင်ဒေးရှင်းမှမူဘောင်သုံးစွဲဖို့ဒီဆောင်ပုဒ်မလိုအပ်ပါဘူး။ ၎င်း၏အရိုးရှင်းဆုံးမှာ, ဒီဆောင်ပုဒ်ပဲသင့်ရဲ့ site ကိုမှနျ ZURB ဖောင်ဒေးရှင်းမှ CSS ကိုနှင့် Javascript ကိုဖြည့်စွက်, သင်ကိုယ်တိုင်ကြောင်းပြုပါနိုင်ဘူး။

ဒါပေမဲ့ဒီဆောင်ပုဒ်ပိုမိုလွယ်ကူနှင့်လည်းဒရူးပယ်လ်နှင့်အတူအချို့သောထပ်မံပေါင်းစပ်ပါဝင်သောစေသည်။

Plus အား, သင်နောက်ထပ်ပေါင်းစည်းမှုများအတွက်သေးငယ်အပိုဆောင်း module တွေထည့်နိုင်သည်။ ဥပမာ, ZURB Orbit module ကိုသငျသညျ image ကိုလယ်ကွင်းနှင့်အတူတစ် Orbit ဆလိုက်ရှိုးတည်ဆောက်ပေးနိုင်ပါတယ်။ အဆိုပါ ZURB ရှင်းလင်း module ကိုသငျသညျမီဒီယာပုံရိပ်များနှင့်အတူတုံ့ပြန်မှု Lightbox ဖန်တီးပေးနိုင်ပါတယ်။

မှတ်ချက်: ဒီသေးငယ်တဲ့ module တွေအသုံးပြုခဲ့သေးကိုယ့်ကိုယ်ကို, ဒါသူတို့ဘေးစရာတွေဖြစ်နိုင်ပါတယ်ကြပြီမဟုတ်။ ဒီအရေးအသားက ZURB ရှင်းလင်းသင်လက်ရှိမီဒီယာ 1.x. သုံးနေတယ်ဆိုလျှင်တစ်ဦးအန္တရာယ်ရှိသောအဆင့်မြှင့်ဖြစ်နိုင်ပါတယ်ထားတဲ့မီဒီယာ-2.x-dev, လိုအပ်ပါတယ် ထိုအခါ module တစ်ခုဖှံ့ဖွိုးတိုးတဗားရှင်းများအတွက်လိုအပ်ချက်ကအမြဲတဦးတည်းခေတ္တနားပေးသင့်ပါတယ်။ သို့သော်ဤအများနှင့်အခြား ZURB module တွေသို့ကြည့်မျှော်ရကျိုးနပ်ဖြစ်ကြသည်။

အသုံးပြုခြင်းမှ ZURB ဖောင်ဒေးရှင်းဘယ်ဗားရှင်းကိုရွေးချယ်ပါ

သင် ZURB ဖောင်ဒေးရှင်းမှဆောင်ပုဒ်ကို download လုပ်ပါမီ, သင်အသုံးပြုသင့်သောဗားရှင်းစစ်ဆေးပါ။ အဲဒီမှာ ZURB ဖောင်ဒေးရှင်းမှမူဘောင်၏ကွဲပြားခြားနားသောအဓိကဗားရှင်းဖြစ်ကြသည်ကို၎င်း, ထို အဓိကဗားရှင်းနံပါတ် ဆောင်ပုဒ်ဘို့ကအလုပ်လုပ်တယ်မူဘောင်နဲ့ကိုက်ညီ။ ဒီတော့ဖောင်ဒေးရှင်းမှ 3 နှင့်အတူဆောင်ပုဒ်အလုပ်၏ 7.x- 3 .x ဗားရှင်း, အ 7.x- 4 .x ဗားရှင်း Foundation မှ 4 နှင့်အတူအလုပ်လုပ်ရန်နှင့်, 7.x- 5 .x ဗားရှင်းဖောင်ဒေးရှင်းမှ 5 နှင့်အတူအလုပ်လုပ်ကြသည်။

ဒီအရေးအသားကဆောင်ပုဒ်၏နောက်ဆုံးပေါ်တည်ငြိမ်ဗားရှင်းအဆိုပါ 7.x-5.x ဗားရှင်းဖွံ့ဖြိုးတိုးတက်မှုအတွက်နေဆဲဖြစ်ပါတယ်ဖောင်ဒေးရှင်းမှ 4. နှင့်အတူအလုပ်လုပ်တယ်ရာ 7.x-4.x ဖြစ်ပါသည်။ ဖောင်ဒေးရှင်းမူဘောင်က်ဘ်ဆိုဒ်ကိုသင်ဖောင်ဒေးရှင်းမှ 5 ကိုအသုံးပြုနိုင်ပါလိမ့်မယ်ယူဆပေမယ့်ဒါ, သငျသညျယခုဖောင်ဒေးရှင်း 4 ကပ်ချင်ပေလိမ့်မည်။

ဒါ့အပြင်ဖောင်ဒေးရှင်းက 5 အထူးသဖြင့် jQuery 1,10, အပိုလိုအပ်ချက်ရှိကြောင်း။ မှတ်ထားပါ Foundation မှ 4 သာ jQuery 1.7+ လိုအပ်ပါသည်။

သင်အွန်လိုင်းစာရွက်စာတမ်းများကိုဖတ်ရှုတဲ့အခါမှာသင်အသုံးပြုနေသည့်ဖောင်ဒေးရှင်းဗားရှင်းသတိထားပါ။ သင်မူဘောင်၏နောက်ဆုံး version ကိုမသုံးနေမယ်ဆိုရင်ဒါဟာအထူးသဖြင့်မှန်သည်။ ဒါဟာ feature အသစ်ကသင်၏ Foundation မှ 4 site ပေါ်တွင်အလုပ်မလုပ်ပါဘူးတဲ့အခါမှာစိတ်ပျက်ရ, ထို့နောက်ဖောင်ဒေးရှင်းမှ 5, ပြော, များအတွက်စာရွက်စာတမ်းများကိုဖတ်ရှုခြင်းသို့ချော်ဖို့သေဆုံးသူများလွယ်ကူပါတယ်။

ဥပမာ, ဖောင်ဒေးရှင်းမှ 5 အလတ်စား screen များအတွက်အလယ်အလတ်အတန်း၏တစ်ဖွဲ့လုံးအစုံတို့ပါဝင်သည်။ သငျသညျအပိုခြေလှမ်းများယူမဟုတ်လျှင် Foundation မှ 4 ခုနှစ်တွင်ဤထူးထူးဆန်းဆန်းပျက်ကွက်ပါလိမ့်မယ်။

အသုံးပြုမှုsaß, Compass နှင့် & # 34; _variables.scss & # 34 ;!

သငျသညျမှာဤအမှုအလုံးစုံတို့ကိုဆောင်ပုဒ်များအတွက် CSS ကို tweaks တာပေါ့လျှင်, သင်သေချာအောင်:

အဆိုပါ _variables.scss ဖိုင် drush fst အားဖြင့်အလိုအလျှောက်ဖန်တီးဖြစ်ပါတယ်။ ဒါဟာတစ်ခုတည်းသောဖိုင်ကိုသင်သည်သင်၏ဆောင်ပုဒ် CSS ကိုအတွက် tweaks ချင်ပေလိမ့်မည်နီးပါးဘာမှအဘို့အ variable တွေကိုပါရှိသည်။ ဒါဟာအံ့သြစရာပဲ! အားလုံးတစ်နေရာတည်းတွင်, သင် breadcrumbs နှင့်ပေါ်က default font ကိုကနေမျက်နှာပြင်အကျယ်မှနယ်စပ်မှအရာအားလုံးကိုသတ်မှတ်နိုင်သည်။

ဟုတ်ပါတယ်, သင်အမြဲအဖြစ်ကောင်းစွာနောက်ထပ်ဖိုင်တွေကို set up နိုင်ပါတယ်။ သို့သော် _variables.scss စတင်ရန်တစ်ကြက်သရေနေရာတစ်ခုဖြစ်ပါသည်။

scss မဟုတ်ဘဲ css: အဖိုင် extension သတိပြုပါ။ _variables.scss သုံးစွဲဖို့, သင်saß (က CSS ကို extension ကိုဘာသာစကား) နှင့် Compass (saßနှင့်အတူတညျဆောကျတဲ့မူဘောင်) ကို set up ဖို့လိုအပ်ပါလိမ့်မယ်။ သငျသညျသံလိုက်အိမ်မြှောင် compile လုပ်ခြင်းကို run လိုက်တဲ့အခါ, သင့် scss ဖိုင်များကိုသီးခြားဖိုင်ချစ်စရာကောင်းတဲ့ CSS ကိုသို့လှည့်ပါလိမ့်မယ်။ (ကျနော်သံလိုက်အိမ်မြှောင်လက်ပတ်နာရီကိုကြိုက်တတ်တဲ့ - ဤသင် scss ဖိုင်တွေ tweaks အဖြစ် CSS ကိုအပြေးနှင့်အကို update စောင့်ရှောက်။ )

သင်အမှန်တကယ်တကယ်saßနှင့်အတူနှောငျ့ယှကျချင်ကြဘူးလျှင်, သင်ပုံမှန်အတိုင်း CSS ကိုဖိုင်တွေရေးနှင့်သင့်ဆောင်ပုဒ်ရဲ့ .info ဖိုင်ထဲမှာသူတို့ကိုစာရင်းပြုစုနိုင်ပါတယ်။ အကြှနျုပျမူကားယုံကြည်ကိုးစား - ထိုသေးငယ်သောအချိန်ရင်းနှီးမြှုပ်နှံမှု _variables.scss နီးပါးချက်ချင်းပြန်ပေးဆောင်ပါလိမ့်မည် compile ရန်လုံလောက်သောလေ့လာသင်ယူရန်။

သင်က ZURB Foundation မှသုံးပါခင်မှာ

ZURB Foundation မှအများဆုံးအလွန်အစွမ်းထက်တဲ့ဖြစ်ပါသည်, သို့သော်ဒရူးပယ်လ်နှင့်အတူပေါင်းစည်းခဲ့ရဲ့တစ်ခုတည်းသော Front-အဆုံးမူဘောင်မဟုတ်ပါဘူး။ သငျသညျစဉ်းစားရန်လိုလိမ့်မည် Bootstrap လည်းတစ်ဦး Drupal ဆောင်ပုဒ်ရှိပါတယ်အလားတူမူဘောင်။ ယခုငါ ZURB Foundation မှကိုယ့်ကိုယ်ကိုသုံးပြီးတော့သော်လည်းငါ့သုတေသနပြုလုပ် Bootstrap ထက်စိတ်ကြိုက်ဖို့ပိုပြီးလွယ်ကူကြောင်းကိုညွှန်ပြလို့ပါပဲ။

ဒါ့အပြင်အဆိုပါ Joyride အစိတ်အပိုင်းတော်တော်ချိုမြိန်ပါတယ်။

တဖန်သင်တို့ ZURB ဖောင်ဒေးရှင်း Bootstrap, ဒါမှမဟုတ်တခြား framework ကိုအသုံးပြုနိုင်သည်ဖြစ်စေ, ထိုအရရန်သေချာစေပါ ဒရူးပယ်လ်နှင့်အတူတစ်မူဘောင်ကို အသုံးပြု. အပေါ်အကြံပေးချက်များ