Zagraj w mBlocks!
Tworzenie skórki do Drupala
06 May 2010 | Milosz K. | Komentarzy: 3 »
Drupal jest systemem zarządzania treścią (CMS) o otwartym kodzie źródłowym na licencji GPL (ang. GNU General Public License), rozwijanym przez szeroką społeczność. Dzięki temu ilość modułów jest naprawdę imponująca. Jedną z jego największych zalet jest elastyczność, która czasem bywa również wadą, szczególnie w sytuacji gdy przychodzi do zmiany skórki. Według społeczności tworzenie skórek na Drupalu jest trudniejsze niż w innych CMS-ach. Poniżej pokazano jak w prosty sposób można stworzyć własną skórkę.
Działanie skórki
Zanim zaczniemy pisać kod, musimy wiedzieć jak działa Drupal, a właściwie w jaki sposób „czyta” skórki. W zrozumieniu tego pomoże nam poniższy schemat:
Źródło: http://www.drupal.org
Drupal działa według zasady – od szczegółu do ogółu. Najpierw renderuje elementy block.tpl.php, które odpowiadają za bloki. Następnie pliki node.tpl.php, w których znajdziemy nasze wpisy. Ostatnim elementem jest page.tpl.php który zawiera wszystkie powyższe elementy.
Pliki skórki umieszczamy w katalogu sites/all/themes/. Każda skórka musi mieć plik o nazwie nazwa_skorki.info. Plik ten „informuje” naszego cms’a o tym, że w tym katalogu znajduję się skórka.
Przykładowy plik example.info
name = Example description = Bardzo ładny opis skórki version = 1.0 core = 6.x engine = phptemplate stylesheets[all][] = style.css stylesheets[print][] = print.css
Wyjaśnienie:
- name – nazwa skórki, która używana jest przy wyświetlaniu w panelu admina (Budowa witryny > Skórki),
- description – opis skórki, j/w.,
- version – wersja skórki,
- core – wersja drupala dla jakiej jest dedykowana skórka (w tym wypadku jest to Drupal 6),
- engine – silnik z jakiego skorzystamy,
- stylesheets – szablony CSS.
Nazwa pliku info powinna być taka sama jak nazwa katalogu, w którym go umieściliśmy, natomiast wartością parametru name może być cokolwiek.
Tak utworzony plik jest już widoczny w Drupalu. Teraz musimy go uruchomić – aby to zrobić wchodzimy do panelu administracyjnego, klikamy kolejno: Budowa witryny > Skórki i zaznaczamy naszą nową skórkę jako włączoną i domyślną.
Jeżeli teraz wejdziemy na naszą stronę zobaczymy jednak domyślną skórkę. Dzieje się tak ponieważ Drupal nie znalazł w katalogu naszej skórki takich plików jak page.tpl.php i node.tpl.php. Zamiast nich wczytane zostały pliki znajdujące się w modułach, np. dla modułu node, katalog modules/node/. Musimy zatem stworzyć własny plik page.tpl.php, który będzie podstawą dla skórki. Plik taki najczęściej zawiera kod HTML bez zawartości body – w to miejsce wstawiamy kod wyświetlający zawartość. Cały plik page.tpl.php może wyglądać następująco:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl"> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title><?php echo $head_title ?></title> <?php echo $styles ?> </head> <body> <h1>Drupal – CMS</h1> <?php echo $content ?> <?php echo $scripts ?> </body> </html>
Powyżej przedstawiono jedną z najprostszych postaci pliku page.tpl.php. Możemy go rozbudować o zmienne:
- $front_page – odnośnik do strony głównej,
- $site_name – nazwa witryny (konfigurowana w “Podstawowe informacje”),
- $site_slogan – slogan witryny,
- $breadcrumb – nawigacja,
- $title – tytuł aktualnie wyświetlanego node’a,
- $tabs – zakładki,
- $messages – komunikaty, zarówno błędy jak i potwierdzenia wykonanych akcji.
Zawartość naszej strony uzupełnimy tworząc plik node.tpl.php który może wyglądać tak:
<div> <?php print $picture ?> <?php if (!$page): ?> <h2><a href="<?php print $node_url ?>" title="<?php print $title ?>"><?php print $title ?></a></h2> <?php endif; ?> <div> <?php if ($submitted): ?> <span><?php print $submitted ?></span> <?php endif; ?> <?php if ($terms): ?> <div><?php print $terms ?></div> <?php endif;?> </div> <div> <?php print $content ?> </div> <?php print $links; ?> </div>
W tym pliku możemy zobaczyć jak wygląda obiekt naszego node’a, aby to zrobić wystarczy wpisać:
<?php var_dump($node) ?>
Jeżeli mamy zainstalowane inne moduły, takie jak upload lub CCK to zobaczymy, że nasz obiekt zostanie wzbogacony o kolejne obiekty, z których w łatwy sposób możemy korzystać.
Kilka przydatnych informacji:
- Jeżeli przy zmianie zawartości plików skórki nie widać żadnego efektu, warto spróbować wyłączyć cache w Drupalu (Konfiguracja witryny -> Wydajność), a także zainstalować moduł Devel i zaznaczyć w nim wartość “Rebuild the theme registry on every page load”.
- Powinno się unikać wykorzystywania nowo utworzonej skórki dla panelu administracyjnego – może brakować pewnych elementów do jej prawidłowego funkcjonowania.
- Jeżeli strona główna znacząco różni się od pozostałych stron, możemy stworzyć plik page-front.tpl.php – zostanie on wykonany tylko gdy znajdujemy się na stronie głównej, jednocześnie plik page.tpl.php zostanie w takim przypadku pominięty.
- Gotowe skórki do Drupala.
- Przydatny tutorial o tworzeniu skórek.
Całkiem przydatne, szczególnie na samym początku “zabawy” z drupalem. Warto tu też wspomnieć o takim module jak – http://drupal.org/project/custom_node_template który naprawdę ułatwia życie podczas tworzenia strony w tym CMS-ie.
Zapraszam do publikacji tego artykułu na polskiej stronie Drupala. Ma tam szansę dotrzeć do większej liczby zainteresowanych.
dobre tłumaczenie