Яким би не був гарним і навернутим шаблон сайту – він має кістяк, на який вже навішують шкіру (css) та м’язи (скрипти). В шаблоні Joomla! кістяк знаходиться у файлі index.php. Саме тут ви задаєте позиції модулів і встановлюєте зв’язки з файлами стилів та скриптів. Саме тут ви здійснюєте розмітку сайту. Тут ви визначаєте буде ця розмітка статичною (жорстка кількість колонок/рядків) чи динамічною (кількість рядків/колонок змінюється відповідно до опублікованих модулів/компонентів). Це альфа і омега. Початок і кінець.

Ну що ж. Я пропоную провести анатомічне дослідження цього кістяку з метою ознайомлення з функціональними можливостями файлу.

Початок файлу виглядає так:



  <?php defined( '_JEXEC' ) or die; // Ця строка додається з міркувань безпеки, вона забороняє прямий доступ до файлу
$doc = JFactory::getDocument(); // це перемінна, яка зберігає посилання на документ
$tpath = $this->baseurl.'/templates/'.$this->template; // ця строка містить відносну адресу шаблону
?>

Далі у нас звичайний “стартовий” код html з одним необхідним жумловським рядком:



  <!DOCTYPE html>
<html>
<head>
<jdoc:include type=«head» /> <!--Ця строка дозволяє Joomla! додати всі необхідні теги, ключові слова, короткий опис-->
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template ?>/css/style.css" /> <!--Таким чином вказується шлях до файлу стилів-->
</head>
</html>

Після цих рядків ви можете верстати свій шаблон. Верстка має бути виключно блочною. Модульні позиції виводяться наступними командами:



  <div>
<jdoc:include type="modules" name="footer" style="xhtml" />
</div>

Строка name є ім’ям позиції модулю. Ви можете вказати стандартне ім’я, а можете придумати власне. Для виводу контенту використовується наступна конструкція:



  <div>
<jdoc:include type="component" style="xhtml" />
</div>

Зрештою ми отримаємо ось такий код простого шаблону:



  <?php defined( '_JEXEC' ) or die;
$doc = JFactory::getDocument();
$tpath = $this->baseurl.'/templates/'.$this->template;
?> 
<!DOCTYPE html>
<html>
<head>
<jdoc:include type=«head» />
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template ?>/css/style.css" />
</head>
<body>
<header>
<jdoc:include type="modules" name="header" style="xhtml" />
</header>
<nav>
<jdoc:include type="modules" name="menu" style="xhtml" />
</nav>
<div>
<jdoc:include type="modules" name="left" style="xhtml" />
</div>
<div>
<jdoc:include type="component" style="xhtml" />
</div>
<footer>
<jdoc:include type="modules" name="footer" style="xhtml" />
</footer>
</body>
</html>

У наступній статті я розповім про стандартну архітектуру модулів і меню Joomla!

Коментарі