Start arrow Programowanie arrow Poprawny szablon dla Joomla! arrow II. Instalacja Joomla, typ dokumentu i czysty szablon Joomla
II. Instalacja Joomla, typ dokumentu i czysty szablon Joomla Drukuj Wyślij znajomemu

Poprawne szablony dla Joomla! Cz. II

Przegląd zawartości kolejnego poradnika
Poradnik:

W tym artykule zobaczymy, jak najprościej zainstalować Joomla, więcej uwagi poświęcimy sprawie typu dokumentu [doctype] i jego znaczenia dla poprawności serwisu Joomla. Przyjrzymy się też chwilę tworzeniu czystego szablonu Joomla.

Instalacja Joomla

Jest kilka sposobów instalacji. Pod adresem http://joomla.astang.com/autoinstall umieszczony jest autoinstalator. Ja nie używałem nigdy tego narzędzia, ale Ty możesz z niego skorzystać.

Osobiście preferuję metodę ręcznej instalacji. To rzeczywiście prosty sposób, zwłaszcza jeśli masz możliwość skorzystania z panelu kontrolnego [cpanel] na serwerze:

  1. Przejdź do Twojej bazy danych SQL i utwórz (np. przy pomocy phpMyAdmina) bazę danych, której będziesz używać z Joomla.
  2. Przejdź w panelu kontrolnym do menedżera plików.
  3. Utwórz katalog dla swojego nowego serwisu. Or if you are using a subdomain like we are (livesite.compassdesigns.net), the folder is automatically created when you create the subdomain. Przejdź do tego folderu.
  4. Skorzystaj z linku Wczytaj plik [Upload file], aby wczytać pełną wersję Joomla z Twojego komputera lokalnego.
  5. Kliknij nazwę wczytanego pliku, zobaczysz nowe opcje menu. Kliknij link "Rozpakuj zawartość pliku" [extract file contents].
  6. Gotowe!

Załadowaliśmy i rozpakowaliśmy pliki. Są gotowe do instalacji, ale jeszcze nie są zainstalowane. Nie będę omawiać szczegółów instalacji Joomla. Oficjalny podręcznik znajdziesz pod adresem: http://help.joomla.org/content/view/39/132/ lub w wersji polskiej - Joomla! 1.0.x - instalacja krok po kroku

Czysty szablon Joomla

Teraz następny etap naszej pracy. Instalacja "czystego" szablonu Joomla. Aby rozpocząć, potrzebny Ci będzie ten PAKIET: livesitedesign.zip. Znajdziesz w nim katalogi i pliki, które tworzą "czysty" szablon Joomla:

  • index.php
    To najważniejszy plik. Wyświetla stronę i mówi CMS-owi Joomla, w których miejscach umieszczać różne komponenty i moduły
  • templateDetails.xml
    Ten plik zawiera szczegółowe informacje o autorze, prawach własności oraz wylicza wszystkie pliki, które tworzą szablon (włącznie z plikami wykorzystywanych w szablonie obrazów)
  • template_thumbnail.png
    Prosty obrazek ilustrujący szablon. Jeśli go nie będzie, nic się nie stanie.
  • css/template_css.css
    Arkusz CSS dla szablonu. Lokalizacja katalogu jest w zasadzie dowolna, ale musisz ją określić w pliku index.php. Możesz użyć dowolnej nazwy i dla katalogu i dla pliku bądź plików w nim umieszczonych.
  • images/
    Wszystkie obrazy, których używasz w szablonie. Ze względu na organizację pracy, projektanci umieszczają obrazy w odrębnym katalogu. Nasz będzie pusty.

Aby zainstalować szablon, przejdź w menu administratora do pozycji Instalatory=>Szablony i zainstaluj z pliku livesite.zip ze swojego komputera.

Uwaga: Możesz również rozpakować pakiet i przesłać na serwer za pomocą FTP. Musisz wówczas umieścić je w katalogu: /twój_serwis/templates.

Plik index.php. Typ dokumentu

Zajmiemy się teraz pierwszym bardzo ważnym elementem projektu. Co znajduje się w pliku index.php? Fragment, nad którym się najpierw zatrzymamy, to deklaracja typu dokumentu. Element ten umieszczony jest na samym początku pliku, jako pierwszy w dokumencie, jeszcze przed otwarciem szkieletu strony, czyli <HTML>. Mamy tu do czynienia z dość skomplikowanymi kwestiami i - mówiąc uczciwie - ja mam jedynie ogólne pojęcie na ten temat. Jeśli nie chcesz być zanudzany szczegółami technicznymi, wystarczy, że będziesz świadomy, że na początku szablonu muszą znajdować się takie linie:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="<?php echo _LANGUAGE; ?>"> 

