Používanie témy nadácie ZURB pre Drupal

Získajte silu rámca nadácie ZURB v rámci témy Drupal

Predtým, než bol spustený Twitter , bola (a je) Nadácia ZURB, ktorá vám umožňuje pridať pekné gombíky, blokovacie mriežky, pokrokové lišty, cenové tabuľky a oveľa viac s niekoľkými dobre umiestnenými triedami CSS. S tematikou nadácie ZURB pre Drupal môžete uvoľniť všetko toto bling na vašom webe Drupalu s fatálnou ľahkosťou.

Čo je rámec nadácie ZURB?

Nadácia ZURB Foundation je kolekcia kódov CSS a Javascript pre množstvo vecí, ktoré pravdepodobne chcete na svojich webových stránkach. To zahŕňa nielen klikacie očné bonbóny ako vyššie uvedené tlačidlá, ale aj nejakú skutočne úžasnú citlivú silu.

Väčšinu týchto funkcií používate pridaním špeciálnych tried CSS. Napríklad:

Tu je tlačidlo .

A tu je malé tlačidlo "span class"

Nadácia ZURB Foundation je úplne oddelená od Drupalu. Ľudia ju používajú na stránkach WordPress, Joomla a dokonca aj v statických stránkach HTML .

Čo je téma Drupal nadácie ZURB?

Téma nadácie Drupal ZURB Foundation vám umožní rozvinúť túto energiu ZURBish len tým, že si stiahnete a povoľujete tému (samozrejme aj čítanie dokumentácie a niekoľko ďalších krokov).

Nadácia ZURB sa napríklad spolieha na knižnicu jQuery Javascript, takže pravdepodobne budete musieť nainštalovať aktualizáciu jQuery. Skontrolujte, či používate iné moduly, ktoré závisia od jQuery. Ak používate novú verziu jQuery, môžu tieto moduly prestať fungovať.

Pravdepodobne budete chcieť túto tému použiť ako základnú tému pre vlastnú vlastnú tému. Prispôsobenie je tam, kde Nadácia ZURB skutočne žiari.

Potrebujete túto tému používať ZURB Foundation v Drupal?

Tento motív nepotrebujete na používanie rámca nadácie ZURB. Najjednoduchšie je, že táto téma jednoducho pridá na váš web ZSSB Foundation CSS a Javascript a môžete to urobiť manuálne.

Ale táto téma to uľahčuje a zahŕňa aj ďalšiu integráciu s Drupalom.

Okrem toho môžete pridať ďalšie menšie moduly pre ďalšiu integráciu. Modul ZURB Orbit vám napríklad umožní vytvoriť prezentáciu Orbit s obrázkami. Modul ZURB Clearing vám umožňuje vytvárať ľahké schránky s obrázkami Media.

Poznámka: Nepoužil som tieto malé moduly ešte sám, takže môžu byť plné nebezpečenstva. Od tohto písania ZURB Clearing vyžaduje Media-2.x-dev, čo by mohlo byť nebezpečnou aktualizáciou, ak v súčasnosti používate Media 1.x. A požiadavka na vývojovú verziu modulu by mala vždy dať jednu prestávku. Napriek tomu sa tieto a ďalšie ZURB moduly stávajú zaujímavými.

Zvoľte Ktorú verziu ZURB nadácie používať

Pred stiahnutím témy nadácie ZURB skontrolujte, ktorú verziu by ste mali použiť. Existujú rôzne hlavné verzie rámca nadácie ZURB a hlavné číslo verzie témy zodpovedá rámcu, s ktorým pracuje. Takže verzie tém 7.x- 3 .x pracujú s nadáciou 3 , verzia 7.x- 4 .x pracuje s nadáciou 4 a verzia 7.x- 5 .x pracuje s nadáciou 5 .

Od tohto písania je najnovšia stabilná verzia témy 7.x-4.x, ktorá pracuje s nadáciou 4. Verzia 7.x-5.x je stále vo vývoji. Takže, aj keď webová stránka rámca nadácie predpokladá, že použijete nadáciu 5, možno by ste sa teraz chceli držať nadácie 4.

Upozorňujeme tiež, že nadácia 5 má ďalšie požiadavky, najmä jQuery 1.10. Nadácia 4 potrebuje iba jQuery 1.7+.

Uvedomte si, ktorú verziu používate pri čítaní online dokumentácie. Platí to najmä vtedy, ak nepoužívate najnovšiu verziu rámca. Je to smrteľne ľahké preniknúť do čítania dokumentov pre, povedzme, Nadácia 5, potom sa dostanete frustrovaní, keď nová funkcia nefunguje na vašej stránke Foundation 4.

Nadácia 5 napríklad obsahuje celú sadu stredných tried pre stredne veľké obrazovky. V nadácii 4 sa tieto záhadne zlyhajú, ak nevykonáte ďalšie kroky.

Použite SASS, Compass a _variables.scss & # 34 ;!

Ak sa chystáte vylepšiť CSS pre túto tému vôbec, uistite sa, že:

• Použite tému Nadácie ZURB ako základnú tému pre vlastný podtitút
• Vytvorte tento podtém pomocou príkazu drush poskytnutého podľa témy. Rovnako ako: drush fst your_theme_name
• Voľne prečítajte vynikajúci súbor _variables.scss

Súbor _variables.scss je vytvorený automaticky drush fst. Tento jediný súbor obsahuje premenné pre takmer čokoľvek, čo by ste mohli chcieť vyladiť vo vašej téme CSS. Je to úžasné! Všetko na jednom mieste, môžete nastaviť všetko od predvoleného písma na šírku obrazovky až po okraj na strmene.

Samozrejme, môžete vždy nastaviť aj ďalšie súbory. Ale _variables.scss je skvelé miesto na začatie.

Všimnite si príponu súboru: scss, nie css. Ak chcete používať funkciu _variables.scss, budete musieť nastaviť jazyk SASS (jazyk rozšírenia CSS) a Compass (rámec postavený pomocou SASS). Keď spustíte kompiláciu kompasu, vaše súbory scss sa stanú krásnymi CSS v samostatných súboroch. (Dávam prednosť súprave hodiniek - toto stále beží a aktualizuje CSS, ako si vyladíte súbory scss.)

Ak naozaj chcete s SASSom obťažovať, môžete písať súbory CSS zvyčajne a uvádzať ich v súbore .info témy. Verte mi však, že investícia do malého času, aby ste sa dostatočne naučili zostaviť _variables.scss, sa vráti takmer okamžite.

Skôr ako použijete nadáciu ZURB

Nadácia ZURB je vynikajúca, ale nie je to jediný front-end framework, ktorý bol integrovaný do Drupalu. Možno budete chcieť zvážiť Bootstrap , podobný rámec, ktorý má tiež Drupal tému. Zatiaľ používam samotnú ZURB Foundation, ale to preto, že môj výskum ukázal, že bolo ľahšie prispôsobiť sa ako Bootstrap.

Komponent Joyride je tiež dosť sladký.

A či používate ZURB Foundation, Bootstrap alebo nejaký iný rámec, nezabudnite získať tieto tipy na používanie rámca s Drupalom .