Главная Статьи Joomla Компоненты Joomla Компонент ПМеню ФС+ - собираем пазлы из модулей
Компонент ПМеню ФС+ - собираем пазлы из модулей
06.10.2009 02:56


Нередко владелец сайта сталкивается с достаточно серьезной проблемой. Часть требуемого контента сложно уместить в рамках веб – страницы. А хочется поместить всевозможные опросы, модули авторизации и прочий необходимый функционал на сайт. Решением в такой ситуации станет использование компонента ПМеню ФС+ . Сегодня мы рассмотрим не только возможности данного компонента, но и увидим: насколько расширяются возможности его использования в комплексе с компонентом SWMENU pro.

 

ПМеню ФС+ - коммерческая разработка. Приобрести его можно

на этой странице.


На сегодняшний день существует версия, как для Joomla 1.0.15 , так и для Joomla 1.5.x.x версии. Именно с последним вариантом мы и начнем работу.
ПМеню ФС+ состоит из собственно компонента и модуля, который впоследствии выводится в необходимую позицию сайта.


Принцип работы и задача на сегодня


Принцип работы ПМеню ФС+ заключается в следующем. В административной панели создаются кнопки, которые в дальнейшем посредством модуля выводятся на страницу сайта. К каждой кнопке опять же все в той же административной панели привязывается определенная позиция.


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


Теперь, после того, как я в двух словах рассказал суть работы ПМеню ФС+, предлагаю поставить задачу и внимательно рассмотреть работу компонента на практике.
Мы должны с помощью ПМеню ФС+ и компонента SWMENU Pro создать меню, где пункты подменю будут выпадать в несколько столбиков, причем каждый столбец будет озаглавлен уникальным заголовком. Предположим, в нашем меню будет 2 пункта. Первый из которых – «Главная».

 

Работа с компонентом ПМеню ФС+


Для создания требуемых кнопок, мы заходим в главное меню Компоненты – Pmenu FS+ - View

Image


Мы попадаем на новую страницу. На данный момент здесь не обнаруживается ни одной записи. И это неудивительно! Мы еще не создали ни одной кнопки. Немедленно исправляем это недоразумение.
В правом верхнем углу нажимаем кнопку «Создать».

Image


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

 

Image


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


Заголовок - введенная в данное текстовое поле надпись, будет отображаться на нашей кнопке. Поэтому смело пишем сюда слово «Главная».


Показывать заголовок – сей незатейливый выпадающий список предлагает нам сделать выбор: а отображать ли заголовок на кнопке?


Публикация – здесь мы решаем : публиковать кнопку на сайте или нет


Позиция модулей – это, пожалуй, один из главных элементов управления данного окна. Именно здесь мы выбираем позицию, модули из которой будут выводиться во всплывающем меню под кнопкой. В нашем примере, я решил привязать к кнопке «Главная» позицию user2. Именно в этой позиции у меня находится модуль авторизации. Теперь при наведении или клике мышкой по кнопке «Главная» будет появляться окно с предложением произвести авторизацию либо регистрацию на сайте.


Вывод модулей
– здесь выбираем способ вывода модулей. Например, если мы хотим разместить модули в несколько колонок, то выбираем вариант «горизонтально».


Позиция top, Позиция left – параметры выставленные здесь сообщают компоненту , где выводить всплывающее окно с модулями. Данные параметры отсчитываются от верхнего левого угла первой кнопки.


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


URL - при клике по опции – данное поле служит для ввода ссылки на ту или иную страницу. То есть, если мы введем в данное поле ссылку http://www.yachaynik.ru/ то при клике по кнопке «Главная» попадем на наш любимый сайт – Ячайник.


Картинка по умолчанию ,Картинка при фокусе, Картинка при нажатии
– данные параметры позволяют заменить надпись «Главная» заранее подготовленной картинкой. Файлы изображений должны быть загружены в папку /images/stories/ Впрочем, при желании каталог хранения изображений можно изменить.


Для этого нужно зайти в главное меню Компоненты – Pmenu FS+ - Settings

Image


И в текстовом поле «Путь к картинкам меню» изменить путь к каталогу на требуемый.

Image

 


Ширина картинки, Высота картинки - высота и ширина выводимого изображения


Заголовок модулей - в каждом всплывающем окне у нас есть возможность над выводимыми модулями указать какой-то заголовок. Именно он и вводится в данное поле редактора.


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


Теперь, когда введены все параметры, самое время нажать на кнопку «Сохранить» в правом верхнем углу экрана.


Подготовка к выводу меню


Мы помним, что наша первоочередная задача – создать меню, которое будет выводиться в две колонки.
Для этого заходим в «Менеджер меню» и создаем два меню. Назовем их Menu1 и Menu2. В каждом меню создаем по 4 пункта.


Теперь самое время заглянуть в компонент swMenuPro и создать два модуля меню которые будут привязаны к нашим Menu1 и Menu2. К сожалению, в рамках данной статьи я не планировал рассказать про swMenuPro. Могу лишь сказать, что возможности по настройке внешнего облика меню в этом компоненте просто огромны. Поэтому прежде чем, приступать к дальнейшей настройке нашего компонента, советую поиграться с внешним видом Menu1 и Menu2.


Оба модуля мы выводим в позицию User7. Эта позиция не прописана в шаблоне. Таким образом, наше всплывающее меню будет в своем роде уникально.
Теперь возвращаемся в административную часть компонента ПМеню ФС+. Именно туда где мы создавали кнопку «Главная». Теперь наша задача создать еще одну кнопку, при наведении на которую будет выпадать наше меню в два столбика.


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

Image


Сохраняем настройки.
Настало время заглянуть в модуль ПМеню ФС+, где мы произведем окончательную настройку вывода наших двух пунктов меню

 


Настройка модуля ПМеню ФС+


Заходим в главное меню Расширения – Менеджер модулей

Image


Кликаем по модулю PosMenuFS и попадаем на страницу его настроек.
Обращаем внимание на правую часть модуля – параметры:

Image


Разберем же подробнее элементы управления данным модулем:

 

  • Menu style – данный выпадающий список предлагает выбрать нам: как будут располагаться кнопки. Горизонтально или вертикально.
  • Effect open window – выключение данного эффекта заставит выплывающие окна с модулями появляться без эффекта медленного появления.
  • Effect speed – А здесь как раз устанавливается скорость появления окна. ( Slow – медленно, Fast – быстро)
  • Open window – здесь мы выставляем событие после которого появляется всплывающее окно (Mouse Focus – при наведении курсора мышки, Mouse Click - при клике мышкой по кнопке)
  • Delay close window – задержка перед закрытием окна
  • Opacity window – прозрачность всплывающего окна
  • Module style – стиль модуля

Заключение


В заключение я хотел бы продемонстрировать результат нашей с вами работы.
Итак, кнопка «Главная» при наведении на нее будет выглядеть вот так:

Image


А вот второй пункт меню у нас будет выглядеть следующим образом:

Image


Как мы видим, задача решена, и мы создали достаточно уникальное меню. На этом хотелось бы сказать вам: до свидания! Творческих успехов!

 


С уважением, Гоша Компьютерный

Комментарии (0)Добавить комментарий

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

busy
Обновлено 13.06.2011 15:01