ZURB Foundation тақырыбын Drupal үшін пайдалану

ZURB Foundation Framework жобасының күшін Drupal тақырыбында алыңыз

Twitter Bootstrap бұрын, ZURB Foundation (және ZURB Foundation) бар еді, ол сізге әдемі түймелерді, блоктау торларын, прогресс жолақтарын, баға белгілеу кестелерін және тағы бірнеше CSS-нің бірнеше сыныптарымен толықтыруға мүмкіндік береді. ZURB Foundation тақырыбымен Drupal үшін, сіз Drupal сайтындағы барлық бұл құбылыстарды қатал жеңілдете аласыз.

ZURB Foundation Framework дегеніміз не?

ZURB Foundation негізі CSS және Javascript кодының жиынтығы. Бұл тек жоғарыда көрсетілген түймешіктер сияқты көзге көрінетін көзге арналған кәмпит ғана емес, сонымен қатар шын мәнінде ғажайып жауап беретін күшті қамтиды.

Сіз арнайы CSS сыныптарын қосу арқылы осы мүмкіндіктердің көпшілігін пайдаланасыз. Мысалы:

Міне, button

ZURB Foundation құрылымы Drupal-ден мүлдем бөлек. Адамдар оны WordPress, Joomla, тіпті статикалық HTML сайттарында пайдаланады.

ZURB Foundation Drupal тақырыбы қандай?

Drupal ZURB Foundation тақырыбы тақырыпты жүктеу және қосу арқылы (және құжаттарды оқып, әрине, бірнеше қосымша қадамдар жасау арқылы) осы ZURBish күшінің барлығын ашуға мүмкіндік береді.

Мысалы, ZURB Foundation jQuery Javascript кітапханасына сүйенеді, сондықтан сізге jQuery жаңартуын орнату керек болады. JQuery-ге сүйенген басқа модульдерді пайдаланып жатқаныңызды тексеріңіз. JQuery-ті жаңа нұсқасын қолдансаңыз, бұл модульдер жұмысын тоқтатуы мүмкін.

Сондай-ақ, өз тақырыбыңыз үшін негізгі тақырып ретінде осы тақырыпты пайдаланғыңыз келуі мүмкін. «ZURB» қоры шын мәнінде жарқырайды.

ZURB Foundation-ты Drupal-да пайдалану керек пе?

ZURB Foundation құрылымын пайдалану үшін осы тақырып қажет емес. Ең қарапайым, бұл тақырып ZURB Foundation CSS және Javascript-ті сайтқа қосады және сіз қолмен жасай аласыз.

Бірақ бұл тақырып жеңілдетеді және одан әрі Drupal-мен біріктіруді қамтиды.

Сонымен қатар, одан әрі интеграциялау үшін қосымша шағын модульдер қосуға болады. Мысалы, ZURB Orbit модулі кескін өрістері бар Orbit слайдшоуын құруға мүмкіндік береді. ZURB клиринг модулі Медиа кескіндері бар жауап беретін жарық диапазондарын жасауға мүмкіндік береді.

Ескерту: Мен осы кішкентай модульдерді әлі де өзім пайдаланған жоқпын, сондықтан олар қауіп-қатерге толы болуы мүмкін. Бұл жазба бойынша ZURB Клирингте Media-2.x-dev қажет, егер сіз қазіргі уақытта Media 1.x қолдансаңыз қауіпті жаңартулар болуы мүмкін. Модульді әзірлеу нұсқасы әрдайым бір үзіліс беруі керек. Дегенмен, осы және басқа ZURB модульдері қарап тұр.

ZURB Foundation қандай нұсқасын қолдануға болатынын таңдаңыз

ZURB Foundation тақырыбын жүктемес бұрын қандай нұсқаны қолдануға болатындығын тексеріңіз. ZURB Foundation құрылымының әртүрлі негізгі нұсқалары бар және тақырыптың негізгі нұсқасы оның жұмыс істеу шеңберіне сәйкес келеді. Осылайша, Foundation 3- те 7x- 3 .x нұсқасы жұмыс істейді, 7.x- 4 .x нұсқалары Foundation 4- мен жұмыс істейді және 7.x- 5 .x нұсқалары Foundation 5- мен жұмыс істейді.

