2.3.5 Создание меню


После создания структуры содержимого, необходимо создать меню для пользователей веб-сайта. Меню – это набор кнопок, которые приведут на конкретные объекты, например, объект содержимого, список категорий, компонент и т.д.

Используя расширения Joomla легко создать меню для отображения на сайте. В данном руководстве рассматривается меню, построенное на стандартном модуле (установленном по умолчанию) mod_mainmenu. Данный модуль является по умолчанию главным для создания меню. Место вывода меню на сайте определяется в шаблоне сайта. Устанавливая дополнительные расширения, можно расширить возможности отображения стандартного меню или отобразить его в другом виде, например в виде выпадающего каскадного меню с подменю (часто необходимо, чтобы со стороны пользователя была включена поддержка Javascript в браузере).

Самый простой вариант (но ограниченный в возможностях) связать объект содержимого с пунктом меню, это использовать на странице редактирования объекта содержимого в окне дополнительных параметров вкладку "параметры связи с меню". Во вкладке данного окна необходимо:

выбрать меню, в которое будет добавлен пункт (ссылка),

выбрать название пункта меню.

Нажмите кнопку "Связать с меню".

Примечание: На странице редактирования раздела или категории в дополнительном окне справа(для создаваемого раздела или категории данное окно будет доступно после сохранения – кнопка "Сохранить"). В данном окне необходимо:

выбрать меню, в которое будет добавлен пункт (ссылка),

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

выбрать название пункта меню.

Нажмите кнопку "Связать с меню".




Рисунок 16 - Доступ к странице "Управление меню [mainmenu]"
Для работы с меню для сайта необходимо перейти на страницу "Управление меню". В основном меню выбрать "Меню", затем пункт меню "Управление меню".

Для работы с пунктами меню определенного меню (например, mainmenu) необходимо перейти на страницу "Управление меню [mainmenu]". В основном меню выбрать "Меню", затем пункт меню "mainmenu".

На странице "Управление меню [mainmenu]" (Рисунок 17) можно увидеть список уже созданных пунктов меню (по умолчанию без установки демонстрационных данных доступен только один пункт – "Главная").


Рисунок 17 - Страница "Управление меню [mainmenu]"


Для добавления нового пункта меню необходимо перейти на страницу "Новый пункт меню". Нажмите кнопку "Новый" на странице "Управление меню [mainmenu]" для добавления нового пункта меню в меню mainmenu.

На странице "Новый пункт меню" (Рисунок 18) доступно несколько типов создаваемого пункта меню. Все типы разбиты по группам.


Рисунок 18 - Добавление нового пункта меню
Когда выбран тип нового пункта меню, необходимо перейти на страницу "Добавление –новый пункт меню: XXX": Шаг 2 (тремя Х-ми заменено название типа нового пункта меню). На этой странице необходимо выбрать и заполнить основные параметры и поля нового пункта меню. Параметры и поля отличаются в зависимости от выбранного типа нового пункта меню. Нажмите на кнопку "Далее" или на выбранный тип пункта меню.

На Рисунок19 рассматривается пример добавления нового пункта меню типа: "Ссылка – объект содержимого". Для добавления необходимо:

Ввести имя нового пункта меню, поле "Название",

Выбрать объект содержимого (статью), поле "Содержимое для связи",

Выбрать как должно открываться окно при нажатии на пункт меню, поле "Url: При нажатии открыть в ... ",

Выбрать родительский пункт меню, поле "Родительский пункт меню",

Выбрать порядок расположения, поле "Порядок расположения",

Выбрать уровень доступа, поле "Уровень доступа",

Выбрать опубликован пункт меню, поле "Опубликован (на сайте)",

Справа можно, но не обязательно выбрать изображение меню, поле "Изображение меню".


Рисунок 19 - Добавление нового пункта меню
В поле"Родительский пункт меню" перечисляются все существующие пункты меню, которые можно выбрать как "родительский пункт" для нового пункта меню. Поддержка иерархической структуры меню и отображение ее на сайте возможны, только если в шаблоне есть поддержка отображения иерархии пунктов меню (большинство бесплатных шаблонов не поддерживают эту возможность). Для реализации меню с подменю используются дополнительные расширения, позволяющие улучшить создание и отображение структуры меню на сайте.

Если использовать возможность пред просмотра сайта, то можно увидеть результат добавления нового пункта меню.

Просмотр в новом окне браузера.

Просмотр в этом же окне с открытой панелью администратора.

Просмотр с показом позиций расположения моделей в шаблоне в этом же окне с открытой панелью администратора.


Рисунок 20 - Возможности пред просмотра сайта
2.3.6 Установка Шаблона сайта


