|
10.4. Установка и редактирование шаблона
Настало время установить простейший шаблон. Выполните команду Расширения Установить/удалить. Запакуйте файлы templateDetails. xml и index.php в архив mytemplate.zip и выберите этот архив, щелкнув на кнопке Обзор панели управления Joomla. Если вы правильно создали XML-файл, то увидите сообщение об удачной установке шаблона (рис. 10.1).
Рис.10.1. Шаблон удачно установлен
Затем выберите команду меню Расширениям=>Менеджер шаблонов, чтобы убедиться, что наш шаблон есть в списке шаблонов (рис. 10.2).
Рис. 10.2. Наш шаблон в списке шаблонов
Выберите его и щелкните на кнопке По умолчанию, затем просмотрите, как будет выглядеть ваш сайт (рис. 10.3). Да, не очень впечатляет. А все потому, что мы пока не определили стили и не использовали картинки в шаблоне.
Выберите наш шаблон и щелкните на кнопке Правка. Вы увидите редактор шаблона (рис. 10.4), в котором вам нужно щелкнуть на кнопке Редактировать HTML.
В тег <HEAD> добавьте следующий код (рис. 10.5):
<style>
body {
text-align: center;
moduletable { background: silver; color: white; )
moduletable h3 { background: gray; color: white; }
#wrap {
min-width:760px;
max-width:960px;
width: auto !important;
width:960px;
margin:0 auto;
text-align:center;
}
#header {}
#sidebar {float:left; width:20%; overflow:hidden; )
#content {float:left; width:60%; overflow:hidden }
#sidebar-2 {float:left; width:20%; overflow:hidden; }
#footer {clear:both;}
.inside {padding:10px;}
</style>
Рис. 10.6. Сайт с модернизированным шаблоном
Понятно, что на практике все стили будут вынесены в файл template, ess, который обычно находится в подкаталоге ess каталога с шаблоном. Подключить этот файл можно с помощью следующего кода, добавленного в заголовок файла index.php.
<head>
...
<link rel="stylesheet" href="/templates/
/css/template.css'
type="text/css" />
...
</head>
Все, что будет далее — только полет вашей фантазии. Используйте новые стили, картинки и создавайте собственные шаблоны. Хотя в большинстве случаев в целях экономии времени намного проще взять уже готовый шаблон и "довести его до ума", например, отредактировав размещение элементов или же изменив изображения или стили шаблона.
|