×
HeadHunter and Superjob rezume updater on Ruby on Rails (21 авг 2017)

Практикуемся в написании кода под rails.

Вопрос Пишем шаблон для joomla

Больше
6 года 8 мес. назад - 6 года 8 мес. назад #1 от Aleksej
Aleksej создал эту тему: Пишем шаблон для joomla
Верстку делаем в Adobe Dreamweaver или любом текстовом редакторе. Располагаем шапку, боковые колонки, меню навигации и т.д. И начнем вот с такой структуры:
  1. index.html
  2. images/
  3. css/template.css
Потом с легкостью можно будет переименовать index.html в index.php и дописать несколько строк в нем, ничего не трогая в стилях (особенно если немало прописано путей до изображений).

Будем делать самый простой шаблон. Файл index.html имеет у нас следующий вид (не забываем оставлять комменты в коде):
<!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">
<head>
  <link rel="stylesheet" type="text/css" href="css/template.css" />
</head>
<body>
<div class="wrap">
<div class="header">
        <h1>Шапка</h1>
</div><!--/end header-->


<div class="leftcol">
Информация для левой колонки
</div><!--/end leftcol-->
<div class="content">
Центральная часть для будущего шаблона
</div><!--/end content-->
<div class="clr"></div>
</div><!--/end wrap-->
</body>
</html>

в template.css пишем (здесь только самые необходимые стили, остальные сами):
div.header{height:80px; background:#EEE; border-bottom:1px solid #CCC; margin:0 0 10px 0;}
div.wrap{width:1000px; margin:0 auto;}
div.leftcol{width:280px; float:left;}
div.content{width:700px; float:right;}
.clr{clear:both;}
Оформлением меню и прочих элементов пока не занимаемся. Сначала просто создаем каркас - что и где будет находиться.

Когда страница в html будет готова так, как вам нужно - пора приступать к следующему шагу.

Для того, чтобы Joomla распознала Ваш шаблон, необходимо создать в папке с шаблоном файл templateDetails.xml (обратите внимание на регистр - он тут важен), который будет содержать имя шаблона, название позиций, дату создания, информацию об авторе.

Минимальный набор строк следующий:
<?xml version="1.0" encoding="utf-8"?>
<install version="1.5" type="template">
    <name>MyTemplate</name>
    <version>1.0</version>
    <creationDate>2010</creationDate>
    <author>Demetr</author>
    <authorEmail> dmitriev@joomdesign.ruДанный адрес e-mail защищен от спам-ботов, Вам необходимо включить Javascript для его просмотра. </authorEmail>
    <authorUrl>http://joomdesign.ru</authorUrl>
    <copyright></copyright>
    <license>GNU/GPL version 2</license>
    <description>Описание шаблона</description>
<positions>
        <position>breadcrumbs</position>
        <position>left</position>
        <position>top</position>
        <position>footer</position>       
    </positions>
</install>
Теперь меняем расширение у index.html на index.php и открываем его для редактирования. Будут некоторые основы, которые пригодятся для вывода информации.

В самом начале файла запрещаем прямой доступ к файлу такой строчкой:
<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>

В head пишем:
<jdoc:include type="head" />
<?php $template=$this->baseurl."/templates/".$this->template ;?>
<link href="<?php echo $template?>/css/template.css" rel="stylesheet" type="text/css" />
Переменная $template часто используется, чтобы определить путь до шаблона.
Далее. Находим место под левую колонку и приводим ее к такому виду:
<?php if($this->countModules('left')) {?>
<div class="leftcol>
        <jdoc:include type="modules" name="left" style="xhtml" />
</div><!--/end leftcol-->
<?}?>

Эта конструкция проверяет наличие модулей в позиции left. Если в нем что-то есть, то выводим модули, если же нет - div.leftcol не будет отображаться. Вывод пустых div'ов вовсе не обязателен для нас.

Таким образом возможно выводить любое количество модулей.

Самое основное содержимое выводится вот такой конструкцией:
<jdoc:include type="component" />

Перед ней необходимо добавить еще одну строчку, которая будет выводить системные сообщения, например: "Спасибо, Ваше сообщение отправлено" или "Логин и пароль неверны" и т.д. Заключительный вывод будет иметь следующий вид:
<jdoc:include type="message" />
<jdoc:include type="component" />

Представим ситуацию, что на некоторых страницах в левой колонке вы ничего не выводите. Тогда необходимо проверять в начале файла index.php - загружены ли модули, и выводить центральную колонку в зависимости от их загрузки; если ничего нет, то логично, что центральную колонку надо растянуть по всей ширине, т.е. присвоить div'у другой id или class.

Эту задачу решаем примерно вот таким методом:
<? if($this->countModules('left')) $content='content'; else $content='contentlfull';?>
дословно будет так: если в позиции left есть загружаемые модули, то переменной $content присваивается значение 'content', во всех остальных случаях - contentfull.

Теперь; там, где выводим центральную колонку вместо старого вывода:
<div class="content">
Центральная часть для будущего шаблона
</div><!--/end content-->

Будем выводить вот таким образом:
<div class="<?echo $content; ?>">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div><!--/end content-->
Таким образом - шаблон станет полностью динамичным и будет подстраиваться под любые ваши пожелания.

Безусловно, в статье описан лишь самый необходимый минимум. Остальное - определяется вашими задачами и... воображением.
Последнее редактирование: 6 года 8 мес. назад от Aleksej.

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.