Joomla! to jeden z najpopularniejszych darmowych systemów do zarządzania treścią (CMS), umożliwiający tworzenie zaawansowanych i rozbudowanych witryn internetowych nawet bez znajomości języka HTML. Atrakcyjność tego systemu polega między innymi na możliwości tworzenia dla niego własnych szablonów, czyli zestawu plików zmieniających wygląd całej witryny.

Jak zrobić szablon dla Joomla!

Kurs wideo Joomla! – Tworzenie szablonów to przewodnik dla użytkowników, którzy chcą samodzielnie tworzyć szablony dla najnowszych wersji tej aplikacji. Przedstawia on kolejne etapy pracy nad szablonem dla przykładowej witryny, poczynając od wstępnych przemyśleń dotyczących rozmieszczenia elementów na stronie i przygotowania niezbędnych plików, poprzez stworzenie i sformatowanie szablonu, aż do rozbudowania go o dodatkowe możliwości i stworzenia pakietu instalacyjnego.

Informacje zawarte w tym kursie pozwalają na tworzenie szablonów dla systemu Joomla! w wersji 1.5 i nowszych.

Kurs jest adresowany do osób znających system Joomla! od strony administracyjnej i posługujących się przynajmniej w stopniu podstawowym językiem PHP, (X)HTML i CSS. Dla ułatwienia analizy prezentowanych zagadnień, na płycie zostały zamieszczone materiały wykorzystywane przez lektora w trakcie kursu.

SPIS TREŚCI:

1. Wstęp – Krótka informacja o tematyce kursu oraz o wymaganych umiejętnościach niezbędnych do tworzenia własnych szablonów. (01:43 min)

2. Zalety szablonów – Na początek kilka podstawowych informacji o tym, jak działają szablony i jakie zalety ma stosowanie szablonów. (01:54 min)

3. Projekt szablonu – Punktem wyjścia przy tworzeniu szablonów jest projekt graficzny. Mając go, należy dokładnie przemyśleć, gdzie na stronie będą umieszczane konkretne treści i moduły. (03:26 min)

4. Projekt w XHTML i CSS – Stworzona na podstawie projektu graficznego strona internetowa będzie stanowiła podstawę do wykonania szablonu. Żeby dowiedzieć się, jak została ona zbudowana, przeanalizujemy kod tej strony. (06:28 min)

5. Przykładowa witryna – Tworzenie szablonów powinno odbywać się na działającej witrynie wypełnionej treściami. W tym filmie zainstalujemy przykładową witrynę na lokalnym serwerze. (06:04 min)

6. Pliki składowe – Szablon dla systemu Joomla! może składać się z wielu różnych plików, np. obrazków, z kodu JavaScript i wielu innych. Które z nich są wymagane, a które opcjonalne, dowiesz się w tym filmie. (03:39 min)

7. Ikona i miniaturka szablonu – Żeby szablon posiadał plik favicon.ico oraz miniaturkę, która jest widoczna w zapleczu administracyjnym, musimy utworzyć te pliki w programie graficznym. (04:35 min)

8. Plik templateDetails.xml – Plik templateDetails.xml zawiera ważne informacje wykorzystywane przez Joomla! w czasie instalacji pakietu z szablonem. Na podstawie przykładowego pliku utworzymy plik dla naszego szablonu. (04:30 min)

9. Plik index.php – Przechodzimy do edycji najważniejszego pliku w całym szablonie. Skorzystamy tu z przygotowanej wcześniej strony i zmieniając fragmenty kodu na polecenia systemu Joomla! zrobimy z niej szablon. (06:19 min)

10. Pierwsze uruchomienie – Podstawowa, niesformatowana wersja szablonu jest gotowa. Teraz można po raz pierwszy włączyć go dla przykładowej witryny. (02:10 min)

11. Analiza kodu – Skuteczna praca nad szablonem wymaga zrozumienia kodu, który jest tworzony podczas generowania strony przez system Joomla! (03:50 min)

