Меню для сайта

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

Как сделать меню сайта

Виды меню сайта могут быть  разные — горизонтальный вид и вертикальный. Горизонтальное меню для сайта html css  в большинстве случаев используется в виде кнопок рубрик (страниц) в верхней панели сайта (если она есть) или в верхней части страниц. А вертикальное меню для сайта удобно применять для боковой панели, и для мобильной версии ресурса. Настраивайте опции по своему усмотрению, здесь у вас полная свобода выбора!

Заходим в административную панель, ищем раздел «ВНЕШНИЙ ВИД», пункт «МЕНЮ».

меню сайта

 Нажимаем «СОЗДАТЬ MAIN MENU»,  и далее настраиваем поочередно все виды имеющихся в шаблоне мест размещения  (главное, подвала и т.д.). Главное меню в большинстве шаблонов тем  — горизонтальное меню для сайта, а в подвале оно может быть в разных вариантах.

Слева вы видите элементы, которые можно добавлять в меню:

  • страницы;
  • записи;
  • рубрики.

Справа – структура:

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

В главном меню отображается структура сайта, его основные разделы в виде рубрик или страниц, а в нижнем дополнительные опции, в том числе созданные нами страницы «О САЙТЕ», «КОНТАКТЫ», «ПОЛИТИКА КОНФИДЕНЦИАЛЬНОСТИ», «ПОЛЬЗОВАТЕЛЬСКОЕ СОГЛАШЕНИЕ»

Нажмите «СОЗДАТЬ НОВОЕ МЕНЮ» (1),  в появившемся поле впишите название (2) и далее кнопку «СОЗДАТЬ МЕНЮ» (3). Добавьте элементы, которые вам подходят(4). У меня  это рубрики.

главное меню сайта

Если вы добавляете в качестве разделов меню «СТРАНЦЫ» через виджеты, например боковое меню для сайта, то автоматически встанут все существующие у вас страницы, а это не всегда целесообразно. Чтобы избежать подобного действия, и создать красивое меню для сайта необходимо в поле «ИСКЛЮЧИТЬ СТРАНИЦЫ», прописать ID тех страниц, которые не должны отображаться в меню(2). Не забудьте прописать название меню (1).

страница в меню сайтаа

Сохраняйте изменения(3), все готово.

Как определить  ID страницы сайта

Определить ID страниц, которые вы хотите исключить, можно двумя способами:

  • в строке браузера, ID=xxx:
  • или внизу страницы, всплывающая строка ID=post=99:айди страницы сайта

Как отредактировать меню?

Если вам надо отредактировать какой-то пункт меню:

  • выберете меню для изменения (1), нажмите кнопку «ВЫБРАТЬ»(2);
  • выберете «УДАЛИТЬ» или «ДОБАВИТЬ НОВОЕ»(3);
  • нажмите «СОХРАНИТЬ МЕНЮ»(4).

верхнее меню

И так, наш внешний вид сайта почти готов, осталось сделать еще несколько штрихов, о которых мало кто говорит:

  • настроить значок авторского права;
  • убрать в футере прописанное шаблоном название темы.

Мобильное меню для сайта выглядит как ниспадающее вертикальное меню и формируется автоматически, если вы работаете в WP. То есть отдельного редактирования или корректировки не требуется.

Как установить символ копирайта на сайт

В некоторых шаблонах тем, данный символ уже предусмотрен, но не во всех или формат может не устраивать:

значок копирайта

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

Предлагаю на выбор 2 варианта кода:

&copy; <?php echo date(‘Y’); ?> Мой сайт

Результат: © 2022 Мой сайт

 

&copy; 2000-<?php echo date(‘Y’); ?> Мой сайт

 

Результат: © 2000-2022 Мой сайт

Чтобы расположение записи вас полностью устраивало, можно поэкспериментировать с расположением  PHP-скрипта.

Если в теме есть значок авторского права, но вы не можете найти его код, перейдите на страницу сайта, выделите нужный фрагмент текста и правой кнопкой мышки вызовете контекстное меню, выберете пункт «ИССЛЕДОВАТЬ ЭЛЕМЕНТ». Так как вы обозначили какой именно фрагмент  вас именно интересует, то и высветится соответствующая часть кода:

код знака копирайта

 Запомните его, или скопируйте.

Зайдите в раздел «ВНЕШНИЙ ВИД», пункт «РЕДАКТОР ТЕМ», и поищите скопированный код в разделе footer-php.  Можете отредактировать его, или вставить новый из выше предложенных:

вставка кода

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

Как убрать в футере название шаблона темы

Для начала определим часть кода, которая соответствует названию темы. Как мы это уже делали, правой кнопкой мыши «ПРОВЕРИТЬ ИСХОДНЫЙ КОД» или сочетанием клавиш «ctrl+shift+I».

проверить код

у вас откроется два окна, в одной части будет отображаться страница сайта, а во второй, соответствующий ей код.

Ищем, какой код соответствует интересующей нас записи. Надо нажать вкладку «ЭЛЕМЕНТЫ» и выбрать «footer#page». Когда выделяешь код, на странице подсвечивается соответствующая ему область (или наоборот):

подсветка кода

 Если код полностью не открывается, нажмите «…» :

рекрусивно развернуть

и выберете «рекрусивно развернуть»:

рекрусивно развернуть

Дальше заходим в административную панель, ищем раздел «ВНЕШНИЙ ВИД», пункт «РЕДАКТОР ТЕМ». В появившемся окне, справа ищем раздел footer-php,  а в нем, нужный нам код:

редактор тем

Выделяем его (начало кода <, конец кода </), удаляем его:

вставка кода

 Обновите страницу и проверьте результат.

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