УЧЕБНЫЕ МАТЕРИАЛЫ

Web-верстка, компьютерная графика,
мультимедиа

Уроки Joomla! 1.5

Авторы учебного курса:
Редькин Владимир Сергеевич,
студент гр. КТ-504 РГППУ, 2011,
Власова Наталья Сергеевна,
доцент кафедры информационных систем и технологий РГППУ




Урок 5. Менеджер меню

Цели:

  • Научить создавать навигационное меню для сайта в CMS Joomla! 1.5.

Задачи:

  1. Сформировать умения по управлению пунктами меню.
  2. Сформировать умения редактирования пунктов меню.
  3. Сформировать знания о возможных типах меню в CMS Joomla! 1.5.

В интерфейсной части присутствуют многочисленные меню. Часто они отображаются в отдельно стоящих рамках. Пункты меню обычно выровнены друг под другом, как показано на рис. 5.1.

Рисунок 5.1. Главное меню

Меню также могут быть интегрированы в дизайн страницы горизонтально, так что на первый взгляд они даже не воспринимаются как взаимосвязанные пункты меню. Меню CSS, которые могут быть даже полупрозрачными, выглядят весьма впечатляюще. Примеры можно найти на joomla.org. Эти меню и меню-ссылки динамически формируются Joomla! на основе содержимого базы данных в рабочей области Все меню. Каждое меню связано с так называемым модулем, который администрируют менеджером модулей.

1) Зайдите в административный раздел сайта Яхт Клуба.

Щелкнув на пункте Все меню – Меню, можно получить представление обо всех доступных меню (Рис. 5.2). К содержимому этих меню можно также обратиться через панель меню - Все меню – Main Menu, Все меню – User Menu и т.д. - или щелкнув на соответствующей ссылке меню в обзоре (Все меню – Менеджер меню).

Рисунок 5.2. Все меню

Менеджер меню

Менеджер меню, показанный на рис. 5.3, служит средством обзора и показывает множество пунктов меню, количество опубликованных и не опубликованных пунктов, количество пунктов меню, находящихся в корзине, и соответствующие идентификаторы (ID) меню. В этом разделе можно, например, скопировать меню или создать новое.

Рисунок 5.3. Менеджер меню

Рассмотрим пиктограммы на панели инструментов Менеджера меню.

  • Копировать. Для уже созданного можно создать точную копию меню, отметив меню и нажав по данной пиктограмме. В результате откроется форма, в которой необходимо указать название нового меню и название его модуля. В этой же форме будет отображено, какое меню копируется, и какие пункты оно содержит.
  • Удалить. Безвозвратно удаляет выбранное меню.
  • Изменить. Позволяет отредактировать: системное имя, заголовок и описание меню.
  • Создать. Вызывает форму для создания нового меню, в котором необходимо будет указать: системое имя, заголовок, описание, заголовок модуля.

2) Измените заголовки всех пунктов меню и их описание, переведя их на русский язык: Главное меню, Меню пользователя и Верхнее меню.

Создание нового меню

3) Создайте новое меню, для этого нажмите по пиктограмме Создать в Менеджере меню. В открывшейся форме Детали меню заполните поля как показано на рис. 5.4 и нажмите Сохранить.

Рисунок 5.4. Создание нового меню

По умолчанию только что созданные меню отключены, для включения необходимо перейти в Менеджер модулей, выбрав в меню Расширения – Менеджер модулей (Рис. 5.5).

Рисунок 5.5. Меню Расширения

4) Менеджер модулей содержит в себе две категории: «Сайт» и «Административная панель». Откройте Менеджер модулей для сайта (Рис. 5.6).

Рисунок 5.6. Менеджер модулей

Модуль в CMS Joomla! - это самодостаточные программы, они могут выполнять отдельные задачи в домене шаблона, такие как отображение баннера. Структура модуля позволяет легко и просто расширять веб-сайт.

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

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

Настройка модуля для меню

5) Откройте модуль mymenu для редактирования (Рис 5.7).

Рисунок 5.7. Изменение модуля mymenu

6) Изучите все управляющие элементы, которые возможно настроить для модулей меню.

Область Подробности.

  • Заголовок. Тут можно указать заголовок, который будет отображаться в списке менеджера модулей.
  • Показать заголовок. Отображает или скрывает указанный заголовок на сайте.
  • Включен. Включает или отключает модуль.
  • Позиция. Сообщает шаблону, где необходимо отображать модуль. Их можно выбирать из списка или вписывать самостоятельно.
  • Порядок. Позволяет изменить положение отображения модуля в списке менеджера модулей.
  • Доступ. Здесь указываются права доступа для модуля.

Область «Назначение меню» позволяет указать, на каких страницах данный модуль будет отображаться. Установив переключатель в положение «Выбрать из списка» можно вручную выбрать необходимые страницы из списка. Для выделения нескольких объектов используются клавиши Shift и Ctrl.

