|
Страница 1 из 2 Как и обещал, публикую статью о том, как создать собственный шаблон для Mambo-Joomla!(версия до 1.5). Рассмотрим структуру шаблона Mambo и необходимые куски кода, отвечающие за функции расположения модулей, компонентов и других блоков на вашем сайте. В начале советую посмотреть как устроен один из идущих с joomla! темплейтов, это поможет понять структуру размещения и использования кода.
Возможно, конечно, использовать в качестве базы уже готовый шаблон, и лишь внести в него свои корректировки и изменения. Но тогда вы точно запутаетесь, особенно коварен в этом смысле CSS(таблицы стилей). Итак, приступаем к созданию шаблона с нуля.
В начале индексного файла вашего шаблона(index.php) вставляем следующие фрагменты кода :
1.<?php echo "<?xml version="1.0"?>";
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
?> <!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">
это специфические теги, указывающие браузеру, что нижеследующий контент соответствует стандартам XML и xHTML
2.<head> <?php echo $mosConfig_sitename; ?>
отвечает за генерацию и вывод названия вашего сайта и заголовков страниц - вместо стандартного тега <title>
3. <meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
указывает кодировку для контента сайта
4. <?php include ("includes/metadata.php"); ?>
<?php include ("editor/editor.php"); ?>
подключение генератора метаданных и WISWIG редактора
5. <script language="JavaScript" type="text/javascript">
<!--function MM_reloadPage(init) { //reloads the window if Nav4 resized if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
} MM_reloadPage(true);
//-->
</script>
скрипт для корректного отображения шаблона в браузерах Mozilla и Netscape
6. <link href="<?php echo $mosConfig_live_site;?>/templates/business/css/template_css.css" rel="stylesheet" type="text/css" />
указывает расположение файла таблиц стилей - css
7.<link rel="shortcut icon" href="<?php echo $mosConfig_live_site;?>/images/favicon.ico" />
указывает расположение иконки для избранного
8. <?php initEditor(); ?> </head>
инициализация WISWIG редактора
Все следующие отрезки кода вставляются между тегами <body>
При вставке в шаблон картинок,изображений, кнопок и т.д необходимо также учесть, что путь к каждой картинке должен начинаться с :
<?php echo $mosConfig_live_site;?>
например :
<?php echo $mosConfig_live_site;?>/templates/your_template_dir/images/image.gif
По аналогии с картинками - любые относительные ссылки в Вашем шаблоне добжны выглядеть так :
<a href='<?php echo sefRelToAbs("index.php?option=com_docman"); ?>'>Downloads</a>
Идем дальше. Структурно шаблон в Mambo представляет собой набор определенных областей, в каждой из которых возможен вывод того или иного компонента, модуля, баннера или логотипа.
Для указания расположения этих областей используются следующие строчки :
<?php mosLoadComponent( "banners" ); ?>
область для вывода баннеров
<?php echo (strftime (_DATE_FORMAT_LC)); ?>
область для вывода текущего времени и даты
<?php include ("mainbody.php"); ?>
область для вывода основного контента (новости, статьи, форум и т.д.)
<?php include "pathway.php"; ?>
область для вывода текущего положения пользователя на сайте. (например выводит строчку такого вида: Главная-->Скачать-->Демо версии)
<?php mosLoadModules ( 'left' ); ?>
область для вывода модулей слева
<?php mosLoadModules ( 'right' ); ?>
область для вывода модулей справа
<?php mosLoadModules ( 'top' ); ?>
область для вывода модулей вверху
<?php mosLoadModules ( 'bottom' ); ?>
область для вывода модулей внизу
<?php mosLoadModules ( 'user1' ); ?>
<?php mosLoadModules ( 'user2' ); ?>
позволяет выводить любой модуль (а не только левый или правый) в любом отмеченном вами месте на сайте.
<?php mosLoadModules ( 'inset' ); ?>
<?php include_once('includes/footer.php'); ?>
область для вывода копирайтов и другой информации
<form action="index.php?Itemid=1" STYLE='margin-top: 0px; margin-bottom: 0px;' method="post">
<div align="right">
<input class="inputbox" type="text" name="searchword" size="20" value="<?php echo _SEARCH_BOX; ?>" onBlur="if(this.value=='') this.value='<?php echo _SEARCH_BOX; ?>';" onFocus="if(this.value=='<?php echo _SEARCH_BOX; ?>') this.value='';" />
<input type="hidden" name="option" value="search" />
</div>
</form>
вставляет форму для поиска на сайте
После вставки кода проверьте не разъезжаются ли таблицы, подправьте дизайн и сохраните страницу с именем index.php.
Разложите все по папкам в таком порядке:
сервер/templates/название вашего темплейта/images/ графика
сервер/templates/название вашего темплейта/css/template_css.css
сервер/templates/название вашего темплейта/index.php ваша только что сделанная страничка
сервер/templates/название вашего темплейта/template_thumbnail.png мини скриншот вашего дизайна
сервер/templates/название вашего темплейта/templateDetails.xml описание и авторские права(переделайте готовый файл от другого темплейта)
В принципе Вам совсем не нужно запоминать все описанные теги. Для облегчения создания шаблонов было создано замечательное дополнение для DreamWeaver MX. Загрузить дополнение можно в файловом архиве нашего хостинг-сайта.
Похожие статьи: Новые статьи по теме:
Интересные статьи по теме:
|
