it-swarm-es.com

¿Cómo obtengo mi página de categoría única wp_nav_menu para resaltar al padre?

Con el nuevo sistema wp_nav_menu, es posible agregar una categoría como elemento de menú, por lo que en mi ejemplo tengo una categoría de 'noticias', que es un elemento de submenú de 'Acerca de'.

About (page)
--news (category)
--history (page)
--contact us (page)

El menú resaltado de CSS recoge desde el menú actual padre y el menú-antepasado actual, de modo que cuando estoy en una sección de submenú, el elemento de menú de nivel superior (por ejemplo, "Acerca de") se resalta cuando visita "noticias".

Esto funciona bien, aparte de cuando visito una publicación en la categoría 'noticias', que coincide con is_single () y in_category ('noticias').

Por lo que puedo ver en Firebug, el menú 'current-menu-parent' y 'current-menu-ancestor' se aplican al elemento de menú 'news', sin embargo, no se aplica al elemento de menú de nivel superior 'About'.

¿Hay algo que me falta en la configuración de mi menú? He intentado usar un andador personalizado, sin embargo, ¿parece que los ancestros del menú inicial no se configuran correctamente?

Parece que mi única solución (sin recurrir a un desagradable pirateo de JQuery) es crear una página de "noticias" que consulte las publicaciones de noticias, en lugar de apuntar a la "categoría" de noticias.

¿Algunas ideas?

Gracias dan

Actualización con código de ejemplo 09/09/2010

De la forma actual, visualizando una sola página en la categoría Noticias 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>
<ul class="sub-menu">
<li id="menu-item-71" class="menu-item menu-item-type-taxonomy"><a href="http://www.example.com/category/events/">Events</a></li>
<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 &#038; views</a></li>
<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>
</ul></li>

Entonces ves que "Acerca de nosotros" no tiene ninguna clase de CSS para indicar que es un padre de la página que se está viendo actualmente.

Cómo creo que debería funcionar (y para ser honesto, si no lo hace, entonces es un error debido a la falta de implementación):

<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>
<ul class="sub-menu">
<li id="menu-item-71" class="menu-item menu-item-type-taxonomy"><a href="http://www.example.com/category/events/">Events</a></li>
<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 &#038; views</a></li>
<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>
</ul></li>

Esto tiene las clases CSS current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor adjuntas al elemento de menú de nivel superior. Funciona de esta manera para todas las demás páginas, o incluso cuando se visualiza la categoría en sí misma, simplemente no una sola página en una categoría.

2
Dan Smart

Actualmente esto no es posible si un elemento del menú de la página es un elemento primario del elemento del menú de una categoría.

En su ejemplo si Acerca de era una categoría y Las noticias eran categoría secundaria entonces El elemento de menú Acerca de (categoría) se asignaría:

  • actual-post-ancestro
  • actual-menu-parent
  • actual-post-padre
2
Chris_O

Yo también estaba teniendo el mismo problema. No pude encontrar un hack php, así que usé uno de 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";
        }
    }
}

Coloque el código anterior en un archivo .js, luego haga referencia a él en el encabezado de su página y llame a la función findAncestor () en window.onload, es decir:

<script type="text/javascript">
<!--
window.onload = function() {
    findAncestor()
}
//-->
</script>
1
Meredith Dodge

Puede encontrar este foro de hilo muy informativo, ya que estoy más cerca de la solución.

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

Pierre

0
user1060

Estoy de acuerdo con Chris_O

Por lo tanto, tengo una página principal estática, 2 categorías principales + 1 subcategoría debajo de esas, y otra página. Impulsado por Wordpress 3.0.1 y Tesis 1.8, usando el menú de Wordpress en lugar del menú de Tesis.

Para resaltar la categoría principal, utilicé: .current-post-ancestor a {background: #FFFFFF;}

(esto resalta la categoría principal cuando está en una sola publicación)

Para resaltar la subcategoría utilicé: .sub-menu .current-post-ancestor a {background: # F0EEC2;}

(esto resalta la subcategoría -en categoría principal- cuando está en una sola publicación de subcategoría)

Me gustaría tanto "categoría principal" como "subcategoría" sean resaltado.

Pero no puedo encontrar el truco.

Pierre

0
user1060