gototopgototop
Register
Вход
Home /  Создание меню /  Как создать меню
Создание пунктов меню Печать E-mail
Базовый курс - Создание меню

Как создать меню сайта
Сегодня у меня романтическое настроение, и связано оно, как это ни покажется  странным, с созданием пунктов меню. К роскошной картинке, предваряющей наше занятие, мы ещё вернёмся. А пока вспомним, чему уже научились:

В уроке о создании меню мы рассмотрели, как создаётся новое системное меню (на примере меню spravka), как создаётся модуль меню (на примере модуля Справочное бюро), а также как выбирается  нужный тип меню для  создания нового пункта меню (на примере пункта меню Контакты).

Сегодня мы рассмотрим, как создаются пункты меню с привязкой их к материалам сайта.

Но до того, как мы перейдём непосредственно к изучению этой темы, давайте познакомимся с наглядным материалом.

Переведите сейчас взгляд вправо от статьи.  Вы видите колонку с несколькими модулями:

  • 1. Зелёная кнопка "Login". Это МОДУЛЬ входа на сайт.
  • 2. Под ним находится модуль "Базовый курс". Это МОДУЛЬ МЕНЮ. Меню, которое отражается  в этом МОДУЛЕ, у меня называется тоже "Базовый курс".
  • 3. Далее следует МОДУЛЬ "Темы сайта", в котором бесконечно вращаются  бело-оранжево-зеленые  слова. Это МОДУЛЬ для показа тегов сайта. Нажав на выбранное в "галактике" слово-тег, вы попадёте на содержащую этот тег статью.
  • 4. Ниже модуля с тегами находится МОДУЛЬ "Повышаем мастерство". Это ещё один МОДУЛЬ МЕНЮ. В нем отражается МЕНЮ, которое я при его создании назвала "Мастерство". Здесь я размещаю материалы, которые выходят, по моему мнению, за рамки Базового курса.


Забегая вперёд, покажу, как выглядит в админке (на момент написания этого урока) список всех меню сайта Joomlalessons.ru:
Как создать меню сайта
Рис.1

На Рис. 1 показано, что сейчас у меня шесть меню. Те, что обведены красными рамками, отражаются в модулях "Базовый курс" и "Повышаем мастерство". Как видите, названия меню и модуля в первом случае совпадают. Во втором случае они разные: меню называется "Мастерство", а модуль меню - "Повышаем мастерство".

Как создать меню сайтаВнимание! - нет правила, устанавливающего то, КАК вы должны называть то, что создаёте на своём сайте.  Называйте всё так, как хотите, как вам нравится, как вам удобнее, - ведь это ВАШ сайт, и админка - это ВАША кухня!


Располагаются вышеуказанные два модуля в позиции шаблона "right".

Указанное в Рис.1 меню, названное "mainmenu" - это моё главное меню. Оно отражено в модуле,  находящемся в позиции "user3". Это тот самый  горизонтальный модуль, который вы видите в самом верху любой страницы моего сайта.

Среди его пунктов есть пункт "Разные вопросы". Он отражает целое меню "Вопросы". И не так уж важно, что сейчас в "Разных вопросах" вопросов-то  раз-два и обчёлся. Это не страшно для начала работы сайта, - с  ростом  количества посетителей вопросы посыплются,  как из рога изобилия. Зная это из опыта работы с другими сайтами, я заранее создала целый раздел "Вопросы" с несколькими категориями. Потом я завяжу  раздел на отдельное МЕНЮ, создав под него специальный МОДУЛЬ.

Итак, как вы смогли убедиться на наглядном примере, вариаций меню и способов их вывода на обозрение посетителей сайта может быть сколько угодно. Но все они создаются для того, чтобы читателям было удобно отыскивать любой выстраданный Вами материал. Хорошо продуманное меню базируется на столь же хорошо продуманных заранее разделах и категориях. Одно исходит из другого. Роскошной всаднице нет необходимости понукать свою не менее роскошную лошадь: она опустила поводья, потому что уверена: воспитанная ею же красавица  знает, куда  они должны примчаться.

Теперь вы понимаете, почему я поставила романтическую картинку в самое начало этого урока? - чтобы в виде аллегории подчеркнуть: внешняя красота  сайта должна быть гармонично связанной с созданными для посетителей удобствами, быть одним целым, - как пара влюблённых сердец... (фу ты, как разговор о пунктах меню вкупе с весенним солнышком действуют на меня расслабляюще! - и я становлюсь рассеянно-отвлекающейся на рОманти-и-и-ические чувства..).

