Skip to main content

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

Anonim

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 a gombík.

A tu je a drobné tlačidlo.

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?

Nadácia Drupal ZURB téma vám umožní rozpojiť všetku túto energiu ZURBish jednoducho stiahnutím a zapnutím témy (a čítaním dokumentácie a samozrejme aj niekoľkými ďalšími krokmi).

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?

Nemáte potrebovať túto tému používať rámec 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 vyžaduje ZURB Clearing

Media-2.x-dev, čo by mohlo byť nebezpečnou aktualizáciou, ak v súčasnosti používate aplikáciu 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

7.x-3.X verzie tematickej práce s Nadáciou 3,

7.x-4.X verzie pracujú s nadáciou 4a

7.x-5.X Verzie pracujú 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ý súbor

stredná 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"!

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
  • Generujte tento podtém pomocou

    drush príkaz, ktorý poskytuje táto téma. Ako toto:

    odbočte na svoje meno

  • Neprekvapivo prehliadnite vynikajúce

    _variables.scss súbor

_variables.scss súbor je vytvorený automaticky

drush fst, Tento jediný súbor obsahuje takmer premenné čokoľvek možno budete chcieť vyladiť v tému 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, Použit

_variables.scss, budete musieť nastaviť jazyk SASS (jazyk rozšírenia CSS) a Compass (rámec postavený pomocou SASS). Keď spustíte

kompas kompilovať, vaše

SCSS súbory sa stanú krásnymi CSS v samostatných súboroch. (Dávam prednosť

hodinky kompasu - toto stále beží a aktualizuje CSS, ako si vyladiť

SCSS Súbory).

Ak naozaj, naozaj nechcete obťažovať SASS, môžete písať CSS súbory ako zvyčajne a zoznam ich v tému

.Info súboru. Ale verte mi - malú časovú investíciu, aby ste sa dostatočne naučili zostaviť

_variables.scss bude splatený 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.