web-dev-qa-db-fra.com

Boutons de navigation grisés sauf si is_user_logged_in ()

J'aimerais montrer à mes utilisateurs certaines fonctionnalités que je propose s'ils s'inscrivent dans une barre de navigation spéciale. J'ai créé ceci pour une version connectée et une version déconnectée:

if ( is_user_logged_in() ) {
    $menu = wp_nav_menu( array(
        'theme_location' => 'logged-in-menu',
        'container'      => '0',
        'fallback_cb'    => 'wp_page_menu',
        'echo'           => '0',
    ) );
    echo $menu;
} else {
    $menu = wp_nav_menu( array(
        'theme_location' => 'main-menu',
        'container'      => '0',
        'fallback_cb'    => 'wp_page_menu',
        'echo'           => '0',
    ) );
    ?>
    <style>#menu-item-1046{opacity : 0.4; filter: alpha(opacity=40);}</style>
    <?php
    echo $menu;
}

J'essaie de griser (désactiver mais laisser visible) les boutons de navigation par ID. Évidemment, mon CSS y fonctionne mais ne désactive pas le bouton ...

J'ai essayé <script>$('#menu-item-1046').button('disable');</script> Mais j'ai à peine commencé à jQuery.

1
Ben Racicot

Lorsque vous regardez les arguments possibles , vous verrez qu'il existe également la possibilité d'ajouter un menu de navigation personnalisé walker class.

$defaults = array(
    'theme_location'  => '',
    'menu'            => '',
    'container'       => 'div',
    'container_class' => '',
    'container_id'    => '',
    'menu_class'      => 'menu',
    'menu_id'         => '',
    'echo'            => true,
    'fallback_cb'     => 'wp_page_menu',
    'before'          => '',
    'after'           => '',
    'link_before'     => '',
    'link_after'      => '',
    'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
    'depth'           => 0,
    'walker'          => ''
);
wp_nav_menu( $defaults );

Le marcheur serait implémenté comme ceci:

$walker = new WPSE90265_Nav_Menu_Walker();

wp_nav_menu( array( 
    # ...
    'walker' => $walker
    # ...
) );

Il devrait étendre le menu par défaut du menu de navigation afin que vous ne deviez écraser que les méthodes à redéfinir:

class WPSE90265_Nav_Menu_Walker extends Walker_Nav_Menu
{
    public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 )
    {
        if ( ! is_user_logged_in() )
            $output = str_replace( 
                 'class="'
                ,'disabled class="'
                ,$output
            );

        parent::start_el( $output, $item, $depth, $args, $id );
    }
}

Notez que l'argument disabled ne fonctionnera que pour des éléments/balises HTML spécifiques. S'il vous plaît faire une recherche sur laquelle cela fonctionne et modifier votre marcheur en fonction. Vous pouvez également essayer d’ajouter un onClick="return false;" à l’intérieur du walker s’il n’est pas possible d’utiliser de telles balises.

1
kaiser

Parce que l'élément de menu n'est pas un bouton, vous ne pouvez donc pas utiliser .button (disable); fonction, combinez ce code avec votre css ci-dessus:

jQuery(document).ready(function() {    
     $('#menu-item-1046').click(function(){return false;});
});
0
MaxxDinh