В понятие удобства входит многое: это и карта сайта, и поиск по сайту, и переводчик, и ссылки - как внутренние, так и внешние, и географические карты, и модули погоды, и....продолжать список можно до бесконечности. Он зависит от тематики сайта и творческого воображения его создателя. Но без чего не может обойтись ни один сайт, - так это без меню. Поэтому давайте ещё раз полюбуемся  чудесной картинкой, и приступим к занятию.

Процесс создания любого нового пункта меню происходит через меню "Все меню" :

Рис.2

В этом списке мы должны выбрать и открыть то меню, в котором намерены создать новый пункт. Давайте продолжим работать со Справочным бюро и создадим в нём сегодня три новых пункта, привязав их как к отдельной статье, так и к  категории.

Шаг 1. Открываем меню "Все меню>>Справочное бюро".

Шаг 2. В окне "Пункты меню: (Справка)" нажимаем на кнопку "Создать".

Шаг 3.  В окне "Пункты меню: (Создать)"  нажимаем на заголовок "Материалы", и он раскроется:

Уроки Joomla :: Создание меню
Рис.3

Если вы подведёте курсор к любому из открывшихся типов меню, появится всплывающая подсказка:

Рис.4

На Рис.3 отображена подсказка к Стандартному шаблону материалов, отображающему один материал, т.е. одну статью.



Отображение в меню одной статьи


Шаг 1. Если мы хотим завязать пункт меню на какую-либо конкретную статью, то в окне "Пункты меню: (Создать)" надо выбрать тип меню Материалы>>Стандартный шаблон материала.

Шаг 2. В окне "Пункт меню: (Создать)" даём заголовок  пункту меню. Я назову его "Одна статья" :

Уроки Joomla :: Создание меню
Рис.5

Теперь в Параметрах нажимаем на кнопку "Выбрать":

Рис.6

Появится окно со списком статей, среди которых надо найти нужную. Давайте для примера выберем самый первый заголовок Support and Documentation и нажмем на него :

Уроки Joomla :: Создание меню
Рис.7

Заголовок отразился в Параметрах:

Рис.8

Теперь можно нажать на кнопку "Сохранить".

Шаг 3. Проверяем лицевую панель и видим, что новый пункт меню "Одна статья" появился в меню "Справочное бюро":

Рис.9

Пройдитесь по этой ссылке и посмотрите, как выглядит страница сайта: кроме статьи Support and Documentation, других материалов на странице нет. Именно так будет выглядеть отображение ваших статей, если вы завяжете их в меню на Стандартный шаблон материала.


Шаблон блога категории


Если вы при создании пункта меню завяжете его на тип Шаблон блога категории, то все статьи из этой категории будут отображаться в лицевой панели  в формате блога. Что это означает "в формате блога" :

Шаг 1. Открываем Все меню>>Справочное бюро>>кнопка Создать.

Шаг 2. В окне "Пункт меню: (Создать)" выбираем Материалы>>Категория>>Шаблон блога категории:


Рис.10

Шаг 3. В новом окне заполняем строчку "Заголовок" - я назову этот пункт "Шаблон блога категории".

Шаг 4. В Основных параметрах надо выбрать из выпадающего списка название той категории, на которую вы хотите завязать создаваемый пункт меню. Давайте выберем  для примера  категорию Latest из раздела News, в которой сейчас находятся пять статей.

Далее надо решить, как будут располагаться материалы. В списке ниже уже предлагается вариант:

  • Во всю ширину 1
  • Вступление 4
  • Колонки 2
  • Ссылки 4


Давайте его и оставим. Теперь нажмём на кнопку "Применить".

Шаг 5. Открываем лицевую панель и проверяем результат:

Уроки Joomla :: Создание меню
Рис.11

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

Шаг 6. Изменяем параметры, например, на следующие:

  • Во всю ширину 1
  • Вступление 0
  • Колонки 1
  • Ссылки 4

Нажимаем на кнопку "Применить" и возвращаемся в лицевую панель. Перезагружаемся, и вот что видим теперь:

Уроки Joomla :: Создание меню
Рис.12

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

Таким вот образом вы можете экспериментировать столько, сколько понадобится. Когда придёте к окончательному варианту, нажмите на кнопку "Сохранить".
Теперь вы знаете, как так будет выглядеть отображение ваших статей, если вы завяжете их в меню на Шаблон блога категории.

 

 

Шаблон списка категории


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


Шаг 1. Открываем Все меню>>Справочное бюро>>кнопка Создать.

Шаг 2. В окне "Пункт меню: (Создать)" выбираем Материалы>>Категория>>Шаблон списка категории :


Рис.13

