Kolejny materiał ju za:

CSS framework - czy warto używać?

Framework najprościej byłoby określić jako gotowe elementy z którym programista może korzystać aby stworzyć własną aplikację, framework uprości tworzenie dowolnej aplikacji. Co jednak gdy chcemy stworzyć stronę opartą o HTML i CSS? I tutaj społeczności zadbały o poważne narzędzie do szybkiego składania stron opartych o statyczny kod.

Dla Drupalowca poznanie CSS Framework to klucz do szybkiego budowania skórek, które wystarczy ubrać w odpowiednia grafikę aby cieszyć się poprawnie działającą strukturą z zachowaniem wyglądu dla każdej z przeglądarek. Framework CSS to nic innego jak gotowe style CSS z odpowiednio ustalonymi klasami, które wstawione w szablon określają obszary dla skórki.

Jeśli zastanawiałeś się ile czasu trzeba do wykonania witryny o dowolnym układzie?

Na przykładzie popularnego wśród drupalowców frameworku CSS 960.gs zobaczysz jak prosto stworzyć szablon z 3 kolumnami i to bez większego doświadczenia.

Obejrzyj poglądowy film z wykorzystaniem wspomnianego frameworku.

Podpowiem Tobie, że najczęściej stosowanym przez osoby tworzące skórki w Drupalu jest Framework 960.gs, którego układ składa się z 12 lub 16 elementów.

960grid.jpgFramework 960.gs dostępny jest na licencji GPL, co daje nam możliwość stosowania w komercyjnych projektach. Podstawowe zadanie to zbudowanie siatki szablonu o maksymalnej szerokości 960px z wykorzystaniem 12 lub 16 elementów nazwanych jako klasa css grid_x.

W celu szybkiego tworzenia szablonu warto skorzystać z programów, które zapewniają automatyczny podgląd kodu oraz prezentację szablonu.

Aby rozpocząć prace w frameworku musisz pobrać paczkę i skopiować do swojego projektu a następnie pliki css dodać do szablonu, warto dodać plik domyślny defoult.css

link rel="stylesheet" type="text/css" media="all" href="css/defoult.css"
link rel="stylesheet" type="text/css" media="all" href="css/reset.css"
link rel="stylesheet" type="text/css" media="all" href="css/text.css"
link rel="stylesheet" type="text/css" media="all" href="css/960.css"

blueprint.jpg
Jeśli nie chcesz stosować wcześniej zaprezentowanego 960.gs masz do dyspozycji kolejny framework o nazwie Blueprint, różnica pomiędzy frameworkami to szerokość w jakiej prezentowany jest szablon dla Blueprint jest to szerokość 950px z wykorzystaniem do 24 kolumn dla 960.gs jak sama nazwa wskazuje jest to 960px z układem 12 lub 16 kolumn.

Podobnie jak w wcześniejszym frameworku należy pobrać pliki z przykładowymi szablonami, kod jaki należy dodać do szablonu jest następujący:

link rel="stylesheet" href="blueprint/defoult.css" type="text/css" media="all"
link rel="stylesheet" href="blueprint/screen.css" type="text/css" media="screen,projection"
link rel="stylesheet" href="blueprint/print.css" type="text/css" media="print"
link rel="stylesheet"href="blueprint/lib/ie.css" type="text/css" media="screen, projection"

Samo budowanie siatki witryny wymaga jedynie znajomości podstaw tworzenia stron html oraz klas dla danego frameworka.
Jeśli zastanawiacie się jakie strony powstały z wykorzystaniem obu framework-ów dla Drupala oto kilka linków:
960.gs - oficjalne skórki na drupal.org
Blueprint - oficjalne skórki na drupal.org
Korzystanie z frameworków ma wiele zalet, najważniejszą jest fakt szybkiej pracy w tworzeniu rdzenia szablonu. Dostęp do gotowych reguł CSS pozwala zaoszczędzić czas. Trzeba pamiętać, że framework ma też wady gdzie główna to z góry narzucony schemat, co zrobić gdy mamy do realizacji ciekawy projekt, którego nie określimy w klasach css framwerok-u? I na to jest sposób co już nie długo będzie na blogu ;]

 

Kontakt z nami

Masz pytania, propozycję na kurs lub problem z uzyskaniem dostępu do materiałów napisz do nas: slawek@drupalomania.pl

Subskrybuj

Subskrybuj Subskrybuj