12. Style modułów – Moduły zamieszczone na stronie mogą być wyświetlane za pomocą kilku rodzajów kodu html. Jak można tym sterować i jak wyglądają poszczególne typy kodu, zobaczysz w tym filmie. (04:06 min)

13. Web Developer Tool – Podczas tworzenia szablonów czy stron internetowych bardzo przydatne są narzędzia wspomagające ten proces. Dwa najciekawsze to Firebug i prezentowane w tym filmie narzędzie Web Developer. Oba można zainstalować jako dodatek do przeglądarki Firefox. (04:30 min)

14. Formatowanie szablonu – Stworzenie szkieletu szablonu mamy już za sobą. Teraz przychodzi czas na formatowanie poszczególnych elementów witryny za pomocą poleceń CSS. (01:40 min)

15. Podstawowe definicje stylów – Na początek zdefiniujemy podstawowe formaty dla całej witryny i klika podstawowych formatów typowych dla systemu Joomla! (06:43 min)

16. Formatowanie modułów cz. 1 – Większość modułów w witrynie formatowana jest standardowo za pomocą tej samej klasy CSS, co pozwala na szybkie nadanie jednolitego wyglądu wielu modułom. Jednak możliwe jest również nadanie wybranemu modułowi innej klasy i sformatowanie go inaczej. (04:20 min)

17. Formatowanie modułów cz. 2 – Niektóre moduły, jak na przykład moduł Sonda, trzeba formatować oddzielnie, ponieważ mają one inny kod niż pozostałe moduły. (01:17 min)

18. Formatowanie menu – Przechodzimy do formatowania menu poziomego u góry strony. Oprócz nadania odpowiednich stylów CSS, musimy dokonać tu również zmian w samym module, żeby był on poprawnie wyświetlany. (04:14 min)

19. Dynamiczny szablon cz. 1 – Do tej pory nasz szablon jest szablonem statycznym, czyli takim, który nie dopasowuje się swoją budową do generowanych przez Joomla! stron. Oznacza to, że jeśli wyłączymy moduły w prawej kolumnie, to powstanie tam pusta przestrzeń. Zobacz, jak można to zmienić. (05:02 min)

20. Dynamiczny szablon cz. 2 – Po zapoznaniu się z teorią przystępujemy do dokonania niezbędnych zmian w głównym pliku szablonu oraz w pliku zawierającym style CSS. (05:27 min)

21. Parametry szablonu – Parametry szablonu to kolejna możliwość wzbogacenia szablonu o nowe możliwości. Dzięki nim można przykładowo wpływać na wygląd szablonu zmieniając odpowiednie ustawienia w zapleczu administracyjnym. (01:11 min)

22. Definiowanie parametrów – Pracę rozpoczynamy od zdefiniowania parametrów dla szablonu. Robimy to poprzez dopisanie odpowiednich poleceń do pliku templateDetails.xml. (06:35 min)

23. Odczyt parametrów – Do odczytu parametrów służy specjalne polecenie, które wykorzystamy w pliku index.php. Ta zmiana będzie również wymagała niewielkiego uzupełnienia pliku ze stylami. (06:14 min)

24. Pakiet instalacyjny – Czynnością kończącą tworzenie szablonu jest przygotowanie pakietu instalacyjnego. Jednak zanim to zrobimy, dokonamy jeszcze zmiany w konfiguracji jednego z modułów menu. (04:09 min)

25. Zaokrąglone narożniki – Dzięki użyciu stylu "rounded" dla modułu mamy możliwość uzyskania zaokrąglonych obramowań. Jak powinien wyglądać kod CSS oraz niezbędne grafiki, zobaczysz w tym filmie. (02:33 min)

26. Rozszerzenie JoomlaPack – Rozszerzenie JoomlaPack, które jest zainstalowane w przykładowej witrynie, służy do tworzenia kopii zapasowych systemu Joomla! W tym filmie dowiesz się, jak korzystać podstawowych funkcji tego dodatku. (03:00 min)