Контакты

Построение и показ меню. Многоуровневое меню на PHP и MySQL Черствый menu php

Поскольку она раскрывает содержание модуля menu.php . Ниже будет представлена собственная разработка меню на PHP, которая была написана с нуля в блокноте.

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

Для начала приведу примерную структуру сайта, для которого подойдет это меню. Структура сайта должна иметь следующий вид (классический вид):

/index.html /razdel_1/ /razdel_1/articles_1.html /razdel_1/articles_2.html ... /razdel_2/ /razdel_2/articles_1.html /razdel_2/articles_2.html ... ... ... /razdel_N/articles_2.html

Сайт может содержать у разделов еще и подразделы:

/razdel_1/podzaderl_1/ /razdel_1/podzaderl_1/articles_1.html /razdel_1/podzaderl_1/articles_2.html ... /razdel_1/podzaderl_2/articles_1.html /razdel_1/podzaderl_2/articles_2.html

Такая структура также будет работать для нашего меню лишь с небольшими отличиями.

Я предлагаю создать отдельный файл для меню на php. Например, menu.php было бы отличным названием для такого файлика. Для реализации меню также представлен стиль меню в CSS, чтобы сразу сделать его более менее красивым. Естественно этот стиль дается только для ознакомления, поскольку дизайны у сайтов очень разные.

Код для стиля меню в CSS:

