Framework dla szablonów Joomla!

Na początek warto sprawdzić co Wikipedia ma do powiedzenia na temat frameworków:

W programowaniu komputerowym framework jest szkieletem do budowy aplikacji. Definiuje on strukturę aplikacji oraz ogólny mechanizm jej działania, a także dostarcza zestaw komponentów i bibliotek ogólnego przeznaczenia do wykonywania określonych zadań. Programista tworzy aplikację, rozbudowując i dostosowując poszczególne komponenty do wymagań realizowanego projektu, tworząc w ten sposób gotową aplikację.

Źródło: Wikipedia, http://pl.wikipedia.org/wiki/Framework

To zdanie daje ogólne pojęcie o temacie tego wpisu. Otóż framework to taka baza do pisania swoich rozwiązań. Są w niej już zawarte elementy, które zapewne zawsze tworzysz/kopiujesz podczas realizacji każdego kolejnego projektu. Oprócz tego są też zawarte rozwiązania, których nawet nie umiałbyś napisać lub nie miałbyś w życiu na to czasu, a które jakieś mądre głowy zrobiły za Ciebie ;) Żeby nie było za łatwo – framework ma też swoje wymogi i zasady odnośnie pisania kodu oraz własne idee dla pewnych elementów.

Podsumowując – framework znacznie przyspiesza pracę, ale dopiero, kiedy spędzisz sporo godzin na jego poznanie.

Moja historia z frameworkami dla szablonów w Joomla!

Swoją przygodę z frameworkami dla szablonów w Joomla!  rozpocząłem około rok temu. Zaczęło się od T3 Framework w wersji 1.2. Wydawało mi się to najlepsze rozwiązanie w tamtym okresie. Po roku czasu framework się jednak zdeaktualizował, firma Joomlart wypuściła T3 w wersji 2.0. W tym momencie stanąłem przed wyborem – T3 2.0 czy Gantry 3.1 od RocketTheme.

T3 czy Gantry ?

Po kilku dniach wstępnego testowania obu rozwiązań (oraz chwilowym pomyśle „sam sobie napisze framework!”) skłoniłem się ku rozwiązaniu firmy RocketTheme. Warto przedstawić motywy, które spowodowały taką decyzję.

Otóż T3 2.0 po zapoznaniu się z dokumentacją przeraża poziomem swego skomplikowania. W pierwszej wersji mieliśmy warstwy prezentacyjne (layouts) i bloki (blocks) składające się na szablon, natomiast w drugiej edycji mamy warstwy prezentacyjne, bloki, profile (profiles) i tematy (themes). Jeśli klient przykładowo chciałby dokonać zmian w warstwie prezentacyjnej to musi ręcznie edytować plik XML, co na pewno kiepsko się sprawdzi w amerykańskich warunkach, gdzie przyszło mi pracować. Panel administracyjny jest mniej przejrzysty od tego znanego z Gantry. Ogólnie nie mam ochoty zagłębiać się w techniczne szczegóły odnośnie T3, jeśli ktoś jest zainteresowany to może poczytać o tym na stronach wiki firmy Joomlart. Ogólnie odniosłem wrażenie, że kodowanie szablonów z tym narzędziem wcale nie skróci drastycznie czasu pisania kodu, a może nawet go wydłużyć. Aby nie być jednostronnym chciałbym wspomnieć o tym, że Joomlart postarało się o znacznie lepszą dokumentację niż RocketTheme. Po jej przeczytaniu prawie wszystko jest jasne. W Gantry na przykład trzeba podglądać rozwiązania w kodzie źródłowym, aby zrozumieć większość rozwiązań.

Jeśli chodzi o Gantry, to sytuacja wygląda lepiej, jeśli chodzi o poziom skomplikowania. Mamy jeden prosty plik index.php oraz presetsy (nie mam pomysłu na przetłumaczenie tego słowa, więc mamy „presetsy”…), które można w łatwy sposób modyfikować za pomocą elementów interfejsu, zamiast edycji XML jak w T3.

Ogólnie idea stojąca za Gantry jest dużo prostsza i przyjazna zarówno dla programisty i użytkownika niż w przypadku T3, więc moim zdaniem aktualnie jest to najlepsze rozwiązanie na rynku frameworków dla Joomla!.

Lista zalet Gantry Framework:

  • 960 Grid System http://960.gs ze wsparciem dla 12 i 16 kolumnowego układu;
  • bardzo wygodny i bogaty w wiele funkcji panel administracyjny o świetnym wyglądzie;
  • możliwość tworzenia osobnych konfiguracji dla poszczególnych elementów menu. Na przykład inny wygląd dla strony głównej i inny wygląd dla bloga;
  • presets – czyli dowolna konfiguracja parametrów odpowiedzialnych za wygląd szablonu. Każdą modyfikację można zapisać jako własny preset;
  • sPecjalna warstwa komunikacji w panelu administracyjnym oparta o AJAX;
  • wsparcie dla RTL (right-to-left), czyli dla języków pisanych od prawej do lewej;
  • wbudowane narzędzie do automatycznej kompresji plików CSS i JS. Zmniejsza to ilość zapytań do serwera i zmniejsza rozmiar ładowanych plików;
  • możliwość dowolnej zmiany szerokości modułów w szablonie. Możemy na przykład opublikować 2 moduły obok siebie i sprawić, aby jeden miał szerokość 3 kolumn, a drugi 9 kolumn (mowa o kulumnach 960 Grid Systemu);
  • schludny kod źródłowy łatwy w adaptacji;
  • 65 pozycji modułów w szablonie. Oczywiście nie jesteśmy ograniczeni do tej liczby i możemy bez problemu dodać kolejne;
  • 38 kombinacji dla kontenera z treścią i kolumnami bocznymi. Tutaj elastyczność powala na kolana. Kolumny boczne możemy ustawiać w dowolnej kolejności i nadawać im dowolne szerokości. Warto zwrócić na to uwagę;
  • duża ilość wbudowanych funkcji (features), takicj jak font-sizer (zmiana rozmiaru czcionki), Google Analytics, element przewijający stronę do góry, ostrzeżenie dla przeglądarki IE6 itd. Można również dodawać własne funkcje;
  • elastyczny system zarządzania arametrami. Można je kontrolować za pomocą URL, Ciasteczek, Sesji, Presets itd.;
  • pozbawione tabelek i przyjazne wyszukiwarkom pliki nadpisujące standardowo generowany kod Joomla! dla komponentów i modułów (Template Overrides);
  • zawarte style dla typografii oraz domyślnych elementów systemu Joomla!;
  • wszystkie konfiguracje zapisywane są w prostych plikach tekstowych.
  • wbudowane wykrywanie używanej przeglądarki, dzięki czemu w łatwy sposób można tworzyć poprawki skierowane specjalnie dla konkretnego programu;
  • RokNavMenu. Zaawansowany system menu – dropdown menu (menu rozwijane) i split menu (drugi poziom menu jest prezentowany w kolumnie bocznej) w wersji opartej na JavaScript/CSS oraz na samym CSS.

