Додаємо адаптивне мега-меню на WordPress для сайтів із великою кількістю контенту

Якщо у вас на сайті розміщено великий обсяг контенту, до якого ви хочете відкрити доступ до головного навігаційного меню, то відвідувачам може бути досить складно знайти те, що їм потрібно. Один із способів виправити цю проблему – це розмістити візуальні рішення: іконки та графіки. Але річ у тому, що багато тем не пропонують подібних можливостей.

Дивіться також:

• WordPress плагіни для організації меню
• Як настроїти свої стилі для меню в WordPress
• Як зробити просте адаптивне меню для WordPress сайту
• Інтерактивне меню для вашого ресторану за допомогою безкоштовного WordPress плагіна
• Створюємо меню в WordPress за допомогою плагінів

Для цього можна задіяти так зване «Мега-меню», в якому містяться посилання на різні сторінки вашого сайту. Наприклад, якщо ваш сайт присвячений електронній комерції і містить багато категорій, то мега-меню вам знадобиться. Для прикладу давайте поглянемо на один із найпопулярніших сайтів - Amazon:

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

Плагін Suppamenu

У сьогоднішньому огляді ми розглянемо плагін Suppamenu, доступний на Codecanyon $16. Він допоможе вам створити мега-меню.

Опис | Демо | Купити за $16

Створення меню

Після завантаження та активації плагіна можна починати створювати меню, як ви зазвичай це робите. Але ви побачите і деякі додаткові параметри, як, наприклад, вибір шаблонів для різних стилів оформлення створюваного меню.

У меню ви побачите додаткові параметри додані плагіном. Ви можете вибрати тип меню, яке хочете створити: Drop down, Mega Links, Recent Posts, Mega Posts. Також можна вибрати меню як форму пошуку, соцмережі або кошика WooCommerce.

Кожна додана вами меню посилання має деякі параметри — зробіть посилання видимим для зареєстрованих користувачів, використовуйте для цього тільки іконки, які ви можете завантажити або вибрати:

Виберіть привабливу іконку для кожного посилання у вашому меню:

Подивіться, як це все виглядає на сайті:

Змініть розмір вікна, і ви побачите, що меню є адаптивним:

Налаштування параметрів

Цей плагін додає власне меню, яке можна настроїти так, як вам потрібно.

В розділі "Налаштування» можна настроїти параметри jQuery, адаптивні параметри, завантажити логотип тощо.

«Стилі меню» дозволяють створити власні колірні схеми, додати межі, округлити кути, вибрати шрифт, та багато іншого:

Вам також доступні параметри для адаптивного стилю, стилю іконок та розділ для будь-якого користувача CSS.

Висновок

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

Джерело: wplift.com

Олексій Шевченко

редактор wpcafe

Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, що спеціалізується на створенні сайтів WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/