Область Параметры. Данная область включает в себя группы параметров для детальной настройки модуля.

  • Параметры модуля
    • Название меню. Здесь можно выбрать меню которое будет привязано к данному модулю (используется системное имя, указанное при его создании).
    • Стиль меню. Указывает, в каком виде отображать меню: список, вертикально, горизонтально, плоский список.
    • Начальный уровень. Уровень вложенности, на котором это меню должно начинаться.
    • Конечный уровень. Уровень вложенности, который должно включать меню для своего последнего пункта.
    • Всегда показывать вложенные подпункты. Вы можете держать пункты меню всегда открытыми, даже если выполнен щелчок на другие элементы. Эта функция имеет смысл только для вложенных структур меню.
    • Назначение Terget. Введенные здесь значения используются со всеми пунктами меню, которые имеют установки в новом окне браузера без меню для атрибута  On Click, Open in (При щелчке открыть в). Например:  top=10, left=10, width=200, height=300.
  • Расширенные параметры. Здесь можно указать дополнительные параметры позволяющие настроить назначения отображения меню средствами css и максимальную вложенность меню.
  • Другие параметры. Данные параметры позволяют настроить отображение картинок меню (по факту не используются). Самые полезные параметры здесь - разделитель, он позволяет указать символ для разделения между пунктами в горизонтальном меню (например, можно поставить знак «|»).

7) Включите меню и измените настройки меню таким образом, чтобы заголовок меню отображался на сайте и имел имя «Моё меню», меню располагалось в позиции «right», вложенные подпункты были видны. Проверьте отображение меню на сайте (должен быть виден только заголовок, так как пункты меню еще не созданы).

8) Измените, положение созданного меню в менеджере модулей, таким образом, чтобы оно находилось выше остальных модулей располагающихся в позиции «right». Посмотрите сайт после проделанных изменений, что изменилось?

Создание пунктов меню

9) Откройте для редактирования созданное Вами меню. Для этого выберите Все меню – Моё меню (Рис. 5.8).

Рисунок 5.8. Пункты меню

10) Создайте новый пункт меню, нажав по пиктограмме Создать. Откроется форма, в которой необходимо выбрать тип меню (Рис.5.9).

Рисунок 5.9. Выбор типа меню

Рассмотрим основные типы меню.

 Внутренняя ссылка - здесь располагаются типы меню, которые имеют внутренние назначения.

  • Материалы - всё что относится к созданным материалам и статьям:
    • В архив
      • Список материалов в архиве - отображает список архивных материалов, которые были заархивированы и ищутся по дате.
    • Материал
      • Стандартный шаблон материала - шаблон отображающий один материал.
      • Шаблон отправки материала - позволяет пользователям отправлять материал, работает только для авторов.
    • Категория
      • Шаблон блога категории - отображает материалы категории в формате блога.
      • Шаблон списка категории - отображает материалы категории в виде списка.
    • На главной
      • Шаблон блога материалов на главной - отображает материалы главной страницы в форме блога.
    • Раздел
      • Шаблон блога раздела - показывает список материалов раздела в форме блога.
      • Стандартный шаблон раздела - отображает список категорий раздела.
  • Контакты
    • Категория
      • Шаблон категории контакта - отображает все опубликованные контакты в данной категории.
    • Контакт
      • Стандартный шаблон контакта - стандартный шаблон отображает детали одного контакта.
  • Голосования
    • Голосование
      • Разметка Голосования - отображает результаты голосования.
  • Поиск
    • Поиск
      • Поиск - разметка стандартного поиска, выводит форму поиска и его результаты.
  • Пользователь
    • Войти
      • Разметка входа по умолчанию - создает вид разметки для входа пользователя.
    • Зарегистрироваться
      • Разметка по умолчанию для регистрации - создает вид разметки для регистрации нового пользователя.
    • Напомнить
      • Напоминание по умолчанию - создает вид разметки для напоминания имени пользователя.
    • Сбросить блокировки
      • Разметка по умолчанию для сброса - создает вид разметки для сброса пароля пользователя.
    • Пользователь
      • Разметка по умолчанию для пользователя - эта разметка отображает приветствие, когда пользователь входит в закрытую зону сайта.
      • Разметка пользовательской формы - данная разметка позволяет редактировать данные пользователя
  • Враппер
    • Враппер
      • Враппер - выводит IFrame, который будет внутри Joomla отображать стороннюю страницу или сайт.

 Внешняя ссылка - позволяет добавить пункт меню в виде ссылки на сторонний ресурс.

 Разделитель - позволяет вставить разделитель между пунктами меню.

 Псевдоним - позволяет добавить пункт меню находящегося в другом меню.

11) Выберите тип меню Материалы – Стандартный шаблон раздела. Заполните поля как показано на рис. 5.10 и нажмите Применить.

Рисунок 5.10. Стандартный шаблон раздела.

12) Проследите результат добавления данного пункта в интерфейсной части сайта (Рис. 5.11). Если всё получилось также, то нажмите Сохранить в редакторе пунктов меню.

Рисунок 5.11. Созданное меню

13) Аналогичным образом добавьте пункты меню Стандартный шаблон материала по любой статье, и Разметка Голосования по уже существующему голосованию на сайте.

Резюме

  • Чтобы получить информацию о всех меню созданных в CMS Joomla можно перейти в раздел: Все меню – Меню.
  • После создания нового меню, для его отображения на сайте необходимо включить соответствующий ему модуль в Менеджер модулей.
  • Местоположение меню задается в модуле данного меню в Менеджер модулей.
  • Для изменения типа пункта меню необходимо открыть его для редактирования и нажать на кнопку Сменить тип.

Контрольное задание

  1. Создайте в своем проекте меню.
  2. Настройте отображение созданного меню на сайте.
  3. Добавьте пункты, в созданное меню, ссылающиеся на материал, созданный в предыдущей теме.

Вопросы для самоконтроля

  1. Для чего необходим Менеджер меню?
  2. Какие возможности позволяет сделать Менеджер меню?
  3. Как указать место отображения для меню?
  4. Какие основные типы пунктов меню Вам известны?