меню php для сайта
Как сделать меню для сайта на PHP
Этот код особенно будет полезен для динамичных сайтов, которые имеют самописные движки. Я предложу два варианта кода, которые имеют незначительные отличия (в чем различие будет пояснено после).
Для начала приведу примерную структуру сайта, для которого подойдет это меню. Структура сайта должна иметь следующий вид (классический вид):
Сайт может содержать у разделов еще и подразделы:
Такая структура также будет работать для нашего меню лишь с небольшими отличиями.
Я предлагаю создать отдельный файл для меню на php. Например, menu.php было бы отличным названием для такого файлика. Для реализации меню также представлен стиль меню в CSS, чтобы сразу сделать его более менее красивым. Естественно этот стиль дается только для ознакомления, поскольку дизайны у сайтов очень разные.
Код для стиля меню в CSS:
Теперь, давайте рассмотрим первый вариант реализации меню на PHP, который является немного упрощенным.
Первый вариант кода меню на PHP
Порядок следования в массиве будет сохранятся и при выводе меню на сайте. То есть массив надо заполнять в порядке, в котором нужно выводить меню.
Примечание:
В случае, если 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’ ;
Второй вариант кода является модифицированным вариантом первого и предусматривает возможность подсвечивания меню даже в статьях, которые находятся в разделах.
Второй вариант кода меню на PHP
Этот код легко можно модифицировать и дальше. Например, если у разделов есть подразделы, которые желательно как-то выделять.
Создание меню для сайта на php
Если вас интересует ответ на вопрос как создать меню сайта, то вы пришли по верному адресу.
Мы рассмотрим создание динамического меню на php, написанное специально для чайников в программировании, а также для тех, кто еще в танке.
В конце этого урока будет ссылка на скачивание архива с подробными пошаговыми инструкциями и готовым шаблоном сайта на php, и скрипт меню 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.
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 для главной страницы, то в браузере, набрав адрес сайта мы не увидим сам сайт, а всего лишь структуру директории (перечень папок).
6. Как просмотреть сайт на php?
Но и не проблема. Нам нужен собственный, т.е. локальный сервер на компьютере. Для этого установим денвер и результат своей работы будем смотреть в браузере, не выходя в интернет.
Вот теперь порядок. Набрала адрес сайта и увидела все только что созданное в нормальном виде с дизайном.
Теперь возьмемся за php меню сайта.
1. Откроем файл menu.html и превратим раздел1, 2 и 3 в ссылки по сайту. Ссылки в php создаются по-разному.
Мне эта процедура создания ссылок безумно нравится в Macromedia Dreamweaver. Успевай жать ОК и пить кофе.
2. Как сделать ссылку в меню неактивной, если посетитель находится на данной странице.
Посетителю будет удобнее ориентироваться по сайту зная, на какой именно страинице он находится.
Если вы выполнили все шаги строго по пунктам, то видите, что у нас все ссылки в меню активны постоянно. Как это исправить?
Для начала вспомним определение что такое Условные операторы
– это когда какое-то действие выполняется или не выполняется в зависимости от условий.
Выполним следующие действия:
Для этого на всех страницах разместим такие блоки кода:
Как видно для каждой страницы свой код.
Итак, наши практические шаги по созданию php меню будут следующие:
1) Открываем файл index.php
до места вставки кода, выводящего само меню сайта
2) Открываем файл menu.html и вставляем код с условием вместо простой html ссылки на главную страницу.
Смотрим в браузере и любуемся! Если зайдем на главную страницу, то ссылка перестала быть активной!
3) Повторяем пункт 1 и 2 со страницами 1.php, 2.php, 3.php
Повторение 1:
1) Открываем файл 1.php и вставляем до кода, выводящего меню блок с заданной переменной
2) Открываем файл menu.html и вставляем код с условием вместо простой ссылки Раздел 1, внеся следующие изменения:
Чудо повторилось! Теперь, если мы находимся на странице Раздел 1, ссылка в меню не активна.
Повторенье 2
1) Открываем файл 2.php и вставляем код.
2) Снова откроем файл menu.html и вставляем код с условием
теперь вместо ссылки Раздел 2, внеся следующие изменения:
Повторенье 3
1) Открываем файл 3.php и задаем переменную.
2) В файл menu.html вставляем код с условием вместо ссылки Раздел 3, изменения такие:
Итог: мы вместо ссылок в меню такого вида
получили динамические ссылки php в меню навигации по сайту.
Этот урок о php был написан по многочисленным просьбам посетителей сайта и является практическим пособием по изучению создания динамического меню для сайта на php.
Следующая шпрагалка вебмастера расскажет о том, как сделать на php уникальные заголовки, описания и ключевики для каждой страницы.
Вы можете скачать архив со всеми файлами шаблона сайта и меню php. Новичкам в программировании рекомендуется.
Если же вы готовы к серьезному изучению php, то лучше видео курса от Попова найти сложно. У него огромный опыт и хороший слог.
Многоуровневое меню на PHP и MySQL
В этой статье я покажу, как можно создавать многоуровневое меню на PHP и MySQL. Безусловно, вариантов его создания можно придумать много, но, судя по количеству Ваших вопросов на эту тему, Вам нужен пример. И его я приведу в этой статье. Сразу отмечу, что данная статья имеет смысл только для тех, кто знает PHP и умеет работать с MySQL. Всем остальным сначала надо пройти этот курс, либо прочитать какие-нибудь книги по PHP и MySQL.
Для начала создадим таблицу в базе данных со следующими полями:
С таблицей разобрались, теперь пришло время PHP-кода. Полный PHP-код приведён ниже:
Этот код полностью рабочий, однако, Вы должны понимать, что так никто не пишет (в частности, вывод через echo HTML-тегов). И Ваша задача взять алгоритм из этого кода, но не сам код. А дальше этот алгоритм подключить к своему движку. Я постарался тщательно прокомментировать код вывода многоуровневого меню на PHP и MySQL, но, безусловно, он не самый прозрачный и требует уже неплохих начальных знаний. Если Вы ещё плохо знаете PHP и MySQL, то сначала настоятельно рекомендую пройти этот курс. После прохождения данного курса Вы сможете самостоятельно писать подобные скрипты и даже намного сложнее.
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
Комментарии ( 3 ):
Спасибо за статью. Сейчас делаю новый сайт и там буду использовать этот вид меню.
Присоединяюсь к благодарностям. Миша, а как бы лучше управлять очередностью пунктов меню? Например, в Друпале у каждого элемента меню есть «вес», чем он меньше – тем ссылка выше (раньше). А в панели управления они просто перетягиваются. Ну и «Сохранить» – запись в базу данных – вот здесь я что-то не соображу никак. Если решишься сделать такой урок, будет просто здорово!
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.
Copyright © 2010-2021 Русаков Михаил Юрьевич. Все права защищены.
Вывод многоуровневого меню с неограниченным уровнем вложенности
Дата публикации: 2013-03-08
От автора: при создании сайтов практически всегда необходимо выводить меню, то есть определенный блок с навигацией либо по страницам, либо по категориям веб-приложения. И очень часто данное меню необходимо отобразить в виде многоуровневого дерева. И хорошо, если предусматривается только второй уровень вложенности. А если третий? Или, вообще, неограниченный уровень вложенности? Как быть в этом случае? Поэтому в данном уроке мы с Вами научимся выводить на экран многоуровневое меню с неограниченным уровнем вложенности.
1. Создание базы данных.
Первым делом, как всегда, необходимо определиться со структурой базы данных. Так как чтобы выводить меню, необходимо, где то хранить его данные. Итак, давайте создадим базу данных, с названием data_car. Мы с Вами будем выводить категории для автомобильного сайта, поэтому и имя базы данных я выбрал близкое к этой тематике.
Итак, вот такая структура таблицы (таблицу назовем categories) нам понадобится для вывода, и хранения данных многоуровневого меню:
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
Теперь описание полей таблицы:
id – идентификатор таблицы (как обычно идентификаторы AUTO_INCREMENT и PRIMARY KEY)
title – заголовок категорий
parent_id – идентификатор родительской категории. По умолчанию и если категория родительская, значит значение данного поля 0, для определенной записи. Если же категория дочерняя, то в данном поле указываем идентификатор категории родителя (то есть поля id).
Теперь давайте наполним базу данных контентом, вставим в таблицу несколько родительских, категорий и несколько уровней дочерних, думаю три-четыре уровня вложенности, будет вполне достаточно.
Теперь, когда база данных создана, начнем создавать скрипт.
2. Основные настройки и подключение к базу данных.
Итак, давайте определимся с файловой структурой будущего скрипта. В данном уроке мы с Вами только лишь выведем блок с многоуровневым меню, поэтому нам понадобится, вот такой набор файлов и папок:
functions
— functions.php
config.php
index.php
Смотрите папка functions, содержит в себе один файл – functions.php, в котором будут описаны все функции необходимые для нормальной работы скрипта. Далее в файле config.php мы опишем все основные настройки и конечно index.php – основная точка входа.
Хочу сразу сказать, что все файлы, которые мы будем создавать, необходимо сохранять в кодировке UTF-8.
Итак, давайте посмотрим, какие основные настройки нам потребуются, вот код файла config.php:
Как Вы видите, нам потребуются только лишь настройки для подключения к базе данных. Вы, конечно же, можете добавить в данный файл, дополнительные данные, которые необходимы для работы Вашего веб-приложения.
Далее давайте создадим новый файл functions.php (сохраним его в папку functions) и создадим в нем первую функцию, которая будет выполнять подключение к базе данных:
Как Вы видите, очень простая функция, которая принимает четыре параметра: адрес сервера, базы данных, имя пользователя, пароль и название базы данных. Вначале выполняем соединение с сервером базы данных, используя функцию mysql_connect($host,$user,$pass), затем выбираем базу данных для работы — mysql_select_db($database,$db) и в конце определяем кодировку для работы с базой данных.
Теперь давайте создадим файл index.php и добавим в него первые строки кода:
Итак, первым делом, отправляем заголовок с кодировкой – функция header(«Content-Type:text/html;charset=utf8″). Затем подключаем два ранее созданных файла: файл конфигураций config.php и файл functions.php. И наконец, вызываем функцию db(), для подключения к серверу базы данных. Теперь давайте проверим в браузере, что у нас получилось. Если на экране, на данном этапе ничего не вывелось, то есть, нет сообщений об ошибках, значит мы на верном пути.
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
3. Получение массива категорий.
Для того чтобы вывести многоуровневое меню, без ограничения по уровню вложенности необходимо использовать рекурсию.
Рекурсия — это обращение функции к самой себе, другими словами вызов функции внутри кода функции самой себя.
Теперь поговорим о том, по какому принципу мы будем выводить многоуровневое меню. Данная задача (как и любая в программировании) имеет несколько решений. К примеру, одно из таких решений состоит в том, чтобы создать функцию (принимающая параметром идентификатор родительской категории), которая в своем коде формировала SQL запрос по выборке данных меню, по полю parent_id. То есть, при первом вызове функции, выбираются все записи, у которых поле parent_id = 0, затем parent_id = 1, далее parent_id = 2 и т.д. Далее в цикле вытягиваем данные из результата отработки SQL запроса и в этом же цикле вызываем данную функцию (рекурсивно саму на себя) и передаем ей идентификатор родительской категории, полученный у записи, вытащенной на данной итерации цикла. То есть на первой итерации мы с Вами вытаскиваем в переменную ассоциативный массив, в этом массиве есть ячейка с ключом parent_id, вот ее значение и передаем при вызове функции.
Данный метод, казалось бы, очень неплохой, во-первых, он отлично работает, а во-вторых, имеет очень красивую и краткую реализацию. Но есть существенный недостаток – происходит многократное обращение к базе данных и выполнение запросов по выборке данных. А это не очень хорошо.
Поэтому, мы пойдем по другому пути и решим поставленную задачу иначе. Итак, первым делом мы обратимся к базе данных и вытащим все категории, которые в ней содержатся. Далее из этих категорий сформируем массив, определенного вида. И только потом создадим функцию, которая будет обрабатывать данный массив и выводить категории на экран.
Итак, давайте в файле functions.php создадим функцию get_cat():
Теперь давайте в файле index.php вызовем данную функцию:
Как Вы видите, функция действительно правильно работает и полученный массив категорий отсортирован в нужном порядке. Теперь, осталось создать функцию, которая и будет выводить данные категории в виде многоуровневого меню.
4. Вывод категорий в виде многоуровневого дерева.
Итак, давайте откроем файл functions.php и создадим функцию view_cat(), которая и будет выводить многоуровневое меню:
Итак, данная функция принимает два параметра: первый – это собственно массив, который необходимо обработать, и второй идентификатор родительской категории, то есть той категории, данные которой, мы будем отображать. Замете, что если не передать второй параметр, то по умолчанию он равен нулю, то есть вначале отображаем родительскую категорию.
Так как данная функция будет рекурсивно вызываться, то первым делом необходимо описать условие выхода из рекурсии, что мы с Вами и делаем. А именно, проверяем, существует ли ячейка массива с ключом ($arr[$parent_id]) — идентификатором родительской категории – который передается параметром при вызове функции.
Создаем динамически формируемое меню
Здравствуйте, уважаемый посетитель!
Ранее, при создании динамического сайта с помощью PHP мы получили отдельные блоки, которые в дальнейшем стали использоваться при формировании HTML-страниц. В результате чего, мы получили динамический сайт, что позволило существенно сократить HTML-код и значительно упростить его обновления.
На этапе создания динамического сайта вопрос динамически формируемых меню мной был сознательно отложен, так как для его оптимального решения требовалось использование такого инструмента, как база данных. И поэтому, после того, как мы в предыдущих статьях подробно рассмотрели основные моменты работы с БД MySQL, то теперь несложно будет это сделать.
Следует отметить, что после выполнения этих преобразований, кроме сокращения HTML-кода мы получим еще очень серьезное преимущество. Оно будет заключаться в том, что в дальнейшем, при внесении в элементы навигации каких-либо изменений не будет требоваться корректировка всех страниц сайта. В этом случае будет достаточно лишь вносить небольшие изменения в соответствующую таблицу базу данных. Что намного проще и удобней.
Создаем функцию вывода всех строк заданной таблицы
Для того, чтобы составить функцию вывода всех записей из таблицы MySQL, воспользуемся ранее рассмотренным примером вывода набора строк, который приводился в статье Выводим данные из БД MySQL в PHP.
По существу, отличие между этими вариантами будет заключаться лишь только в запросе SQL. Теперь, вместо заданных условий выборки строк («SELECT * FROM `url` WHERE `url`=’poluchity-skidku’ OR `url`=’statistika-ugonov’ OR `url`=’kontakti’ ORDER BY `id` DESC»), в новом запросе каких-либо условий указываться не будет, в связи с чем он примет более упрощенный вид: «SELECT * FROM `url`».
//—-Функция вывода всех строк таблицы MySQL————-
function getAll ($table) <
Рис.1 Функция вывода всех строк таблицы MySQL
Здесь можно лишь добавить, что для того, чтобы данная функция была универсальна и могла бы использоваться для различных таблиц, вместо конкретного имени таблицы «url» в качестве параметра функции включена переменная «$table». Эта же переменная используется и в запросе SQL для обозначения нужной таблицы.
Таким образом, для получения всех записей таблицы необходимо при вызове этой функции указать лишь ее наименование. Что исключает необходимость каждый раз при работе с другими таблицами составлять новые однотипные программные коды.
Формируем и подключаем файл ‘start.php’
Функцию, выполняющую выборку всех строк нужной таблицы мы получили и теперь следует сформировать и подключить ко всем страницам файл, который будет при каждом запросе обеспечивать работу сайта с базой данных MySQL.
И теперь, создадим отдельный файл под именем «start.ρhρ», и подключим в нем с помощью языковой инструкции «require_once» вышеупомянутые «connect.ρhρ» и «functions.ρhρ»», как изображено на рис.2.
Рис.2 Формирование файла «start.ρhρ»
А, затем подключив «start.ρhρ» в начале каждой HTML-страницы, мы обеспечим выполнение всех возможных операций с базой данных MySQL, необходимых при отработке запросов пользователей. А сделать совсем несложно, использовав ту же самую инструкцию, как показано ниже.
Рис.3 Подключение файла «start.ρhρ к страницам сайта»
Для нашего сайта следует добавить этот фрагмент кода во все имеющиеся на данный момент страницы, соответствующие следующим файлам: «index.ρhp», «article.ρhp», «action.ρhp», «righting.ρhp» и «contacts.ρhp».
Следует отметить, что такое решения с использованием отдельного файла «start.phρ» выгодно отличается от варианта, в котором к страницам подключались бы отдельные «connect.phρ» и «functions.phρ». А, связано это с тем, при необходимости в дальнейшем подключения других элементов не потребует править код во всех страницах, а достаточно будет это сделать только в файле «start.phρ».
После того, как мы создали соответствующую функцию и решили вопрос с подключением ее на всех страницах сайта, можно перейти к непосредственному формированию блоков меню и выносу их из HTML-страниц.
Формируем файлы главного меню и меню футера
Для того, чтобы создать блоки, в которых будут формироваться элементы навигации обратимся с начала к соответствующим фрагментам HTML-кода страниц сайта. Ниже показан фрагмент меню главной страницы в файле «index.ρhp».
Рис.4 Фрагмент HTML-кода главного меню в файле «index.ρhp»
Аналогично и для других страниц. Отличие будет состоять лишь только в том, что класс «activ» будет присваиваться другим тегам , соответствующим текущей страницы.
Если внимательно посмотреть на приведенный HTML-код меню, то можно заметить, что он включает в себя всю необходимую информацию, которая имеется в созданной ранее таблице MySQL под именем «url», а именно.
Таким образом, используя базу данных MySQL можно составить PHP-код, который будет извлекать из таблицы «url» все записи и заносить в теги соответствующие данные.
А для того, чтобы иметь возможность поочередно выполнять необходимые преобразования с тегами воспользуемся оператором цикла «for».
Ниже показан вариант PHP-кода, размещенного во вновь созданном файле «menu.php» папки «blocks», который используя содержимое таблицы «url» БД MySQL обеспечит формирование главного меню для любой страницы сайта.
//—-Формирование главного меню————-
$current_url = substr ($_SERVER[ ‘REQUEST_URI’ ], 1 );
$data_bd = getAll (‘url’);
Рис.5 Формирование главного меню в файле «menu.php»
Следует отметить, что здесь для получения текущего URL, переменной $current_url присваивается значение, полученное из элемента «$_SERVER[‘REQUEST_URI’]» суперглобального массива «$_SERVER» (поз.3). В данном случае, это будет адрес текущей страницы, например «/index.ρhp».
А, для того, чтобы получить URL без слэша «/», с помощью строковой функции substr возвращается подстрока без первого символа. В итоге, переменная $current_url будет принимать вид типа «index.ρhp», соответствующий значениям поля «file» таблицы «url».
Таким образом, мы создали файл «menu.ρhp», который будет формировать меню во всех страницах сайта. Осталось его только подключить.
А, сделать это совсем несложно, используя ту же языковую инструкцию, что использовалась и в предыдущих случаях, «require_once». Ниже, на примере файла «index.php» показан фрагмент кода, где вместо множества тегов , изображенных на рис.4, добавлена всего лишь одна инструкция PHP.
Рис.6 Подключение файла «menu.ρhp» на примере файла «index.php»
В итоге, мы выполнили все необходимые преобразования, касающиеся главного меню. То же самое следует сделать и для меню футера.
//—-Формирование меню футера————-
$data_bd = getAll (‘url’);