.menu { height:42px; padding:0 0 0 16px; background:url(images/spacer.png) repeat; } .menu li { display:block; float:left; } .menu li.active { background: #000011; } .menu a { color:#FFF; display:block; line-height:42px; text-decoration:none; padding:0 14px; } .menu a:hover { background:url(images/spacer.png) repeat; }

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

Первый вариант кода меню на PHP

\n"; for ($i=0;$i": "
  • "; echo "".$array_menu[$i]["name"]."
  • \n"; } echo ""; ?>

    Меню можно разделить на две части. Первая содержит информационный массив $array_menu , в который заносятся названия наших разделов с ссылками на разделы. Есть вариант забить эти данные в базу данных mySQL, но особо смысла в этом нет, поскольку выборка совсем небольшая, поэтому на скорость работы это никак не повлияет.

    Вторая часть содержит вывод меню через цикл for . В цикле происходит сравнение адреса сайта с адресом из массива $array_menu . Если есть совпадение, то выводим очередной раздел меню со специальным классом active:

  • , иначе просто
  • . Это позволяет нам выделить каким-то цветом ту часть меню, в котором находится пользователь. На мой взгляд, это необходимая вещь для любого сайта, чтобы пользователь мог понимать в каком разделе он находится.

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

    Примечание:
    В случае, если URL (адреса) заголовком разделов имеют вид:
    /razdel_1
    или такой
    /razdel_1/nazvanie_razdela.html
    то в array_menu нужно записывать точное совпадение:
    $array_menu[$i]["url"]="/razdel_1"
    или для второго случая:
    $array_menu[$i]["url"]="/razdel_1/nazvanie_razdela.html" ;

    Как работает первый вариант меню?
    Он подсвечивает меню только, если Вы находитесь по адресу заголовка раздела. Например, если адрес страницы будет /razdel_1/articles_1.html , то меню никак не будет подсвечиваться.

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

    Второй вариант кода меню на PHP

    "; for ($i=0;$i": "
  • "; echo "".$array_menu[$i]["title"]."
  • "; } else { echo ($URL) == ($array_menu[$i]["url"]) ? "
  • ": "
  • "; echo "".$array_menu[$i]["title"]."
  • "; } } echo ""; ?>

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

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

    Урок 3. Меню на php для сайта делаем динамичным - чайникам

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

    Создадим для примера три страницы и назовем их Раздел 1, Раздел 2, Раздел 3

    Этот текст для разных страниц будет разный, но мы не будем на нем заморачиваться и оставим его как есть на всех страницах.

    Приступим к созданию сайта на php.

    1. Выделим блоки header, logo, menu, footer в отдельные файлы c расширением php или html

    header.html

    logo.html

    menu.html

    footer.html

    Добавим файл с этим текстом, чтобы видеть его на всех страницах. Назовем его text.html

    Примечание. С этого момента дальнейшие записи буду вести непосредственно в файле text.html

    2. Создадим шаблон для нашего сайта на php.

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

    3. Теперь файл template.html нам не нужен.

    Благодаря ему мы имеем представление о том, как будет выглядеть наш сайт.

    4. Нашим шаблоном является файл template.php

    В него мы сейчас вставим с помощью команды include все элементы сайта.

    5. Создадим три странички, как собирались изначально.

    Раздел 1 , назовем 1.php

    Раздел 2 , назовем 2.php

    Раздел 3 , назовем 3.php

    Для этого можно воспользоваться простейшей командой сохранить как...

    Для самых маленьких поясню: открываем файл template.php , затем нажимаем сохранить как... и сохраняем под названием 1.php , повторяем процедуру и последовательно сохраним страницы сайта 2.php , 3.php

    У нас получилось 3 страницы с одинаковым дизайном. Достаточно вставлять вместо файла text.html другой, дополнять разными картинками или какими-либо html кодами, скриптами и содержимое каждой страницы будет уникальным.

    Внимание!

    Если не будет создан файл index.php для главной страницы, то в браузере, набрав адрес сайта мы не увидим сам сайт, а всего лишь структуру директории (перечень папок).

    Можете посмотреть в денвере и убедиться. Исправим ситуацию - создадим файл index.php и назовем долго не мудрствуя Главная . Заодно создадим файл text-home.html и с помощью команды include вставим на только что созданную главную страницу сайта.

    6. Как просмотреть сайт на php?

    Что получилось - так просто не увидим. Это уже не шаблон с расширением html.

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

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

    Теперь возьмемся за php меню сайта.

    1. Откроем файл menu.html и превратим раздел1, 2 и 3 в ссылки по сайту. Ссылки в php создаются по-разному.

    Наша задача - научиться чувствовать сайт, созданный на php. Поэтому ссылки будем делать, как на обычном статичном сайте Раздел 1 и т.д.

    Мне эта процедура создания ссылок безумно нравится в Macromedia Dreamweaver. Успевай жать ОК и пить кофе.

    2. Как сделать ссылку в меню неактивной, если посетитель находится на данной странице.

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

    Если вы выполнили все шаги строго по пунктам, то видите, что у нас все ссылки в меню активны постоянно. Как это исправить?

    Для начала вспомним определение что такое Условные операторы

    – это когда какое-то действие выполняется или не выполняется в зависимости от условий.

    Выполним следующие действия:

    if ($master == "Главная") // это условие. Если оно выполняется – то в данном месте меню с помощью команды echo вставляются обычные HTML-теги выводящие надпись «Главная».

    echo "

    Главная

    ";

    else //означает «иначе» - что произойдёт, если условие не выполняется. В данном случае при невыполнении условия надпись «Главная» будет ссылкой, ведущей на главную страницу.

    echo "

    Главная

    ";

    • Условие мы придумали, но чтобы проверить переменную нужно её задать.

    Для этого на всех страницах разместим такие блоки кода:

    $master ="Главная";

    $master ="Раздел 1";

    $master ="Раздел 2";

    $master ="Раздел 3";

    Как видно для каждой страницы свой код.

    Итак, наши практические шаги по созданию php меню будут следующие:

    1) Открываем файл index.php

    и вставляем код

    $master ="Главная";

    до места вставки кода, выводящего само меню сайта include "menu.html";
    ?>

    2) Открываем файл menu.html и вставляем код с условием вместо простой html ссылки на главную страницу.

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

    3) Повторяем пункт 1 и 2 со страницами 1.php, 2.php, 3.php

    Повторение 1:

    1) Открываем файл 1.php и вставляем до кода, выводящего меню блок с заданной переменной

    $master ="Раздел 1";

    2) Открываем файл menu.html и вставляем код с условием вместо простой ссылки Раздел 1 , внеся следующие изменения:

    if ($master == "Раздел 1") // это условие. Если оно выполняется – то в данном месте меню с помощью команды echo вставляются обычные HTML-теги выводящие надпись «Раздел 1».

    echo "

    Раздел 1

    ";

    else //означает «иначе» - что произойдёт, если условие не выполняется. В данном случае при невыполнении условия надпись «Раздел 1» будет ссылкой, ведущей на главную страницу.

    echo "

    Раздел 1

    ";

    Чудо повторилось! Теперь, если мы находимся на странице Раздел 1 , ссылка в меню не активна.

    Повторенье - мать ученья! Или для тех, кто в танке! Еще раз

    Повторенье 2

    1) Открываем файл 2.php и вставляем код.

    $master ="Раздел 2";

    2) Снова откроем файл menu.html и вставляем код с условием

    if ($master == "Раздел 2") // это условие. Если оно выполняется – то в данном месте меню с помощью команды echo вставляются обычные HTML-теги выводящие надпись «Раздел 2».

    echo "

    Раздел 2

    ";

    else //означает «иначе» - что произойдёт, если условие не выполняется. В данном случае при невыполнении условия надпись «Раздел 2» будет ссылкой, ведущей на главную страницу.

    echo "

    Раздел 2

    ";

    Повторенье 3

    1) Открываем файл 3.php и задаем переменную.

    $master ="Раздел 3";

    2) В файл menu.html вставляем код с условием вместо ссылки Раздел 3 , изменения такие:

    if ($master == "Раздел 3") // это условие. Если оно выполняется – то в данном месте меню с помощью команды echo вставляются обычные HTML-теги выводящие надпись «Раздел 3».

    echo "

    Раздел 3

    ";

    else //означает «иначе» - что произойдёт, если условие не выполняется. В данном случае при невыполнении условия надпись «Раздел 3» будет ссылкой, ведущей на главную страницу.

    echo "

    Раздел 3

    ";

    Итог : мы вместо ссылок в меню такого вида

    Главная


    Раздел 1

    Раздел 2


    Раздел 3

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

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

    Вы можете скачать архив со всеми файлами шаблона сайта и меню php. Новичкам в программировании рекомендуется.

    Если же вы готовы к серьезному изучению php, то лучше видео курса от Попова найти сложно. У него огромный опыт и хороший слог.

    ]]> ]]>

    Именно это мы сейчас и разберем. И так, стоит задача, сделать вертикальное меню, в виде выпадающего списка.

    Как это можно реализовать на PHP? Очень просто! Например, у нас есть файл index.php, который в зависимости от выбранного раздела в выпадающем списке, должен отображать соответствующий контент на странице. Реализуется это следующим образом:

    1. Создаем файлы в формате.html, которые и будут содержать в себе необходимый для вывода контент.

    2. Создаем (пишем) в скрипте index.php необходимые условия, для вывода соответствующей информации.

    3. Рассматриваем созданный скрипт с позиции безопасности выполняемого сценария.

    Ну, вроде, как с теорией закончил, переходим к практике. Сначала создаем статические страницы в формате .html , которые и будут содержать необходимую информацию. Там можно написать все, что душе угодно:) В итоге у нас должно получиться, как минимум два файла first.html и second.html , соответственно потом их можно будет сделать сколько угодно, поняв основной алгоритм работы кода.

    Для вывода выпадающего списка в файле index.php создаем html форму, и ниже пишем PHP скрипт такого содержания:



    Menu PHP


    Выпадающее меню на PHP












    if (isset ($_GET ["where" ]))
    {
    if ($_GET ["where" ]==1 )
    $file = "first.html" ;
    if ($_GET ["where" ]==2 )
    $file = "second.html" ;
    include ($file );
    }
    ?>


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

    Уязвимость данного скрипта заключается в том, что переменная $file остается не инициализирована, и в этом случае значение автоматически созданной переменной попадает сразу в функцию include , а она в свою очередь успешно ее (переменную) подключает и отображает на экране. И это может быть не только файл конфигурации .htaccess . Для того, что-бы взломать данный сценарий, достаточно параметру where передать не предусмотренное кодом значение, ну например 3. А так, как это значение не предусмотрено сценарием, то просто переменная $file не пройдет инициализацию. Поэтому, ей можно будет задать произвольное значение через строку URL.

    http://localhost/index.php?where=3&file=.htaccess

    Но это так, небольшое отступление от темы. 😀

    Вариант решения данной проблемы достаточно прост, переменную $file просто необходимо инициализировать до начала использования, т. е. присвоить ей значение по умолчанию.

    Здесь, если параметр where передан скрипту, то переменная будет инициализирована корректно, иначе просто окажется пустой. Вот такое получилось [безопасное] выпадающее меню на PHP.

    P.S. Создавая сценарии необходимо учитывать и соответственно исключать все возможные векторы атак. Только так можно создать проект, который будет отвечать правилам безопасности и востребован заказчиком. До новых встреч!

    В общем случае задача формирования меню включает:

    • выделение HTML элементов для построения меню;
    • создание шаблона меню (создание шаблона компонента Меню );
    • включение функции показа меню (вызов компонента Меню ) в общем шаблоне ("прологе" и "эпилоге");
    • заполнение меню в соответствии со структурой сайта.

    Структура меню

    Любое меню на сайте строится на основе двух составляющих:

    • массива данных $aMenuLinks , определяющего состав меню, задает названия и ссылки для всех пунктов меню. Управление массивом данных осуществляется через административный интерфейс;
    • шаблона внешнего представления меню. Шаблон меню - это PHP код, определяющий внешний вид меню (шаблон компонента Меню ). Шаблон меню обрабатывает массив данных, выдавая на выходе HTML-код.

    Массив данных меню

    Данные для каждого типа меню хранятся в отдельном файле, имя которого имеет следующий формат: .<тип меню>.menu.php . Например, для хранения данных меню типа left будет использоваться файл .left.menu.php , а для хранения данных меню типа top - файл .top.menu.php .

    Меню является иерархически наследуемым. Файлы меню размещаются в папках тех разделов сайта, где требуется показ соответствующих типов меню. Если для данного раздела не создан соответствующий файл меню, система производит поиск файла в каталоге уровнем выше.

    Например, т.к. основное меню (в демо-версии продукта, это меню типа top ) должно выводиться во всех разделах, то файл данного меню помещается только в корневой каталог сайта.

    Соответственно меню второго уровня (в демо-версии продукта, это меню left ) выводится отдельно для каждого раздела сайта. Поэтому в папке каждого раздела создается свой файл для данного типа меню.

    Ещё пример : посетитель находится в разделе /ru/company/about/ . Для показа меню типа left файл меню ищется системой в следующей последовательности:

    1. /ru/company/about/.left.menu.php
    2. /ru/company/.left.menu.php
    3. /ru/.left.menu.php
    4. /.left.menu.php

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

    Система Bitrix Framework позволяет также создавать меню динамического типа Для этого требуется в компоненте Меню включить опцию Подключать файлы с именами вида.тип_меню.menu_ext.php ("USE_EXT" => "Y"), которая по умолчанию выключена. . Т.е. массив данных таких меню генерируется автоматически на основании некоторых данных, получаемых с помощью программного кода. Данный код должен храниться в папке соответствующего раздела сайта в файле с именем .<тип меню>.menu_ext.php.

    Основная задача подобных файлов - это манипуляция массивом $aMenuLinks . Данные файлы не редактируются визуально в модуле Управление структурой , поэтому они не смогут быть случайно отредактированы при визуальном редактировании меню. При создании этого файла используйте компонент Пункты меню (bitrix:menu.sections ).

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

    Внимание! Если в качестве пунктов меню используются разделы каталога без ЧПУ, необходимо указывать переменные в значимых переменных запроса.

    Примером такого меню может служить левое меню раздела Каталог книг , представленное в демо-версии продукта. Здесь первые два пункта меню Авторы и Рецензии созданы обычным способом, а остальные (Бизнес-литература , Детская литература и т.д.) формируются динамически.

    В данном случае в качестве пунктов меню используются названия групп каталога Книги , созданного на основе информационных блоков. Программный код, на основе которого генерируется меню, хранится в файле .left.menu_ext.php в папке /e-store/books/ .


    В файлах .<тип меню>.menu.php могут использоваться следующие стандартные переменные:

    • $sMenuTemplate - абсолютный путь к шаблону меню (данная переменная используется крайне редко);
    • $aMenuLinks - массив, каждый элемент которого описывает очередной пункт меню.

      Структура данного массива:

      Array ( => пункт меню 1 Array ( => заголовок пункта меню => ссылка на пункте меню => массив дополнительных ссылок для подсветки пункта меню: Array ( => ссылка 1 => ссылка 2 ...) => массив дополнительных переменных передаваемых в шаблон меню: Array ([имя переменной 1] => значение переменной 1 [имя переменной 2] => значение переменной 2 ...) => условие, при котором пункт меню появляется это PHP выражение, которое должно вернуть "true") => пункт меню 2 => пункт меню 3 ...)

    Примеры файлов меню

    IsAuthorized()"), Array("Журнал обучения", "gradebook.php", Array(), Array(), "\$GLOBALS["USER"]->IsAuthorized()"), Array("Анкета специалиста", "profile.php", Array(), Array(), "\$GLOBALS["USER"]->IsAuthorized()"),); ?> IncludeComponent("bitrix:menu.sections", "", Array("ID" => $_REQUEST["ELEMENT_ID"], "IBLOCK_TYPE" => "books", "IBLOCK_ID" => "30", "SECTION_URL" => "/e-store/books/index.php?SECTION_ID=#ID#", "CACHE_TIME" => "3600")); $aMenuLinks = array_merge($aMenuLinks, $aMenuLinksExt); ?>

    Организация показа меню

    Показ меню на страницах сайта выполняется с помощью компонента Меню (bitrix:menu) . Например, вызов верхнего меню на демо-сайте имеет следующий вид.

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

    Для начала создадим таблицу в базе данных со следующими полями:

    • id - уникальный идентификатор.
    • title - анкор ссылки в меню.
    • link - адрес, на который будет вести пункт меню.
    • parent_id - родительский ID. Если родительского пункта нет, то здесь будет NULL (либо можно ещё 0 поставить).

    С таблицей разобрались, теперь пришло время PHP-кода . Полный PHP-код приведён ниже:

    $mysqli = new mysqli("localhost", "root", "", "db"); // Подключаемся к БД
    $result_set = $mysqli->query("SELECT * FROM `menu`"); // Делаем выборку всех записей из таблицы с меню
    $items = array(); // Массив для пунктов меню
    while (($row = $result_set->fetch_assoc()) != false) $items[$row["id"]] = $row; // Заполняем массив выборкой из БД
    $childrens = array(); // Массив для соответствий дочерних элементов их родительским
    foreach ($items as $item) {
    if ($item["parent_id"]) $childrens[$item["id"]] = $item["parent_id"]; // Заполняем массив
    }
    function printItem($item, $items, $childrens) {
    /* Выводим пункт меню */
    echo "

  • ";
    echo "".$item["title"]."";
    $ul = false; // Выводились ли дочерние элементы?
    while (true) {
    /* Бесконечный цикл, в котором мы ищем все дочерние элементы */
    $key = array_search($item["id"], $childrens); // Ищем дочерний элемент
    if (!$key) {
    /* Дочерних элементов не найдено */
    if ($ul) echo ""; // Если выводились дочерние элементы, то закрываем список
    break; // Выходим из цикла
    }
    unset($childrens[$key]); // Удаляем найденный элемент (чтобы он не выводился ещё раз)
    if (!$ul) {
    echo "
      "; // Начинаем внутренний список, если дочерних элементов ещё не было
      $ul = true; // Устанавливаем флаг
      }
      echo printItem($items[$key], $items, $childrens); // Рекурсивно выводим все дочерние элементы
      }
      echo "";
      }
      ?>

      Этот код полностью рабочий, однако, Вы должны понимать, что так никто не пишет (в частности, вывод через echo HTML-тегов ). И Ваша задача взять алгоритм из этого кода, но не сам код. А дальше этот алгоритм подключить к своему движку. Я постарался тщательно прокомментировать код вывода многоуровневого меню на PHP и MySQL , но, безусловно, он не самый прозрачный и требует уже неплохих начальных знаний. Если Вы ещё плохо знаете PHP и MySQL , то сначала настоятельно рекомендую пройти этот



  • Понравилась статья? Поделитесь ей