Соңғы блог мақаласында мен WordPress-тің соңғы нұсқасының қызықты жаңалықтары туралы жаздым - арнайы құру және басқару механизмі . Енді қарапайым пайдаланушылар үшін күрделіліктегі әртүрлі мәзірлерді жасау әлдеқайда ыңғайлы және оңай болды, олар тек беттерден немесе блог санаттарынан ғана емес, сонымен қатар кез келген URL мекенжайына сілтемелер де болуы мүмкін. Үлгідегі мәзірді көрсету үшін арнайы wp_nav_menu функциясы пайдаланылады - мен бұл туралы бүгін айтамын.

WordPress әкімшісінде мәзір бөлімі болмаса, оны functions.php файлына арнайы код қосу арқылы белсендіруге болады.

Мұнда алдымен біз жасаған мәзірдің атауы. Бұл функцияны жалпы жағдайда виджетсіз пайдалану; ол жерде олармен басқаша жұмыс істеу керек болады. Дегенмен, wp_nav_menu функциясын аргументтерсіз шығаруға болады, соның нәтижесінде әртүрлі жағдайлар «қаралады» - біріншіден, мәзір атауы бойынша сәйкестік, егер ол үшін кем дегенде бір мәзір элементі көрсетілген болса, әйтпесе бос емес мәзір. жай ғана көрсетіледі, т.б. Бірақ тағы да, мен сізге жоғарыдағы кодты жай ғана қолдануға кеңес беремін және аргументсіз функцияның не шығару керектігін түсінбеу керек. Оның синтаксисі келесідей:

Мұнда келесі параметрлер қолданылады:

$мәзір— мәзір үшін таңдалған идентификатор — ID, слаг немесе мәзір атауы.

$контейнер- UL мәзірі осы параметрді пайдалану арқылы әдепкі бойынша DIV контейнеріне «оралған».

$container_class— контейнер класын көрсетеді, әдепкі бойынша оның мәні меню-(меню слаг)-контейнер, яғни біздің жағдайда, мысалы, меню-бірінші-контейнер класы болады.

$container_id— әдепкі бойынша көрсетілмеген идентификаторды контейнерге қосуға болады.

$menu_class— UL мәзір элементі үшін класс, оның мәні мәзір болып табылады.

$menu_id— ul элементінің идентификаторы, әдепкі мәзір-(slug)

$echo— мәзірді көрсеткіңіз келмесе, бірақ функцияның мәнін қайтарғыңыз келсе, осы параметр үшін 0 мәнін пайдаланыңыз.

$fallback_cb— мәзір жоқ болса, wp_page_menu функциясы шақырылады.

$бұрын— А сілтемесінің алдында көрсетілетін мәтінді орнатады.

$link_before— сілтеме мәтінінің алдындағы сөз тіркесін көрсетеді, көрсетілмеген.

$link_after— сілтеме мәтінінен кейін көрсетіледі, сонымен қатар бос.

$тереңдік— мәзірді көрсету үшін иерархия деңгейлерінің санын орнатады, әдепкі мән 0 бүкіл мәзірді көрсетеді.

$walker- түсініксіз реттелетін «жаяу жүргінші нысаны», мүмкін озық әзірлеушілерге қажет.

$theme_location— пайдаланушы оны таңдай алуы үшін мәзір пайдаланылатын тақырып орны register_nav_menu() арқылы белсендірілуі керек. Сондай-ақ, виджеттермен жұмыс істегенде, анық емес параметрдің кейбір түрі.

wp_nav_menu функциясын пайдалану мысалдары

Кодта берілген ең қарапайым код:

DIV контейнерін мәзірден алып тастау

"")); ?>

Негізінде WordPress 3.0 мәзірін жасауда және басқаруда күрделі ештеңе жоқ. Әзірлеушілер жұмыс тәртібін айтарлықтай жеңілдетіп, осы навигация элементінің мүмкіндіктерін кеңейтті. Шешім әртүрлі үлгі тапсырмаларында жиі пайдаланылады, мысалы, мобильді және жұмыс үстелі нұсқаларын жасау кезінде. Біраз уақыттан кейін мен тақырып бойынша тағы бірнеше үзінді қосамын.

P.S. Күзетші. SEO бойынша веб-шеберлерге арналған қызықты және пайдалы блог, онда сіз SEO туралы сұрақтарыңызға жауап таба аласыз.
Aweb компаниясы Интернетте веб-сайтты жылжыту, оңтайландыру және іздеу жүйесін жылжыту саласында өзін ұзақ уақыт бойы жақсы танытты.

Бұл мақалада мен қалай жасауға болатынын көрсетемін PHP және MySQL тіліндегі көп деңгейлі мәзір. Әрине, сіз оны жасаудың көптеген нұсқаларын таба аласыз, бірақ осы тақырып бойынша сұрақтарыңыздың санына қарап, сізге мысал қажет. Және мен оны осы мақалада беремін. Бірден айта кетейін, бұл мақала тек білетіндер үшін мағыналы PHPжәне қалай жұмыс істеу керектігін біледі MySQL. Қалғандардың бәрі алдымен осыдан өтуі керек немесе кейбір кітаптарды оқуы керек PHP және MySQL.

Алдымен мәліметтер базасында келесі өрістермен кесте құрайық:

  • id- бірегей идентификатор.
  • тақырып- мәзірдегі анкерлік сілтемелер.
  • сілтеме- мәзір пункті апаратын мекенжай.
  • ата-ана_идентификаторы- ата-ана идентификаторы. Егер негізгі элемент болмаса, ол NULL болады (немесе 0 қоюға болады).

