Виділення поточної сторінки в меню, створення сайту на wordpress

Використання PHP і функцій WordPress


Статична навігація (виділення елемента з id = "current" засобами CSS):

динамічна навігація

Варіант 1: CSS на кожній сторінці

Тут використовується змінна $ current. яка завжди містить номер поточної сторінки, і унікальний id у кожної сторінки:

Визначення $ current в header.php між тегами :

is_page (); - порівнює рядок з заголовком поточної сторінки.

В CSS-файл можна помістити динамічний вміст, тому потрібно помістити CSS, що виділяє елемент списку, на сторінку в header.php між тегами :

Виділення динамічного вмісту кольором:

Варіант 2: Всі стилі в одному CSS-файлі

Визначимо поточну сторінку і виведемо її id. щоб виділити відповідний елемент списку.

На «домашньої» (home) сторінці отримаємо:

А на будь-який інший:

Меню в header.php:

Цей метод працює тільки зі сторінками, але, використовуючи умовні теги WordPress (Conditional Tags). його можна розширити, перевіряючи інші умови.

*** Можна також використовувати плагін (наприклад, плагін wp-menu. Який дозволяє додавати, оновлювати і видаляти сторінки, створювати карту сайту, підміню і т.д.). Крім того, меню виводить CSS-клас current_page_item віджета Pages sidebar (входить в дистрибутив wordpress):

Схожі статті