Masz ją? To dobrze. Możesz opuścić następny fragment.

"Wojna" przeglądarek

Element określający DTD jest umieszczany na początku dokumentu. DTD są tworzone przez specjalistów dla specjalistów. Kiedy mówię "specjaliści", nie mam na myśli zwykłych profesjonalistów, projektantów, jak Ty czy ja. Mam na myśli specjalistów np. z *Grandma* - Shes Got Mail™ dostarczających DTD.

Generalnie rzecz biorąc, DTD informuje przeglądarkę, jak ma interpretować kod, określa poziom zastosowanego standardu. Okres wojny przeglądarek - ostrej i nie zawsze uczciwej konkurencji między Microsoftem i Netscape o prymat na rynku - przyniósł także i pozytywne owoce, uzgodnienie standardu HTML 3.2. Aktualnie zalecanym jest standard XHTML 1.1. Możesz także odwołać się do deklaracji standardu XHTML 1.0, HTML 4.01, HTML 4.0, choć nie są to już standardy zalecane.

Istotną kwestią jest wersja standardu. Specyfikacja HTML4 wyróżnia 3 wersje DTD, oznaczone słowami "strict" (ścisły), "transitional" (przejściowy a. luźny) i "frameset" (interpretujacy ramki).

Wersja STRICT definicji typu dokumentu (DTD) wyklucza wszelkie elementy prezentacyjne, których nie ma w specyfikacji HTML 4.01 oraz elementy, które ta specyfikacja uznaje za schyłkowe (deprecated). Innymi słowy, elementy i atrybuty, których nie ma w specyfikacji HTML 4.01 lub zostały uznane za schyłkowe będą w przypadku użycia tej deklaracji - jeśli znajdą się w dokumencie - uznane za nieprawidłowe, nie zostaną poprawnie zinterpretowane. Wersja TRANSITIONAL natomiast deklaruje dokument jako zawierający wszelkie możliwe elementy i atrybuty HTML, łącznie ze schyłkowymi. Zdaje się zatem "bezpieczniejsza". Nie można jej jednak zadeklarować dla XHTML 1.1, który występuje tylko w wersji strict.

Niepełne wspieranie standardów przez przeglądarki jest powodem, dla którego trzeba stosować specjalne sztuczki (haki), duplikujące deklaracje CSS, żeby uzyskać ten efekt. Na przykład IE nie rozumie polecenia "min-width" określającego minimalną szerokość. Niemniej, dziś sytuacja jest znacznie lepsza, niż jeszcze 2-3 lata wstecz.

Aby jeszcze nieco skomplikować problem, dodajmy, że istnieje również tryb nazwany "quirks". Jeśli deklaracja wskazuje na nieprawidłowy DTD, na DTD przestarzały albo nie znajduje DTD pod wskazanym adresem, to przechodzi właśnie do trybu "quirks". Ten tryb został wprowadzony przez Microsoft dla kompatybilności wstecz. W efekcie IE6 może interpretować stronę tak, jak IE4. Niesamowite, co?

Zdarza się, niestety, że przeglądarki przechodzą do trybu "quirks" przypadkiem. Bywa tak w dwóch sytuacjach:

  • gdy zostanie użyte DTD wprost ze strony W3C, bez podania pełnego adresu zapisane jako:br/>
    DTD/xhtml1-strict.dtd
    Jest to względny adres pliku DTD, a konieczna jest pełna ścieżka.
  • Microsofft znowu się zaangażował (przysięgam, że oni pracują zawsze po wizycie w pubie) i ustawił IE6 tak, abyś miał poprawne dawniejsze strony, ale tylko w trybie "quirks". Dzieje się tak, gdy prolog XML
    <?xml version="1.0" encoding="iso-8859-2"?>
    znajduje się powyżej elementu !DOCTYPE

Uwaga tłumacza:

O przełączaniu się pomiędzy trybami interpretacji decyduje deklaracja DTD. Przejście do trybu zgodności ze standardami następuje tylko wówczas, gdy deklarację Strict DTD podamy z adresem lub bez adresu strony zawierającej definicję elementów języka), a deklarację Transitional DTD koniecznie z adresem. Natomiast wywołanie Transitional DTD bez adresu wywołuje tryb Quirks. W ten sposób zachowuje się nie tylko Internet Explorer 6, ale również inne przeglądarki jak np. Mozilla czy Opera.

O szczegółach trybu "quirks" przeczytasz w serwisie boo.pl pod adresem: Tryb Quirks.

Tłum. Stefan Wajda [aka zwiastun]
Źródło: Tutorial 2: Installing Joomla, doctype and the blank joomla template
Przedruk tylko za zgodą autora i redakcji

Zmieniony ( 06.07.2006. )
 
« poprzedni artykuł   następny artykuł »