Біз үстелді реттедік, енді уақыт келді PHP коды. Толық PHP кодытөменде берілген:

$mysqli = new mysqli("localhost", "root", "", "db"); // Дерекқорға қосылу
$result_set = $mysqli->query("SELECT * FROM `мәзір`"); // Кестеден мәзірмен бірге барлық жазбаларды таңдаңыз
$элементтер = массив(); // Мәзір пункттеріне арналған массив
while (($row = $result_set->fetch_assoc()) != false) $элементтер[$жол["id"]] = $жол; // Массивті дерекқордан үлгімен толтырыңыз
$childrens = массив(); // еншілес элементтерді ата-аналарына сәйкестендіруге арналған массив
foreach ($элемент ретінде $элемент) (
if ($item["parent_id"]) $childrens[$item["id"]] = $item["parent_id"]; // Жиымды толтырыңыз
}
printItem функциясы ($элемент, $элемент, $балалар) (
/* Мәзір элементін көрсету */
жаңғырық»

  • ";
    echo "".$item["title"]."";
    $ul = жалған; // Балалар көрсетілді ме?
    ал (шын) (
    /* Біз барлық балаларды іздейтін шексіз цикл */
    $key = array_search($item["id"], $childrens); // еншілес элементті іздеу
    егер (!$кілт) (
    /* Балалар табылмады */
    егер ($ul) жаңғырық»"; // Егер еншілес элементтер көрсетілсе, тізімді жабыңыз
    үзіліс; // Циклдан шығу
    }
    unset($childrens[$key]); // Табылған элементті жою (қайта көрсетілмеуі үшін)
    егер (!$ul) (
    жаңғырық»
      "; // Егер әлі еншілес элементтер болмаса, ішкі тізімді бастаңыз
      $ul = шын; // Жалауды орнату
      }
      echo printItem($элементтер[$кілт], $элементтер, $балалар); // Барлық еншілес элементтерді рекурсивті түрде көрсетеді
      }
      жаңғырық»";
      }
      ?>

      Бұл код толығымен жұмыс істейді, бірақ сіз ешкім бұлай жазбайтынын түсінуіңіз керек (атап айтқанда, арқылы шығару жаңғырық HTML тегтері). Сіздің міндетіңіз - кодтың өзі емес, алгоритмді осы кодтан алу. Содан кейін бұл алгоритмді қозғалтқышқа қосыңыз. Мен шығыс кодын мұқият түсіндіруге тырыстым PHP және MySQL тіліндегі көп деңгейлі мәзір, бірақ, әрине, бұл ең ашық емес және өте жақсы бастапқы білімді талап етеді. Егер сіз әлі де жақсы білмесеңіз PHP және MySQL, содан кейін мен алдымен осыдан өтуді ұсынамын

      Ешбір веб-сайт навигациясыз немесе олар оны «сайт мәзірі» деп те атайды. Сонымен, сайт мәзірі ағаш түрінде бір деңгейлі немесе көп деңгейлі болуы мүмкін. Егер бір деңгейлі мәзірді іске асыруда ерекше қиындықтар болмаса, онда көп деңгейлі мәзірді жасау кезінде мұқият ойлану керек.

      Бұл тапсырмадағы ең маңызды нәрсе - біздің көп деңгейлі мәзіріміз үшін дерекқорды жобалау. Үш өрістен тұратын Санаттар кестесін құрайық id, тақырып, ата-анаҚайда:

      • ID- идентификатор
      • Тақырып- Мәзір атауы
      • Ата-ана- Әдепкі санат ата-анасы 0

      Өріс мәзірді тармақтауға жауапты Ата-анаЕгер Ата-ана = 0, онда бұл санат негізгі санат болып табылады. Ата-аналық санатқа ұрпақтарды қосу үшін тектік өрісте көрсету керек IDдұрыс ата-ана. Мысалы:

      Категориялары бар кестелер

      Кестеден көрініп тұрғандай, ата-аналық категория Көліктерекі ұрпақ бар - бұл МаздаЖәне Хондаөрісімен байланысты Ата-ана. Және категория Мотоциклдерекі ұрпақ КавасакиЖәне Харли. Сонымен қатар, Қайықтар санатының ұрпақтары жоқ. Сіз санаттарды қалай байланыстыру керектігін түсінесіз деп үміттенемін.

      Әрі қарай сөзден жаттығуға көшеміз. Санаттар кестесін құрайық.

      'санаттар БАР БОЛМАСА, КЕСТЕНІ ЖАСАУ (`id` int(10) таңбасыз NULL ЕМЕС AUTO_INCREMENT, `тақырып` varchar(255) NULL ЕМЕС, `ата-ана` int(10) таңбасыз NULL ЕМЕС, БАСТАУЫШ КҮЙСЕ (`id`)) ENGINE=MyISAM Әдепкі ТАҒАМ =utf8 AUTO_INCREMENT=20 ; -- -- `санаттар` кестесіндегі деректер қоқысы -- INSERT INTO `санаттар` (`id`, `атауы`, `ата-ана`) VALUES (1, «Автомобильдер», 0), (2, «Мотоциклдер», 0 ) , (3, «Мазда», 1), (4, «Хонда», 1), (5, «Кавасаки», 2), (6, «Харли», 2), (7, «Mazda 3», 3 ), (8, «Mazda 6», 3), (9, «Седан», 7), (10, «Хэтчбек», 7), (11, «Қайық», 0), (12, «Лифтбек» , 8), (13, «Кроссовер», 8), (14, «Ақ», 13), (15, «Қызыл», 13), (16, «Қара», 13), (17, «Жасыл» , 13), (18, "Mazda CX", 3), (19, "Mazda MX", 3);

      Жұмыс алгоритмі мыналардан тұрады:

      Дерекқорға қосылым жасаңыз

      query("АТТАРДЫ ОРНАТУ "utf8""); /* * Бұл мұны істеудің «ресми» нысанға бағытталған жолы * дегенмен $connect_error PHP 5.2.9 және 5.3.0 нұсқаларына дейін жұмыс істемеді. */ if ($mysqli->connect_error) ( die("Қосылу қатесі (" . $mysqli->connect_errno . ") " . $mysqli->connect_error); ) /* * Егер нұсқалармен үйлесімділікке сенімді болу керек болса 5.2 .9 дейін * бұл кодты қолданған дұрыс */ if (mysqli_connect_error()) ( die("Байланыс қатесі (" . mysqli_connect_errno() . ") " . mysqli_connect_error()); )

      Санаттар кестесінен мәліметтер алу функциясын жазу

      //Мәзірдің массивін дерекқордан массив функциясы ретінде алыңыз getCat($mysqli)( $sql = "SELECT * FROM `categories`"; $res = $mysqli->query($sql); //Құру массив, мұнда массивтің кілті мәзір идентификаторы $cat = array(); while($row = $res->fetch_assoc())( $cat[$row["id"]] = $row; ) қайтару $ мысық;)

      Біз осындай массив аламыз, онда массив кілті санат идентификаторы болып табылады.

      Tommy Lacroix ұсынған қатты ағаштан құрастыру функциясы

      //Tommy Lacroix массивінен ағаш құру функциясы getTree($dataset) ( $tree = array(); foreach ($id => &$түйін) ( //Ешбір тіркеме болмаса, егер ( !$node[" parent"])( $tree[$id] = &$node; )else( //Егер балалар болса, $dataset[$node["parent"]]["childs массиві арқылы қайталаңыз "][$id] = &$ түйін; ) ) қайтару $tree; )

      Біз ағаш түрінде массив аламыз

      Толық сценарий

      query("АТТАРДЫ ОРНАТУ "utf8""); /* * Бұл мұны істеудің «ресми» нысанға бағытталған жолы * дегенмен $connect_error PHP 5.2.9 және 5.3.0 нұсқаларына дейін жұмыс істемеді. */ if ($mysqli->connect_error) ( die("Қосылу қатесі (" . $mysqli->connect_errno . ") " . $mysqli->connect_error); ) /* * Егер нұсқалармен үйлесімділікке сенімді болу керек болса 5.2 .9 дейін, * бұл кодты қолданған дұрыс */ if (mysqli_connect_error()) ( die("Байланыс қатесі (" . mysqli_connect_errno() . ") " . mysqli_connect_error()); ) //Массивті алу GetCat($mysqli)($sql = "SELECT * FROM `categories`"; $res = $mysqli->query($sql); //Массив кілті болатын массив жасаңыз. мәзір идентификаторы болып табылады $cat = array(); while ($row = $res->fetch_assoc())( $cat[$row["id"]] = $row; ) return $cat; ) //Функция үшін Tommy Lacroix функциясынан массивтен ағаш құру getTree($dataset) ( $tree = array(); foreach ($id => &$түйін ретінде $dataset) ( //Егер (!$түйін[) тіркемелер болмаса "parent"])( $tree[$id] = &$node; )else( //Егер ұрпақтар бар болса, $dataset[$node["parent"]]["childs"][$ массивінен өтіңіз. id] = &$түйін; ) ) қайтару $tree; ) //Деректермен дайындалған массив алу $cat = getCat($mysqli); //Ағаш мәзірін жасау $tree = getTree($cat); //Ағаш функциясы түріндегі мәзірді көрсетуге арналған үлгі tplMenu($category)( $menu = "
    • ". $category["title"].""; if(isset($category["childs"]))( $menu .= "
        ". showCat($category["childs"]) ."
      "; ) $меню .= "
    • "; return $menu; ) /** * Үлгімізді рекурсивті түрде оқыңыз **/ function showCat($data)( $string = ""; foreach($data as $item)( $string .= tplMenu($item); ) return $string; ) //HTML белгілеуін алу $cat_menu = showCat($tree); //Эхоны көрсету "
        ".$ cat_menu."
      "; ?>

      Жұмыстың нәтижесі

      Әкімші панеліне арналған PHP + MySQL тіліндегі көп деңгейлі мәзір

      Бұл мәзірді сайтыңыздың басқару панелінде пайдаланғыңыз келсе, бірнеше функцияларды қайта жазуыңыз керек. tplMenu(), showCat().

      ".$category["title"].""; )else( $menu = " "; ) if(isset($category["childs"]))( $i = 1; for($j = 0; $j)< $i; $j++){ $str .= "→"; } $i++; $menu .= showCat($category["childs"], $str); } return $menu; } /** * Рекурсивно считываем наш шаблон **/ function showCat($data, $str){ $string = ""; $str = $str; foreach($data as $item){ $string .= tplMenu($item, $str); } return $string; } //Получаем HTML разметку $cat_menu = showCat($tree, ""); //Выводим на экран echo ""; ?>

      Жұмыстың нәтижесі

      Автомобильдер → Mazda →→ Mazda 3 →→→ Седан →→→ Хэтчбек →→ Mazda 6 →→→ Лифтбек →→→ Кроссовер →→→→ Ақ →→→ Қызыл → →→→ Қара →→→ Жасыл →→ Mazda CX →→ Mazda MX → Honda мотоциклдері → Kawasaki → Harley Boats

      Панельде жасалған теңшелетін мәзірді көрсетеді: "Көрініс > Мәзірлер".

      Қай шарлау мәзірін көрсету керек (олардың бірнешеуі болуы мүмкін) theme_location параметрінде көрсетілген.

      theme_location параметрі көрсетілмесе, дисплей мәзірі келесі ретпен таңдалады:

        "Мәзір" параметрінде берілген идентификаторға, слогқа немесе сипаттамаға сәйкес келетін мәзір және бұл мәзірде кемінде бір сілтеме (бір элемент) болса;

        әйтпесе, бірінші мәзір бос болмайды;

        немесе, "fallback_cb" параметрінде көрсетілген функциямен қайтарылған мәнді көрсетеді (әдепкі бойынша, wp_page_menu функциясы сонда көрсетілген);

      1. ештеңе сәйкес келмесе, функция ештеңе шығармайды.

      Тақырыптың мәзірлерге қолдау көрсетуі үшін мына мүмкіндікті пайдаланып қосу керек:
      add_theme_support («мәзірлер»);

      Немесе register_nav_menu() арқылы мәзір үшін орынды тіркеуге болады, содан кейін тақырып мәзірінің қолдауы автоматты түрде қосылады.

      Мәзір элементінің сүзгілерін өзгерту

      • add_filter("wp_nav_menu_args", "my_wp_nav_menu_args"); функциясы my_wp_nav_menu_args($args = "")( $args["контейнер"] = false; қайтару $args; )

        №4.1. Контейнерді тек бір дисплей мәзірінен алып тастаймыз

        "" ]); ?>

        №5 UL қаптамасын алыңыз

        Бұл мысал мәзірден ul тегін орауышын жояды:

        "%3$s" ]); ?>

        #6 Мәзірдің басына сөз қосыңыз

        Бұл мысал мәзір тізімінің басына сөзді сілтеме емес, мәзір элементі ретінде қосу жолын көрсетеді. Мәзірдің басына «Тізім» сөзін қосамыз, сонымен қатар құрылған li тегіне id атрибутын көрсетейік:

        "primary", "items_wrap" => "

        • Тізім:
        • %3$s
        " ]); ?>

        #7 Барлық мәзірлерге CSS сыныптарын қосыңыз

        Қажетті шарт орындалса, ілгекті пайдаланып, біз өзіміздің CSS сыныптарын қоса аламыз.

        Бұл жазба және мәзір элементінің тақырыбы "блог" болса, CSS сыныбын қосамыз:

        Add_filter("nav_menu_css_class", "special_nav_class", 10, 2); функция special_nav_class($classes, $item)( if(is_single() && $item->title == "Blog)"){ $classes = "special-class"; } return $classes; } !}

        №8 Мәзір құру үшін өз функцияңызды пайдалану

        Алдымен, "walker" => new Your_Walker_Function аргументін көрсетуіңіз керек.

        Your_Walker_Function - мәзірді құрастыратын біздің жаңа сынып. Дөңгелекті қайта ойлап таппау үшін оны түпнұсқадан көшіруге болады, Walker_Nav_Menu класын қараңыз. Біз сынып кодын көшіріп, қажет болған жағдайда түзетеміз.

        Мәзір элементтеріне (ul және li) мәзір тереңдігін және жұп/тақ CSS сыныптарын қосу мысалы келтірілген:

        // өз мәзір құру сыныбы: magomra_walker_nav_menu класы Walker_Nav_Menu кеңейтеді ( // ul ішкі мәзір функциясына сыныптарды қосу start_lvl(&$output, $depth) ( // тереңдікке тәуелді сыныптар $indent = ($depth > 0 ? str_repeat(" \ t", $depth) : ""); // код шегінісі $display_depth = ($depth + 1); // себебі ол бірінші ішкі мәзірді 0 деп санайды $class = array("sub-menu", ($display_depth) % 2 ? "menu-odd" : "меню-жұп"), ($display_depth >=2 ? "sub-sub-menu" : ""), "menu-depth-" . $display_depth); $class_names = implode ( " ", $сыныптар); // html құрастыру $output .= "\n" . $ шегініс. "

          " . "\n"; ) // li"s және сілтемелер функциясына негізгі/қосалқы сыныптарды қосу start_el(&$output, $item, $depth, $args) ( жаһандық $wp_query; $indent = ($depth > 0) ? str_repeat("\t", $depth) : ""); // код шегінісі // тереңдікке байланысты класстар $depth_classes = массив(($depth == 0 ? "main-menu-item" : "sub-menu- item"), ($depth >=2 ? "sub-sub-menu-item" : ""), ($depth % 2 ? "menu-item-odd" : "menu-item-juft"), "мәзір -item-depth-" . $depth); $depth_class_names = esc_attr(implode(" ", $depth_classes)); // өткен сыныптар $class = empty($item->classes) ? массив() : (массив) $ item->classes; $class_names = esc_attr(implode(" ", apply_filters("nav_menu_css_class", array_filter($class), $element))); // құрастыру html $output .= $шегініс ."
        • ) $ элементтерді қайтару; ) функциясы __nav_hasSub($item_id, $items)( foreach($items as $item)( if($item->menu_item_parent && $item->menu_item_parent == $item_id) true мәнін қайтарады; ) қайтару жалған; )

          №11 Жеке мәзір элементтеріне сынып қосу

          4.1 нұсқасынан бастап.

          Бұл үшін арнайы ілмек пайда болды: nav_menu_css_class. Енді ол арқылы сыныптарды қосуға немесе жоюға болады. Мысалы, барлық мәзір элементтеріне my__class сыныбын қосамыз:

          Add_filter("nav_menu_css_class", "my_class_to_nav_menu_қосу", 10, 2); функция add_my_class_to_nav_menu($classes, $item)( /* $class құрамында Массив( => menu-item => menu-item-type-post_type => menu-item-object-page => menu-item-284) */ $class = "менің__сыныбым"; $сыныптарды қайтару;)

          4.1 нұсқасына дейін.

          Мәзір элементінің сыныптары _wp_menu_item_classes_by_context(&$menu_items) функциясы арқылы қосылады; . Бірақ, өкінішке орай, ол өз класыңызды қосу үшін ешқандай сүзгілерді қамтамасыз етпейді. Сондықтан, уақытша шешім қабылдап, str_replace() балдағын қолданайық:

          // оны көрсетудің орнына мәзірді алыңыз $menu = wp_nav_menu(array("echo" => 0,)); // барлық элементтерге my__class класын қосыңыз $menu = str_replace("class="menu-item", "class="menu-item my__class", $menu); // echo $мәзірін көрсету;

          №12 Мәзірді бар болса ғана көрсету

          Әдепкі бойынша, мәзір болмаса, оның орнына сайт беттері көрсетіледі. Бірақ мәзірді әкімші тақтасында жасалған кезде ғана көрсету қажет болса, fallback_cb параметрін "__return_empty_string" ретінде көрсетіңіз:

          Wp_nav_menu(array("theme_location" => "негізгі мәзір", "fallback_cb" => "__қайтару_бос_жол"));

          #13 Тек мәзір ішкі тармағын көрсетіңіз

          Бірінші деңгей бар делік және бірінші деңгей элементтерінің әрқайсысының өз ішкі мәзірі бар. Меню-item-135 класы бар элемент үшін осындай ішкі мәзірді көрсету керек:

          ## Қажетті ішкі мәзірдің барлық LI мәндерін қиып алып, оларды UL блогында көрсетіңіз $menu = wp_nav_menu(array("theme_location" => "header_menu", "container" => "", "echo" => 0,) ); $regex_part = preg_quote("мәзір элементі-135"); // "gotovye-resheniya" preg_match("~". $regex_part .".*sub-menu[^>]+>(.*?) элементінің ішкі мәзірін көрсету

        ~s", $меню, $мм); if(!empty($mm)) echo "";

        Өте оңтайлы емес, бірақ жұмыс үлгісі. Кейде бұл нәтижелерді жылдам алу қажет болатын аз кіретін сайттар үшін пайдалы болуы мүмкін.

        Мәзір элементі CSS сыныптары

        Мәзір элементтеріне келесі CSS сыныптары қосылады (пайдаланушы қай бетке бөлінген):

        Барлық беттердегі барлық элементтер үшін

          .мәзір элементі- мәзірдің барлық пункттеріне;

          .мәзір-элемент-нысан-(нысан)- (объектісі) пост түрінің немесе таксономияның атауымен ауыстырылатын барлық элементтерге:
          .menu-item-object-category (санаттар үшін)
          .menu-item-object-teg (тегтер үшін)
          .menu-item-object-page (тұрақты беттер үшін)
          .мәзір-элемент-нысан-(теңшелетін)

        • .мәзір элементінің түрі-(түрі)- барлық мәзір элементтеріне, мұнда (түрі) сілтеме түрімен ауыстырылады (пост немесе таксономия). Сілтемелердің барлық түрлерін топтарға бөледі:
          .menu-item-type-post_type (тұрақты бет, реттелетін жазба түрі)
          .menu-element-type-taksonomy (санат, тег немесе пайдаланушы таксономиясы)

        Ағымдағы беттің элементтері үшін

        • .ағымдағы мәзір элементі- мәзірдегі сілтеме сіз қарап отырған беттің мекенжайына сәйкес келсе. Ағымдағы бет.

        Қаралып жатқан беттің негізгі элементтері үшін

        • .ағымдағы-мәзір-ата-ана
        • .ағым-(объект)-баба
        • .ағым-(түр)-ата-баба

        Қаралып жатқан бетке қандай да бір түрде қатысты элементтер үшін

        • .ағымдық-мәзір-ата-бабасы
        • .ағым-(объект)-баба
        • .ағым-(түр)-ата-баба

        Сайттың негізгі бетіне қатысты элементтер үшін

        • .мәзір-элемент-үй

        wp_page_menu() функциясымен үйлесімді

        • .page_element
        • .page-item-$ID
        • .ағымдағы_бет_элементі
        • .current_page_parent
        • .current_page_anagestor

        $item нысаны

        $item параметрлері

        Мысалдар жиі $item мәзір элементін пайдаланады. Бұл элементтің барлық дерлік параметрлері төменде көрсетілген:

        Өріс Сипаттама
        ID Мәзір элементінің идентификаторы
        мәзір_элементінің_ата-анасы Мәзірдің негізгі элементінің идентификаторы
        сыныптар мәзір элементі кластарының массиві
        кейінгі_күн қосылған күні
        өзгертілгеннен кейін соңғы өзгертілген күн
        post_author Осы мәзір элементін қосқан пайдаланушының идентификаторы
        тақырып мәзір элементінің тақырыбы
        url мәзір элементінің сілтемесі
        attr_title сілтеменің тақырып атрибуты
        xfn rel сілтеме атрибуты
        мақсат мақсатты сілтеме атрибуты
        ток 1-ге тең, егер бұл ағымдағы элемент болса
        ағымдағы_элемент_ата-бабасы 1, егер ағымдағы элемент кірістірілген элемент болса
        ағымдағы_элемент_ата-анасы 1, егер ағымдағы элемент негізгі элемент болса
        мәзір_тәртібі мәзірдегі сериялық нөмір
        object_id Мәзір нысанының идентификаторы. Жазбалар, шарттар және т.б.
        түрі мәзір нысанының түрі (салық, енгізу)
        объект салық атауы, хабарлама түрі: бет, санат, пост_белгі ...
        type_belge локализацияланған түр атауы: Санат, Бет
        ата-анадан кейінгі Ата-ана идентификаторы
        post_title пост тақырыбы
        пост_аты жазу таңбашасы
        Мысал $item нысаны
        WP_Post нысаны ( => 10 => 5 => 2019-02-11 13:33:39 => 2019-02-11 13:33:39 => => Жаңа => => жариялау => жабық => жабық = > => жаңа => => => 2019-02-11 23:10:19 => 2019-02-11 23:10:19 => => 0 => http://dh5.com/?p= 10 => 1 => nav_menu_item => => 0 => өңделмеген => 10 => 0 => 10 => теңшелетін => теңшелетін => Теңшелетін сілтеме => Жаңа => # => => => => Массив = > қосымша ішкі мәзір => мәзір элементі => мәзір-элемент-түрі-өзгертпелі => мәзір-элемент-объект-пайдаланушы => => => =>)

        Walker параметрін пайдалану мысалы

        Уокерде мәзірді құрайтын нысанды көрсетуге болады. Бұл объектіде алынған мәзірдің HTML кодын сипаттауға болады.

        Егер стандартты емес орналасу үшін мәзір жасау қажет болса, кейде макетті қайта жасаудан гөрі бұл нысанды қайта жасау оңайырақ.

        Walker нысанының мысалы ретінде әдепкі бойынша қолданылатын Walker_Nav_Menu() класын алайық. Онда бізді тек бір әдіс қызықтырады, start_el() . Ол әрбір элементтің HTML-ге жауапты. Әдетте, мұны ғана өзгерту жеткілікті. Ол үшін Walker_Nav_Menu класын кеңейтетін және мәзірді шақырған кезде оны Walker параметрінде көрсететін өз класын жасау керек.

        Мысал қарастырайық. start_el() әдісінің коды өзгеріссіз қабылданады. Үлгі ретінде пайдаланамыз:

        My_Walker_Nav_Menu класы Walker_Nav_Menu ( /** * Элемент шығысын бастайды. * * @3.0.0 бастап * @4.4.0 бастап (@қараңыз «nav_menu_item_args») сүзгісі қосылды. * * @see Walker::start_el() * * @param жолы $output Анықтама бойынша жіберілді.Қосымша мазмұн қосу үшін пайдаланылады.* @param WP_Post $item Мәзір элементінің деректер нысаны. * @param int $depth Мәзір элементінің тереңдігі. Толтыру үшін пайдаланылады. * @param stdClass $args Нысан wp_nav_menu() аргументтерінің. * @param int $id Ағымдағы элемент идентификаторы. */ жалпы функция start_el(&$output, $element, $depth = 0, $args = array(), $id = 0) ( if (isset) ($args->element_spacing) && "алып тастау" === $args->item_spacing) ( $t = ""; $n = ""; ) else ( $t = "\t"; $n = "\n "; ) $шегі = ($тереңдігі) ? str_repeat($t, $тереңдігі) : ""; $сыныптар = бос($item->сыныптар) ? массив() : (массив) $item->сыныптар; $сыныптар = "menu-item-" . $item->ID; $args = apply_filters("nav_menu_item_args", $args, $item, $depth); $class_names = біріктіру(" ", apply_filters("nav_menu_css_class", array_filter($) сыныптар), $item, $args, $depth)); $class_names = $class_names ? " class="" . esc_attr($class_names) . """ : ""; $id =қолдану_сүзгілері("nav_menu_item_id", "menu-item-". $item->ID, $element, $args, $depth); $id = $id ? " id="" . esc_attr($id) . """ : ""; // мәзір элементі үшін HTML кодын жасаңыз $output .= $indent . " "; $atts = array(); $atts["title"] = ! empty($item->attr_title) ? $item->attr_title: ""; $atts["target"] = ! empty($item- >target) ? $item->target: ""; $atts["rel"] = ! empty($item->xfn) ? $item->xfn: ""; $atts["href"] = ! бос ($item->url) ? $item->url: ""; $atts = apply_filters("nav_menu_link_attributes", $atts, $item, $args, $depth); $attributes = ""; foreach ($atts ретінде $attr => $мән) (егер (! бос($мән)) ( $мән = ("href" === $attr) ? esc_url($мән) : esc_attr($мән); $атрибуттар .= " " . $attr . "="" . $мән. """; ) ) $title = apply_filters("the_title", $item->title, $item->ID); $title = apply_filters("nav_menu_item_title" , $ title, $ element, $args, $depth); $item_output = $args->бұрын; $item_output .= " "; $item_output .= $args->link_before . $title . $args->link_after; $item_output .= ""; $item_output .= $args->кейін; $output .= apply_filters("walker_nav_menu_start_el", $item_output, $item, $depth, $args); ) )

        Енді мәзірді шақырған кезде жаяу жүргіншіні көрсетіңіз:

        Wp_nav_menu(array("theme_location" => "head_menu", "walker" => new My_Walker_Nav_Menu(),));

        Дайын, енді әрбір мәзір элементі бізге қажет HTML схемасына сәйкес құрастырылады.

        Сүзгілерді қолданатын BEM мәзірі

        Макет BEM әдістемесіне сәйкес жасалады:

        Файл index.phpнемесе басқа мәзірді көрсету үшін

        "тақырып-мәзір", ]);

        Файл functions.php

        "Жоғарғы аймақ", "колонтитул-мәзір" => "Төменгі аймақ", ]); ))) // Негізгі мәзір параметрлерін өзгертеді add_filter("wp_nav_menu_args", "filter_wp_menu_args"); функция filter_wp_menu_args($args) ( if ($args["тақырып_орны"] === "тақырып-мәзір") ( $args["контейнер"] = false; $args["items_wrap"] = ""; $args[ "menu_class"] = "menu menu--main menu-horizontal"; ) return $args; ) // li тегінің id төлсипатын өзгерту add_filter("nav_menu_item_id", "filter_menu_item_css_id", 10, 4); функция filter_menu_item_css_id($menu_id, $item, $args, $depth) ( return $args->theme_location === "header-menu" ? "" : $menu_id; ) // li тегін add_filter( класс төлсипатын өзгерту "nav_menu_css_class ", "filter_nav_menu_css_classes", 10, 4); функциясы filter_nav_menu_css_classes($classes, $element, $args, $depth) ( if ($args->theme_location === "тақырып-мәзір") ( $classes = [ "мәзір түйіні", "мәзір түйіні--main_lvl_ " . ($depth + 1) ]; if ($item->current) ( $classes = "menu-node--active"; ) ) return $class; ) // Кірістірілген ul add_filter(" класын өзгертеді" nav_menu_submenu_css_class" , "filter_nav_menu_submenu_css_class", 10, 3); функциясы filter_nav_menu_submenu_css_class($classes, $args, $depth) ( if ($args->theme_location === "тақырып-мәзір") ( $classes = [ "мәзір", "мәзір--ашылмалы", "мәзір--тік" " ]; ) return $class; ) // Сілтемелерге сыныптарды қосу add_filter("nav_menu_link_attributes", "filter_nav_menu_link_attributes", 10, 4); функция filter_nav_menu_link_attributes($atts, $element, $args, $depth) ( if ($args->theme_location === "тақырып-мәзір") ( $atts["сынып"] = "мәзір-сілтеме"; егер ($ item->current) ( $atts["class"] .= " menu-link--active"; ) ) қайтару $atts; )

        Осы қызметте жалпыға қолжетімді Facebook парақшасы үшін өте арзан ұнатуларға тапсырыс беріңіз және қолайлы бағаны ғана емес, сонымен қатар ресурсты сатып алудың жеке шарттарын таңдау мүмкіндігін алыңыз. Мысалы, сіз қабылдау жылдамдығын және қол қойылған беттердің сапасын таңдай аласыз. Сонымен қатар, қызмет өз клиенттеріне кепілдік береді.

        Код wp Nav мәзірі: wp-includes/nav-menu-template.php WP 5.2.2

        "", "контейнер" => "div", "container_class" => "", "container_id" => "", "menu_class" => "мәзір", "menu_id" => "", "echo" => true, "fallback_cb" => "wp_page_menu", "бұрын" => "", "кейін" => "", "бұрынғы сілтеме" => "", "link_кейін" => "", "items_wrap" => "" , "item_spacing" => "сақтау", "тереңдік" => 0, "walker" => "", "theme_location" => "",); $args = wp_parse_args($args, $әдепкі); егер (! in_array($args["item_spacing"], array("сақтау", "тастау"), шын)) ( // жарамсыз мән, әдепкіге оралу. $args["item_spacing"] = $defaults[" item_spacing"]; ) /** * Шарлау мәзірін көрсету үшін пайдаланылатын аргументтерді сүзеді. * * @3.0.0 нұсқасынан * * @see wp_nav_menu() * * @param массиві $args wp_nav_menu() аргументтерінің массиві. */ $args = apply_filters("wp_nav_menu_args", $args); $args = (нысан) $args; /** * wp_nav_menu() шығысын қысқа тұйықталу немесе сүзгілеу. * * Сүзгіге нөл емес мәнді қайтару * wp_nav_menu() қысқа тұйықталуын тудырады, егер $args->echo ақиқат болса, сол мәнді қайталайды, * әйтпесе сол мәнді қайтарады. * * @sice 3.9.0 * * @see wp_nav_menu() * * @param string|null $output Қысқа тұйықталу үшін Nav мәзірінің шығысы. Әдепкі нөл. * @param stdClass $args wp_nav_menu() аргументтері бар нысан. */ $nav_menu = application_filters("pre_wp_nav_menu", null, $args); if (null !== $nav_menu) ( if ($args->echo) ( echo $nav_menu; return; ) return $nav_menu; ) // Сұралған мәзір негізінде шарлау мәзірін алыңыз $menu = wp_get_nav_menu_object($args- >мәзір); // theme_location негізінде шарлау мәзірін алыңыз, егер (! $menu && $args->theme_location && ($locations = get_nav_menu_locations()) && isset($locations[ $args->theme_location ])) ( $menu = wp_get_nav_menu_object $locations[ $args->theme_location ]); ) // егер (! $menu && ! $args->theme_location) ( $menus = wp_get_nav_menus() әлі мәзірді таба алмасақ, элементтері бар бірінші мәзірді алыңыз. ; foreach ($менюлар $menu_mumki) ( if ($menu_items = wp_get_nav_menu_items($menu_mumbe->term_id, array("update_post_term_cache" => false))) ( $menu = $menu_mumbe; үзіліс; ) ) ty (егер (e) ) ) $args->menu)) ( $args->menu = $menu; ) // Егер мәзір бар болса, оның элементтерін алыңыз. if ($menu && ! is_wp_error($menu) && ! isset($menu_items)) ( $ menu_items = wp_get_nav_menu_items($menu->term_id, array("update_post_term_cache" => false)); ) /* * Ешқандай мәзір табылмаса: * - Қайта оралыңыз (егер көрсетілген болса) немесе кепіл. * * Мәзір жоқ болса элементтер табылды: * - Артқа оралу, бірақ тақырып орны көрсетілмеген жағдайда ғана. * - Әйтпесе кепіл. */ егер ((! $menu || is_wp_error($menu) || (isset($menu_items) && empty($menu_items) && ! $args->theme_location)) && isset($args->fallback_cb) && $args ->fallback_cb && is_callable($args->fallback_cb)) ( қайтару call_user_func($args->fallback_cb, (массив) $args); ) егер (! $menu || is_wp_error($menu)) ( қайтару жалған; ) $ nav_menu = $items = ""; $show_container = жалған; if ($args->container) ( /** * Мәзір контейнерлері ретінде пайдалануға жарамды HTML тегтерінің тізімін сүзеді. * * @3.0.0 нұсқасынан бастап * * @param массиві $tegs Мәзір ретінде пайдалануға жарамды HTML тегтері контейнерлер. * Әдепкі - "div" және "nav" бар жиым. */ $allowed_tags = apply_filters("wp_nav_menu_container_allowedtags", array("div", "nav")); if (is_string($args->container) && in_array ($args->container, $allowed_tags)) ( $show_container = true; $class = $args->container_class ? " class="" . esc_attr($args->container_class) . """ : " class="menu -" . $menu->slug . "-container""; $id = $args->container_id ? " id="" . esc_attr($args->container_id) . """ : ""; $nav_menu .= "<" . $args->контейнер. $id . $сынып. ">"; ) ) // $menu_item айнымалы мәндерін орнату _wp_menu_item_classes_by_context($menu_items); $sorted_menu_items = $menu_items_with_children = массив(); foreach ((массив) $menu_items ретінде $menu_item) ( $sorted_menu_items[ $menu_item->menu_order ] = $menu_item; if ($menu_item->menu_item_parent) ( $menu_items_with_children[ $menu_item_item =__) parent; Қажет болса, мәзір элементі-балалары бар класын қосыңыз if ($menu_items_with_children) ( foreach ($sorted_menu_items &$menu_item ретінде) ( if (isset($menu_items_with_children[ $menu_item->ID ])) ( $cmenu_item =>- "menu-item-has-children"; ) ) ) unset($menu_items, $menu_item); /** * HTML мәзірін жасамас бұрын мәзір элементі нысандарының сұрыпталған тізімін сүзеді. * * @3.1.0 нұсқасынан бастап * * @param массиві $sorted_menu_items Әрбір мәзір элементінің мәзір реті бойынша сұрыпталған мәзір элементтері. * @param stdClass $args wp_nav_menu() аргументтері бар нысан. */ $sorted_menu_items = apply_filters("wp_nav_menu_objects", $sorted_menu_items, $args); $элементтер .= walk_nav_menu_tree($sorted_menu_items, $args->тереңдік, $args); unset($sorted_menu_items); // Төлсипаттар егер (! empty($args->menu_id)) ( $wrap_id = $args->menu_id; ) else ( $wrap_id = "menu-" . $menu->slug; while (in_array($wrap_id, $) menu_id_slugs)) ( егер (preg_match("#-(\d+)$#", $wrap_id, $матчтар)) ( $wrap_id = preg_replace("#-(\d+)$#", "-" . ++$ сәйкестіктер, $wrap_id); ) else ( $wrap_id = $wrap_id . "-1"; ) ) ) $menu_id_slugs = $wrap_id; $wrap_class = $args->menu_class? $args->menu_class: ""; /** * Шарлау мәзірлері үшін HTML тізімінің мазмұнын сүзеді. * * @sice 3.0.0 * * @see wp_nav_menu() * * @param жолы $items Мәзір элементтеріне арналған HTML тізімінің мазмұны. * @param stdClass $args wp_nav_menu() аргументтері бар нысан. */ $элементтер =қолдану_сүзгілері("wp_nav_menu_items", $элементтер, $args); /** * Нақты шарлау мәзірі үшін HTML тізімінің мазмұнын сүзеді. * * @sice 3.0.0 * * @see wp_nav_menu() * * @param жолы $items Мәзір элементтеріне арналған HTML тізімінің мазмұны. * @param stdClass $args wp_nav_menu() аргументтері бар нысан. */ $элементтер =қолдану_сүзгілері("wp_nav_menu_($menu->slug)_items", $items, $args); // Егер осы нүктеде элементтер болмаса, ешқандай түзетуді басып шығармаңыз. if (empty($items)) ( return false; ) $nav_menu .= sprintf($args->items_wrap, esc_attr($wrap_id), esc_attr( $wrap_class), $items); unset($items); if ($show_container) ($nav_menu .= "контейнер. ">"; ) /** * Шарлау мәзірлері үшін HTML мазмұнын сүзеді. * * @3.0.0 нұсқасынан * * @see wp_nav_menu() * * @param жолы $nav_menu Шарлау мәзіріне арналған HTML мазмұны. * @param stdClass $args wp_nav_menu() аргументтері бар нысан. */ $nav_menu = apply_filters("wp_nav_menu", $nav_menu, $args); if ($args->echo) ( echo $nav_menu; ) else ( қайтару $nav_menu; ) )