Если вы сами непосредственно устанавливаете и настраиваете Joomla, то одним из первых действий по настройке является установка шаблона сайта для вашего проекта. Есть много свободно распространяемых шаблонов для Joomla 1.0, и установка нового шаблона не является сложной процедурой. Для Joomla 1.0 подходит большинство шаблонов, сделанных для Mambo 4.5.2.3.

Шаблоны сайта для Joomla обычно распространяются (так же как и расширения) в виде .zip файлов(или также .tar.gz файла).Для использования таких файлов необходимо сохранить файл шаблона и далее перейти на страницу "Установка нового шаблона сайта" (Рисунок 22).






Рисунок 21 - Доступ к странице "Установка нового шаблона сайта"
На странице "Установка нового шаблона сайта" необходимо выбрать нужный файл для установки. Нажмите кнопку "Обзор" для выбора файла шаблона сайта и нажмите кнопку "Загрузить и установить".


Рисунок 22 - Страница "Установка нового шаблона сайта"
Чтобы начать использовать шаблон сайта, необходимо перейти на страницу "Управление шаблонами сайта". Выберите в главном меню "Сайт", затем пункты "Управление шаблонами" и "Шаблоны сайта".




Рисунок 23 - Доступ к странице "Управление шаблонами сайта"
На странице "Управление шаблонами сайта" выберите нужный вам шаблон сайта и нажмите кнопку "По умолчанию". Шаблон сайта, выбранный по умолчанию, будет использоваться для отображения всего сайта.

Примечание: Если необходимо назначить определенный шаблон сайта для отображения определенного пункта меню, то необходимо выбрать шаблон и нажать кнопку "Назначить". Будет открыта страница "Назначение шаблона ХХХ для пунктов меню". На данной странице можно выбрать несколько пунктов меню, которые будут отображаться с использование выбранного шаблона. [6]


Рисунок 24 - Страница "Управление шаблонами сайта"
После установки и корректировки шаблона сайта, он уже отвечает всем необходимым требованиям разработки.


Заключение

В ходе выполнения выпускной квалификационной работы был получен полнофункциональный web-сайт, полностью готовый к применению. Данный сайт ориентирован на студентов и абитуриентов. С его помощью пользователи смогут получать необходимую информацию и задавать интересующие их вопросы в форуме. При размещении его в глобальной сети география распространения возрастает до масштабов всего мира.

При разработке web-сайта были проанализированы современные web-технологии, позволяющие создавать интерактивные web-страницы. Наиболее подходящими для выполнения поставленной задачи оказались Macromedia Dreamweaver MX 2004 и Joomla 1.0.12.

Разработанный сайт удовлетворяет всем требованиям, поставленным на этапе постановки задачи. При разработке web-сайта были использованы готовые модули аутентификации, форума и осуществления поиска по сайту. Данные модули были доработаны с учетом специфики web-сайта и успешно внедрены в его структуру.

В качестве дальнейшего совершенствования web-сайта представляется возможным разработка модулей доступа к системам дистанционного образования. Так же возможна доработка интерфейса сайта с целью дальнейшего повышения его информативности, привлекательности и удобства.




Использованные источники

1.     Web Database Application with PHP and MySQL, 2nd Edition By David Lane, Hugh E. Williams. © O'Reilly, May 2004. ISBN: 0-596-00543-1.

2.     CMS List. Обзор cms. Сайт о системах управления сайтом. http://www.cmslist.ru

3.     Joomla! CMS по-русски. http://joomlaportal.ru

4.     Материал из Википедии — свободной энциклопедии о системах управления сайтом. http://ru.wikipedia.org/wiki/CMS

5.     Content management system http://www.brutto.ru/informacija/uznat-bolshe/content-management-system

6.     Joomla-инструменты. http://docs.joom.ru/!;C651=0O:Categories

7.     CMS обзор: CMS, движок сайта, система управления сайтом, mambo, php nuke, netcat, phpbb, invision power board, vbulletin. http://cmsobzor.ru/news.php




Приложение А

Код шаблона страниц сайта

<?php

defined( '_VALID_MOS' ) or die( 'Доступ запрещен.' );

error_reporting( E_ERROR);

// needed to seperate the ISO number from the language file constant _ISO

$iso = explode( '=', _ISO );

// xml prolog

echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';

?>

<!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><?php mosShowHead(); ?> <?php

if ( $my->id ) {

initEditor();

}

$collspan_offset = ( mosCountModules( 'right' ) + mosCountModules( 'user2' ) ) ? 2 : 1;

//script to determine which div setup for layout to use based on module configuration

$user1 = 0;

$user2 = 0;

