dansmart
  • 0
Новичок

Как сделать так, чтобы на моей странице одной категории wp_nav_menu выделялась родительская?

  • 0

С новой системой wp_nav_menu можно добавить категорию в качестве пункта меню, поэтому в моем примере у меня есть категория «новости», которая является пунктом подменю «О программе».

About (page)<br></br> --news (category)<br></br> --history (page)<br></br> --contact us (page)

Меню, выделяющее CSS, берет начало от текущего-меню-родителя и текущего-меню-предка, так что, когда я нахожусь в разделе подменю, пункт меню верхнего уровня (например, «О программе») выделяется при посещении «новостей».

Это отлично работает, за исключением случаев, когда я посещаю сообщение в категории «новости», которое соответствует is_single() и in_category («новости»).

Насколько я вижу в Firebug, «текущий-меню-родитель» и «текущий-меню-предок» применяются к пункту меню «новости», однако они не применяются к пункту меню верхнего уровня «О программе».

Есть ли что-то, что я упускаю при настройке меню? Я пытался использовать пользовательский ходок, однако кажется, что предки начального меню не настроены должным образом?

Кажется, мое единственное решение (не прибегая к неприятному взлому JQuery) — создать страницу «новостей», которая запрашивает сообщения новостей, а не указывает на «категорию» новостей.

Есть идеи?

Спасибо, Дэн

Обновление с образцом кода 09.09.2010

Как это происходит сейчас, просмотр одной страницы в категории «Новости» http://www.example.com/2010/09/top-news-did-you-know/ :

<li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-28"><a href="http://www.example.com/about/">About Us</a><br></br> <ul class="sub-menu"><br></br> <li id="menu-item-71" class="menu-item menu-item-type-taxonomy"><a href="http://www.example.com/category/events/">Events</a></li><br></br> <li id="menu-item-70" class="menu-item menu-item-type-taxonomy current-post-ancestor current-menu-parent current-post-parent current-menu-parent"><a href="http://www.example.com/category/news/">News & views</a></li><br></br> <li id="menu-item-88" class="menu-item menu-item-type-post_type"><a href="http://www.example.com/contact-us/">Contact Us</a></li><br></br> </ul></li>

Итак, вы видите, что «О нас» не имеет никакого класса CSS, указывающего, что он является родителем просматриваемой в данный момент страницы.

Как я думаю, это должно работать (и если честно, если это не работает, то это баг из-за отсутствия реализации):

<li id="menu-item-28" class="menu-item menu-item-type-post_type current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-28"><a href="http://www.example.com/about/">About Us</a><br></br> <ul class="sub-menu"><br></br> <li id="menu-item-71" class="menu-item menu-item-type-taxonomy"><a href="http://www.example.com/category/events/">Events</a></li><br></br> <li id="menu-item-70" class="menu-item menu-item-type-taxonomy current-post-ancestor current-menu-parent current-post-parent current-menu-parent"><a href="http://www.example.com/category/news/">News & views</a></li><br></br> <li id="menu-item-88" class="menu-item menu-item-type-post_type"><a href="http://www.example.com/contact-us/">Contact Us</a></li><br></br> </ul></li>

Это имеет current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor классы CSS, прикрепленные к пункту меню верхнего уровня. Это работает таким образом для каждой второй страницы или даже при просмотре самой категории, но не для одной страницы в категории.

Share
  1. У меня был тот же вопрос на прошлой неделе.

    • 0
  2. В настоящее время это невозможно, если элемент меню страницы является родительским для элемента меню категории.

    В вашем примере, если «О программе» была категорией, а «Новости» была дочерней категорией, тогда был бы назначен пункт меню «О программе» (категория):

    • текущий-после-предок
    • текущее меню-родитель
    • текущий пост-родитель
    • 0
  3. У меня тоже была такая же проблема. Я не смог найти php-хак, поэтому использовал javascript:

    function findAncestor(){
        var currentParentLi = document.getElementsByClassName("current-menu-parent");
        if(currentParentLi){
            var currentAncestorLi = currentParentLi[0].parentNode.parentNode;
            if(currentAncestorLi && currentAncestorLi.tagName=="LI"){
                currentAncestorLi.className += " current-menu-ancestor";
            }
        }
    }
    

    Поместите приведенный выше код в файл.js, затем укажите его в заголовке своей страницы и вызовите функцию findAncestor() в window.onload, то есть:

    <script type="text/javascript">
    <!--
    window.onload = function() {
        findAncestor()
    }
    //-->
    </script>
    
    • 0
  4. Я согласен с Chris_O

    Итак, у меня есть статическая главная страница, 2 основные категории + 1 подкатегория под ними и еще одна страница. Управляется WordPress 3.0.1 и Thesis 1.8, используя меню WordPress вместо меню Thesis.

    Для выделения основной категории я использовал:.current-post-ancestor a { background:#FFFFFF;}

    (это выделяет основную категорию в одном посте)

    Для выделения подкатегории я использовал:.sub-menu.current-post-ancestor {background:#F0EEC2;}

    (это выделяет подкатегорию -под основной категорией-, когда в одном посте подкатегории)

    Я хотел бы, чтобы были выделены как «основная категория», так и «подкатегория».

    Но не могу найти подвох.

    Пьер

    • 0
  5. Вы можете найти этот тематический форум очень информативным, так как я ближе к решению.

    http://diythemes.com/forums/showthread.php?39258-Category-highlighting-for-single-post-%28-wp-menu-%29.

    Пьер

    • 0

Оставить ответ

You must login to add an answer.