Jest to mniej więcej ta sama lista, co na stronie domowej frameworka, tylko po polsku wink Pewne rzeczy dopisałem, pewne wyrzuciłem, bo uznałem za nieistotne.

Ogólnie o Gantry

Na system składa się kilka plików (można je pobrać z tej strony):

  • plugin z frameworkiem;
  • komponent z frameworkiem;
  • czysty szablon;
  • RokNavMenu;
    • moduł menu;
    • plugin menu.

Kiedy już się uporamy z tym wszystkim, to możemy zacząć zabawę z szablonem. W tym poście nie będę się jeszcze zagłębiał w szczegóły, ale ogólnie powiem, że cała zasada tworzenia szablonów w Gantry polega na nadpisywaniu oryginalnych ustawień, styli i funkcji domyślnie zawartych w kodzie. Zamiast pisać wszystko od nowa po prostu modyfikujemy to, co potrzebujemy, a zostawiamy w domyślnej konfiguracji to, co działa według naszych oczekiwań. W praktyce metoda ta oszczędza dużo czasu.

Ogólnie o panelu administracyjnym szablonu Gantry

Panel administracyjny składa się z kilku rozwijanych elementów (accordion) pozwalających na szybkie dotarcie do interesujących nas opcji.

Na górze mamy różne powiadomienia. Pierwszym z nich są informacje o wersji frameworka, dzięki czemu zawsze wiemy, czy korzystamy z najnowszej wersji. Oprócz tego mamy informacje diagnostyczne oraz panel pozwalający na konfigurację szablonu dla poszczególnych elementów menu.

Presets

Tutaj wybieramy gotowe ustawienia parametrów przygotowane przez twórców szablonu. Możemy je dowolnie modyfikować i zapisywać jako dodatkowe, własne presetsy.

Settings

To są ustawienia odpowiedzialne za wygląd szablonu. To właśnie one są właśnie kontrolowane przez presetsy. Na przykład wybranie ciemnej wersji kolorystycznej z zakładki presets spowoduje ustawienie ciemnego tła dla strony itd. Tutaj właśnie możesz samodzielnie modyfikować poszczególne elementy wersji kolorystycznych.

Features

Czyli dodatkowe funkcji wbudowane w szablon/framwork.

Menu

Tutaj znajdują się opcje pozwalające kontrolować RokNavMenu.

Layouts

Ta zakładka pozwala na zmiany domyślnych szerokości modułów oraz kolumn bocznych. Możliwości konfiguracyjne są ogromne i jest to jedna z większych zalet Gantry.

iPhone/iPod Settings

Ustawienia odpowiedzialne za wygląd szablonu na urządzeniach mobilnych.

Advanced

Tutaj znajdują się zaawansowane opcje wbudowane we framework. Znajdziemy tu na przykład włącznie kompresji plików CSS/JS, kontrolę Cache itd.

W tym momencie chciałbym zakończyć mój pierwszy (przydługi) wpis o Gantry. Już wkrótce podejdę do tematu bardziej szczegółowo.

9 odpowiedzi do “Gantry Framework – wstęp

  1. fajnie, że zamieściłeś ten art. Zastanawiałem się kiedyś nad wykorzystaniem jakiegoś frameworka do szablonów Joomla!, ale jakoś wydawało mi się to bezcelowe. Prościej mi było samemu wszystko tworzyć.

  2. Osobiście używam T3 w trochę specyficzny sposób, którego nie zdradzę w trosce o Wasze dobre samopoczucie wink
    Myślę, że pora nauczyć się czegoś innego…

  3. Mając na uwadze to, że projekt będzie realizowany w 960GS powinno się już na etapie projektowania szaty graficznej przekazać grafikowi siatkę grida i postawić wymóg tworzenia w jej ramach.

    Odpowiadając na pytanie – wtedy trzeba pobawić się w nadpisywanie CSS’ów generowanych przez framework. Jest to dość karkołomne zadanie, ale wykonalne. Z mojego doświadczenia wynika jednak przeświadczenie, że lepiej tego nie robić, bo straszny bałagan się tworzy.

  4. >Presetsy? ja to nazywam konfiguratory.. i to chyba jest dobre tłumaczenie.
    Dzięki za opis, może po czasie ale jednak daję jakiś horyzont, bo szukam czegoś do stworzenia swojego templata na joomlę 3.. szukam i mam oczopląs.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *