Привет!

Нам нравится создавать сайты для интересных людей: о социальной и необычной деятельности, об удивительных человеческих и нечеловеческих существах, о чудесах и странностях, о том, что снится и о том, что стучится в двери.

Мы работаем с европейскими и русскими заказчиками, с теми, кто действительно любит то, чем он занимается.

Таким образом мы вкладываемся в игры Духа, и мир для нас становится глубже.

Модули в шаблонах

При вызове модуля из шаблона имеется несколько способов определить порядок его отображения.

В общем случае синтаксис вызова модуля имеет следующий вид:

<jdoc:include type="modules" style="0PTI0N" />

Атрибут style можно не указывать, поскольку стиль определен в файле templates/system/html/modules.php. В настоящее время файл, исполь­зуемый по умолчанию, modules.php, содержит определения следующих стилей.

0PTI0N="table" (стиль отображения по умолчанию) - модули отобража­ются в виде колонки. Следующий фрагмент демонстрирует, как выгля­дит код разметки, генерируемый системой:

<table cellpadding="0" cellspacing="0" class="moduletableget('moduleclass_sfx'); ?>"> <?php if ($module->showtitle != 0) : ?> <tr>

<th valign="top">

<?php echo $module->title; ?> </th> </tr> <?php endif; ?> <tr> <td>

<?php echo $module->content; ?> </td> </tr> </table>

0PTI0NS="horz" - модули выводятся горизонтально. Каждый модуль выводится в отдельной ячейке окружающей таблицы. Следующий фрагмент демонстрирует, как выглядит код разметки, генерируемый системой:

<table cellspacing=,,1" cellpadding=M0" border="0" width="100%"> <tr>

<td valign="top">

<?php modChrome_table($module, Sparams, Sattribs); ?> </td> </tr> </table>

0PTI0NS="xhtml" - модули помещаются в обычный элемент div. Следую­щий фрагмент демонстрирует, как выглядит код разметки, генерируе­мый системой:

<div> <?php if ($module->showtitle != 0) : ?> <h3><?php echo $module->title; ?></h3> <?php endif; ?>

<?php echo $module->content; ?> </div>

0PTI0N="rounded" - в этом случае модули отображаются в формате, кото­рый позволяет, например, выводить рамку со скругленными углами. При использовании этого стиля имя moduletable элемента <div> изменя­ется на module. Следующий фрагмент демонстрирует, как выглядит код разметки, генерируемый системой:

<div> <div>

<div> <div>

<?php if ($module->showtitle != 0) : ?> <h3><?php echo $module->title; ?></h3> <?php endif; ?>

<?php echo $module->content; ?> </div> </div> </div> </div>

0PTI0N="none" - содержимое модуля просто выводится на страницу без использования контейнеров и без заголовка, например:

echo $module->content;

Как видите, значения OPTION для атрибута style, определяющие стили CSS (xhtml и rounded), приводят к генерированию более прямолинейного кода разметки, что упрощает оформление веб-страницы с помощью стилей. Я не рекомендую использовать значения table (по умолчанию) и horz, если в этом нет необходимости.

Дальше еще интереснее!

Если заглянуть в файл modules.php, можно увидеть все имеющиеся значения, предназначенные для модулей. Вы без труда можете добав­лять к ним свои значения - это неоспоримое преимущество версии 1.5. Более подробно мы поговорим об этом в разделе «Преобразование с по­мощью шаблонов».

В нашем шаблоне мы определим для всех модулей стиль "xhtml":

<body> <div> <div> <div> <h1x?php echo $mainframe->getCfg('sitename*);?x/h1> <jdoc:include type="modules" style="xhtmr /> </div> </div>

<div>

<div> cjdoc:include style="xhtmr />

</div> </div>

<div> <div class="inside"> <jdoc:include name="breadcrumbs" style="none" /> <jdoc:include type="component" /> </div> </div>

<div> <div class="inside"> <jdoc:include name="right" style="xhtml" />

</div> </div>

<div id="footer"> <divStyle584" style="margin-top:.1pt;margin-right:38.4pt;margin-bottom: 0cm;margin-left:14.5pt;margin-bottom:.0001pt;text-indent:8.5pt;line-height: 10.2pt;mso-line-height-rule:exactly;mso-pagination:widow-orphan">cjdoc:include type=,,modules" name="footer" style=,,xhtml" /> </div> </div> <!-- конец обертки --> </body>

Обратите внимание: мы не использовали стили модулей в элементе < j doc: include type="component" />, потому что это не модуль.

 

Это нужно знать----------------------------------------------------------------------------------------------------------------------------

Кроме того, заголовок сайта был помещен в тег <Н1>. Семантически это более правильно и к тому же способствует повышению уровня оптими­зации для поисковых систем (SEO). Кроме того, было удалено описание цвета фона из элементов div макета.

Добавлены стили CSS для создания рамки вокруг модулей и установки цвета фона заголовка модуля.

В результате получился такой файл CSS:

/* Compass Design: стили оформления текста */ * {

margin:0; padding:0; }

hi,h2,h3,h4,h5,h6,р,blockquote,form,label,ul,ol,dl,fieldset,address {

margin: 0.5em 0;

}

li.dd {

margin-left:1em; }

fieldset { padding:.5em; }

body {

font-size:76%;

font-family:Verdana, Arial, Helvetica, sans-serif; line-height:1.3; margin:1em 0; }

#wrap{

border:1px solid #999; }

#header{


В версии 1.5 имеется возможность полной настройки результатов вывода модулей, кро­ме этого можно использовать предварительно созданный вывод. Все эти возможности называются стилем оформления модуля (module chrome).

border-bottom: 1рх solid #999; }

#footer{

border-top: 1рх solid #999; }

а{

text-decoration:none; }

a:hover{

text-decoration:underline; >

hi,.componentheading{ font-size:1.7em; >

h2,.contentheading{ font-size:1.5em; }

h3{

font-size:1.3em; >

h4{

font-size:1.2em; }

h5{

font-size:1.1em; >

h6{

font-size:1em; font-weight:bold; }

#footer,.small,.createdate,.modifydate,.mosimage_caption{ font:0.8em Arial,Helvetica,sans-serif; color:#999; }

.moduletable{ margin-bottom:1em;

padding:0 Юрх; /* отступ для текста внутри */ border:1рх #ССС solid; }

.moduletable h3{

background:#666;

color:#fff;

padding:0.25em 0;

text-align:center;

font-size:1.1em;

margin:0 -10px 0.5em -10px;

/* отрицательный отступ, чтобы сместить h3 назад относительно отступа .moduletable */ }