Шаг 3. В новом окне заполняем строчку "Заголовок" - я назову этот пункт "Шаблон списка категории".

  В Основных параметрах надо выбрать из выпадающего списка название той категории, на которую вы хотите завязать создаваемый пункт меню. Давайте опять выберем  для примера  категорию Latеst из раздела News, в которой сейчас находятся пять статей:

Уроки Joomla :: Создание меню
Рис.14

Сохраним изменения.

Шаг 4. Переходим в лицевую панель, перезагружаем страницу и видим следующее:

Уроки Joomla :: Создание меню
Рис.15

Кроме этого, в меню "Справочное бюро" добавился пункт "Шаблон списка категории":

Рис.16

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


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

а) в виде шаблона блога категории - когда каждая статья выводится для показа  вступительным текстом и кнопкой "Читать далее...". Если начало статьи заинтересовало читателя, он нажмёт на эту кнопку , и тогда статья откроется полностью;
б) в виде  шаблона списка категории - когда статьи выводятся в виде списка заголовков статьей, а заголовки - это ссылки . Если читателю нравится заголовок, то он нажмёт на ссылку и прочитает статью полностью.

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


Ну вот, кажется, я ничего не забыла. Ну, а забыла, так вы мне напомните своими вопросами.
Теперь, коль уж  я начала  урок со знакомства с наглядным материалом, давайте этим же действом его и закончим.

Опять взгляните направо, на МОДУЛЬ МЕНЮ "Базовый курс". Этот тип модуля меню называется "аккордеон". Черные клавиши с зеленым текстом - это тоже пункты меню, но они не завязаны  на материалы. Здесь я применила тип "Разделитель":

Уроки Joomla :: Создание меню
Рис.17

При нажатии на определённую кнопочку меню раскрывается, обнажая содержимое того, что кроется за каждым разделителем. Давайте пройдёмся по пунктам раздела "Предисловия к Базовому курсу". Их пять. Первые четыре привязаны пусть и к отдельным статьям, но всё-таки принадлежащим к одной категории. Если вы будете смотреть эти статьи последовательно, то обнаружите, что под каждой из четырёх статей (если есть комментарии, то под ними) есть указатели на предыдущую и следующую статьи из этой же категории:
Как создать меню сайта
Рис.18

Последний, пятый пункт, -  "Мои инструменты", - завязан на шаблон блога категории: статьи идут одна за другой, показывая вступление и кнопку "Подробнее". А в самом верху вы видите картинку с инструментами. Когда я создавала категорию "Мои инструменты", я поместила эту картинку в поле редактора, а потом сохранила вместе с самой категорий. Если бы я дополнительно к картинке сделала  текстовое описание категории, то вы бы сейчас увидели ещё и текст.

Теперь давайте перейдём к МОДУЛЮ МЕНЮ "Повышаем мастерство". Пункт меню "Как это сделать?.." завязан на шаблон списка категории. Вы видите, что  опять присутствует картинка категории (сама категория у меня называется "Как сделать", её название, как и название раздела, к которому она относится,  указывается под заголовком каждой открытой статьи:
Рис. 19).

Ниже картинки в виде списка идут заголовки всех статей из категории "Как сделать". Если бы я при создании материалов на разные темы помещала бы их кучей в одну и ту же категорию (например, в категорию "Как сделать" поместила бы материал о плагинах rokbox), то статья о плагинах появилась бы среди статей о том, как сделать какое-либо усовершенствование на сайте. Согласитесь, что подобная неразборчивость ставила бы в тупик посетителей сайта. В связи с этим хочу заострить ваше внимание на важности предварительного продумывания  разделов и категорий, а также правильной раскладке статей "по папочкам", т.е в соответствующие их теме категории.

Ну вот, теперь остаётся только выдохнуть: "Уф, урок окончен!"  и дать вам на прощание...

Домашнее задание: создать в меню "Справочное бюро" пункт меню "Вопросы" с привязкой его к разделу "FAQs". Материалы раздела вывести в меню в формате шаблона блога раздела.

Подсказка: сейчас в модуле "Main Menu" нашего Демо-сайта есть пункт меню "FAQs". Он выводит материалы одноимённого раздела в формате  стандартного шаблона  раздела.

О выполнении (или невыполнении) задания отчитайтесь, плиз, в комментариях!




 
ВХОД на сайт



Базовый курс создания сайта

 

Есть ли народ на сайте?

Сейчас 30 гостей онлайн

Мы вконтакте

Как сделать?...

Контакты





Copyright © 2011. Joomla! для "чайников". Автор сайта Наталья Мельниченко
Follow us on Twitter