$colspan = 0;

$right = 0;

// banner combos

//user1 combos

if ( mosCountModules( 'user1' ) + mosCountModules( 'user2' ) == 2) {

$user1 = 2;

$user2 = 2;

$colspan = 3;

} elseif ( mosCountModules( 'user1' ) == 1 ) {

$user1 = 1;

$colspan = 1;

} elseif ( mosCountModules( 'user2' ) == 1 ) {

$user2 = 1;

$colspan = 1;

}

//right based combos

if ( mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' ) ) {

$right = 1;

}

?>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

<meta http-equiv="Content-Language" content="ru"/>

<link href="<?php echo $mosConfig_live_site;?>/templates/paranoia/css/template_css.css" rel="stylesheet" type="text/css" />

<style type="text/css">

<!--

.style1 {

font-size: 24px;

font-family: Verdana, Arial, Helvetica, sans-serif;

}

.style2 {font-size: 16px}

a:link {

text-decoration: none;

}

a:visited {

text-decoration: none;

}

a:hover {

text-decoration: none;

}

a:active {

text-decoration: none;

}

.style3 {

font-size: 16px;

font-family: Verdana, Arial, Helvetica, sans-serif;

}

-->

</style>

</head>

<body>

<table class="tborder" border="0" width="100%" style="border-collapse: collapse">

<tr>

<td><table border="0" width="100%" bgcolor="#FFFFFF" style="border-collapse: collapse">

<tr>

<td width="15%" hight="15%" align="center"><img border="0" hight= "25%" src="<?php echo $mosConfig_live_site;?>/templates/paranoia/images/vtitl.JPG" /> </td>

<td align="center" valign="top" rowspan="2"><a href="<?php echo $mosConfig_live_site.'/administrator' ?>">

<p></p>

</a>

<p class="style1"><font color="#000066">Российский химико-технологический университет имени Д.И. Менделеева</font></p>

<p class="style2"><font color="#000066">Новомосковский институт</font></p>

<p class="style3"><span class="style3"><font color="#000066">Кафедра «Вычислительная техника и информационные технологии»</font></span></p>

<a href="<?php echo $mosConfig_live_site.'/administrator' ?>">

<p></p>

</a></td>

</tr>

</table></td>

</tr>

</table>

<table><tr><td>

</td></tr></table>

<table border="0" width="100%" cellpadding="0" cellspacing="0">

<tr>

<td align="left" valign="top">

<table border="0" width="100%" style="border-collapse: collapse">

<tr >

<td align="left" valign="top">

<table class="tborder" cellspacing="1" cellpadding="3" width="100%" align="center" border="0">

<tr>

<td class="thead"><center><?php echo _LEFT_COLUMN_NAME;?></center></td>

</tr>

<tr>

<td class="vbmainwindow"><?php mosLoadModules ( 'left' ); ?>

</td>

</tr>

<tr>

<td class="vbmainwindow"><?php mosLoadModules ( 'user1' ); ?>

</td>

</tr>

</table>

</td>

<td width="10">&nbsp;</td>

<td width="100%" align="left" valign="top">

<table class="tborder" width="100%" border="0" align="center" cellpadding="3" cellspacing="1" id="table9">

<tr>

<td width="100%" class="thead"><?php include "pathway.php"; ?>

</td>

</tr>

<!-- ############################################## --><?php if ( mosCountModules( 'top' ) > 0 ) { ?>

<tr>

<td width="100%" valign="top" class="vbmainwindow" height="22">

<?php mosLoadModules ( 'top' ); ?> </td>

</tr>

<?php }; ?>

<!-- ############################################## -->

<tr>

<td class="vbmainwindow" width="100%" valign="top"><?php include ("mainbody.php"); ?>

</td>

</tr>

<!-- ############################################## --><?php if ( mosCountModules( 'bottom' ) > 0 ) { ?>

<tr>

<td width="100%" valign="top" class="vbmainwindow"><?php mosLoadModules ( 'bottom' ); ?>

</td>

</tr>

<?php }; ?>

<!-- ############################################## -->

</table>

</td>

<!-- ############################################## --><?php if ( mosCountModules( 'right' ) > 0 ) { ?>

<td width="10">&nbsp;</td>

</tr>

<?php }; ?>

<!-- ############################################## -->

</table>

</td>

</tr>

<tr>

<td align="center" height="5"></td>

</tr>

</table>

<table border="0" width="90%">

<tr>

<td><?php include_once( $GLOBALS['mosConfig_absolute_path'] . '/includes/footer.php' ); ?>

<?php mosLoadModules( 'debug', -1 );?></td>

</tr>

</table>

</body>

</html>