Важные мелочи

Раз мы начали обсуждать оформление, то стоит вернуться к разметке страницы index.php и немного довести её до «логичного» состояния, а именно — определиться с выводом данных модулей, подготовленных ядром Joomla!

В связи с тем, что области №2 и №4 находятся слева и справа соответственно, то чаще всего, при разработке шаблона, предполагается, что в область №2 будут выводиться модули с position=left, а в область №4 - модули с position=right

Делается это следующим образом:

<tr>
  <td width="15%" class="left"><?php echo mosLoadModules('left',0);?></td>
  <td width="70%"><?php echo mosMainBody();?></td>
  <td width="15%" class="right"><?php echo mosLoadModules('right',0);?></td>
</tr>

Поскольку такой вариант вполне логичен, то он довольно часто (хотя это и не является обязательным с точки зрения Joomla) используется разработчиками шаблонов. Точно таким же образом можно рассматривать вывод модулей для положений top или bottom (или любого другого), но как это было только что замечено — они не обязаны иметь такие названия или выводиться именно в «такую» (согласно названию) область.

Как вы могли заметить, в обе области добавлены классы стилевого оформления.

А сделано это для того, что бы при одинаковости выводимого ядром исходного HTML-кода модуля (скажем, <table class="moduletable"...) можно было применять различное оформление для модулей с левой и с правой стороны независимо. Т.е., например, в CSS-файле стили .left .moduletable{...} и .right .moduletable{...} могут иметь совершенно различное оформление и вам не придётся переделывать его, если вы вдруг захотите перенести, скажем, модуль из левой части шаблона в правую. В этом случае, модуль автоматически (согласно CSS-файла) «поменяет» свой внешний вид.

Для того, чтобы использовать в оформлении какой-либо графический файл, поместите его в папку images, тогда ссылка на него (для использования в файле стилей) будет url('../images/имя_файла').

Для оформления пути сайта (pathway), также обычно используют стандартный класс:

<span class="pathway"><?php mosPathWay();?></span>

С большой долей вероятности, в разметке шаблона вам придётся вставлять графические файлы, которых будет достаточно. А вставляются они так:

<?php echo $mosConfig_live_site.'/templates/папка_шаблона/images/имя_файла';?>

Если вы вдруг решите изменить имя (папку) шаблона, то вам придётся, соответственно, изменить название папки во всех ссылках не только на графические файлы, но и на файлы стилей и (если есть) на подключаемые файлы JavaScript. Это неудобно. Ведь лучше было бы поменять всё в одном месте, не так ли? Вот так мы и сделаем: в начале файла можно поместить код:

$picture_path = $mosConfig_live_site.'/templates/_имя_шаблона_/images/';

После этого, код вставки каждой <картинки> упрощается до:

 <td width="14" background="<?php echo $picture_path; ?>_имя_файла_картинки_"></td> 

или

<img src="<?php echo $picture_path;?>_имя_файла_картинки_" /> 

В начале файла index.php ещё необходимо инициализировать редактор, поэтому добавляем код:

<?php if ($my->id) initeditor(); ?>

Периодически, экспериментируя с шаблонами Joomla, пользователи наступают на старые грабли в виде темного фона в окнах визуальных редакторов. Большинство современных визуальных редакторов для Joomla, в первую очередь пытаются подключить CSS-файл из директории текущего шаблона с именем editor_content.css, а если он отсутствует, то основной CSS-файл шаблона template_css.css.

Поэтому, если в шаблоне сайта нужно задать фон редактора, отличный от основного фона страницы, то необходимо сделать следующее: в директории CSS текущего шаблона создать файл editor_content.css и в нем задать стиль для элемента BODY. Например так:

body{
  margin:0px;
  padding:0px;
  background: #FFFFFF;
  background-image: none;
}

После этого в визуальных редакторах фон станет белым, независимо от цвета фона страниц вашего шаблона.

Данное решение изначально не работает в «родном» TinyMCE, поскольку у него по умолчанию включено использовать css шаблона. Что бы это исправить, необходимо открыть настройки этого редактора (в панели администрирования, меню «Мамботы сайта») и отключить использование template_css.css.

Собственно, в конечном итоге только от вас зависит, как вы будете оформлять свой шаблон.