Як зробити меню WordPress

12

Від автора: вітаю вас, друзі. У сьогоднішній статті ми з вами поговоримо про меню WordPress. В WordPress меню можна вважати одним із найбільш вдалих рішень для даної CMS, втім, як і багато іншого. Використовувати меню WordPress — одне задоволення: дуже просто і гнучко, у нього ми можемо додати буквально яку завгодно посилання, а також можемо розмістити у будь-якій частині сайту. Отже, давайте дізнаємося, як зробити меню WordPress, а також як його налаштувати і редагувати.

Отже, управління меню здійснюється в розділі Зовнішній вигляд — Меню. Давайте перейдемо туди. Залежно від теми, вгорі ви можете знайти повідомлення про те, що тема може не підтримувати довільні меню і буде запропоновано створити меню через відповідний віджет. Таке буває рідко, оскільки зараз роботу з довільними меню підтримує практично будь-яка тема. Але давайте розглянемо і такий варіант.

Для початку нам потрібно познайомитися з двома функціями, які знадобляться для реєстрації меню в темі: register_nav_menus і wp_nav_menu. Почнемо з першої. Функція register_nav_menus дозволяє зареєструвати теми кілька меню. Це зручно, якщо ми хочемо використати на сайті більше одного меню. В якості параметра функція приймає масив, кожен з елементів якого буде описувати своє меню. Ключ елемента відповідає за назву меню, значення через опис меню. Давайте спробуємо скористатися функцією. Використовується вона у файлі functions.php вашої теми. Повторюся, потрібно використовувати функцію тільки тоді, якщо меню у вас не підтримуються і вгорі ви бачите відповідне повідомлення.

Як зробити меню WordPress

Давайте зареєструємо два меню, розмістивши наступний код в functions.php:

register_nav_menus( array(
‘header_menu’ => ‘Меню в шапці’,
‘footer_menu’ => ‘Меню в підвалі’
) );

Після збереження файлу можемо оновити сторінку меню в адмінці, повідомлення вгорі сторінки повинно пропасти. Це означає, що наша тема вже підтримує меню. Давайте створимо в якості прикладу перше меню для сайту WordPress. Назвемо його, наприклад, Меню 1.

Як зробити меню WordPress

Після створення меню ми можемо додати в нього все, що завгодно: сторінки, записи, рубрики, посилання та інше. Крім того, в налаштуваннях екрану (вкладка в правому верхньому куті) ми можемо включити додаткові можливості для меню.

Давайте додамо в меню кілька сторінок і записів. Особлива принадність налаштування меню WordPress полягає в тому, що ми можемо сортувати пункти меню або вибудовувати ієрархію простим перетягуванням цих пунктів.

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

Як зробити меню WordPress

Після збереження меню нам потрібно використовувати функцію wp_nav_menu — саме ця функція виводить меню у відповідне місце шаблону вашої теми. В якості параметрів функція приймає цілий масив з більш ніж десятьма елементами. Значення масиву дозволяє дуже гнучко налаштовувати меню. Наприклад, ось деякі з корисних параметрів:

theme_location — ідентифікатор меню, який ми використовували в якості ключа функції register_nav_menus;

container — параметр, який відповідає за контейнер меню, наприклад, div, nav або взагалі не потрібен контейнер;

menu_class — css-клас для тега ul, в якому знаходиться меню.

Давайте в шаблоні footer.php додамо висновок необхідного меню.

Як зробити меню WordPress

Як бачимо, ми виводимо footer_menu (те саме меню у підвалі) з класом nav-menu для контейнера (div, який буде обгорнуте меню). Після оновлення сайту ми повинні побачити меню у відповідній галузі сайту. Нічого складно при цьому нам робити не довелося. Залишилося лише оформити меню, додавши набір правил у файл стилів теми для меню. Як ви пам’ятаєте, у нас є спеціальний клас для контейнера — nav-menu, з яким ми можемо працювати.

Точно таким же чином ми можемо додати на сайт стільки меню, скільки вам буде потрібно. Наприклад, ви захотіли бічне меню в WordPress, але його у вас немає? Немає нічого простіше, ніж додати його. Просто знайдіть в functions.php функцію register_nav_menus і додайте туди новий елемент меню, який буде відповідати за бічне меню. Після цього використовуйте функцію wp_nav_menu в потрібному шаблоні (швидше за все це буде sidebar.php), щоб виводити нове меню в сайдбарі. При цьому тут навіть не потрібен плагін, все робиться буквально кількома рядками коду. І ви можете зробити верхнє меню або нижнє, або бокове, горизонтальне або вертикальне, або навіть випадаюче меню — все обмежено лише вашою фантазією та вмінням працювати з CSS, адже меню, в тому числі і випадає, створюється і оформляється через CSS.

На цьому ми будемо прощатися. Спробуйте додати меню в вашу тему прямо зараз. Впевнений, у вас все вийде. Ну а якщо виникнуть якісь проблеми, то для їх вирішення у нас завжди є форум, де ми допоможемо вирішити вашу проблему. Ну і якщо ви хочете вивчити більш детально не тільки питання, як зробити меню WordPress, але і створити власну тему з нуля, тоді рекомендую вам наш курс по створенню тем для WordPress.