Бұл жазба бойынша, тақырыптың ең соңғы тұрақты нұсқасы - Foundation 4.x-4.x нұсқасы. 7.x-5.x нұсқасы әлі де әзірленуде. Осылайша, Foundation Foundation веб-сайты Foundation 5-ні пайдаланатындығын болжаса да, сіз Foundation 4-іне қазір қалғыңыз келуі мүмкін.

Сондай-ақ, Қордың қосымша талаптары бар, әсіресе jQuery 1.10. Foundation 4 jQuery 1.7+ ғана қажет.

Интернеттегі құжаттаманы оқыған кезде Қордың қандай нұсқасын пайдаланатыныңызды біліңіз. Бұл, ең алдымен, құрылымның соңғы нұсқасын пайдаланбасаңыз дұрыс болады. Қордың 5-бөлімінде құжаттарды оқып-үйрену оңай болмайды, содан кейін Foundation-тің 4-бөлімінде жаңа мүмкіндік жұмыс істемесе, көңіліңіз толады.

Мысалға, Foundation 5 орташа өлшемді экрандар үшін орташа сыныптардың жиынтығын қамтиды. Foundation 4-те, қосымша қадамдар жасамайынша, олар жұмбақ болады.

SASS, Compass және & # 34; _variables.scss & # 34 ;! пайдалану

Егер сіз осы тақырыпқа арналған CSS-ні ​​тындыратын болсаңыз, онда сіз:

• ZURB Foundation тақырыбын өзіңіздің жеке субтегіңіз үшін негізгі тақырып ретінде пайдаланыңыз
• Тақырып бойынша берілген drush пәрменін пайдаланып, осы ішкі тақырыпты жасаңыз. Мынау сияқты: fst your_theme_name
• Үздік _variables.scss файлын қарап шығыңыз

_variables.scss файлы автоматты түрде drush fst арқылы жасалады. Бұл жалғыз файл сіздің CSS тақырыбыңызда бұрылуға болатын барлық нәрселер үшін айнымалыларды қамтиды. Бұл ғажап! Бәрін бір жерде сіз бәрін әдепкі қаріптен экранның еніне нанның кескіндеріндегі шекараға дейін орнатуға болады.

Әрине, әрдайым қосымша файлдарды орнатуға болады. Бірақ _variables.scss - бастау үшін керемет орын.

Файл кеңейтіміне назар аударыңыз: scss емес, css. _variables.scss функциясын пайдалану үшін SASS (CSS кеңейтілу тілі) және Compass (SASS көмегімен салынған негіз) орнату қажет. Компас компиляциясын іске қосқан кезде, scss файлдары жеке CSS файлдарға айналады. (Мен компастың сағатын көремін - бұл skss файлдарын бұрып жатқанда, CSS-ды іске қосып жаңартады.)

Егер сіз шынымен шын мәнінде SASS-пен алаңдағыңыз келмесе, әдеттегідей CSS-файлдар жаза аласыз және оларды тақырыптың .info файлында тізімдеуге болады. Бірақ мені сеніңіз - _variables.scss компиляциясы үшін жеткілікті үйрену үшін кішкене уақыттағы инвестиция дереу төленеді.

ZURB Foundation-ды қолданар алдында

ZURB Foundation - ең керемет, бірақ бұл Drupal-мен біріктірілген жалғыз фреймворк емес. Сіз Drupal тақырыбы бар ұқсас құрылымды Bootstrap деп қарастырғыңыз келуі мүмкін. Мен қазір ZURB Foundation-ды өзіме пайдаланамын, бірақ менің зерттеулерімімде Bootstrap-ге қарағанда, өзіңіздің баптауларыңыз оңай болғандығын көрсетті.

Сонымен қатар, Joyride компоненті өте тәтті.

Және сіз ZURB Foundation, Bootstrap немесе басқа да құрылымды қолданасыз ба , Drupal-дің негізін пайдалану туралы осы кеңестерді қабылдағаныңызға сенімді болыңыз.