web-dev-qa-db-fra.com

Édition de Wordpress Nav Menu Walker

J'ai connecté T5_Nav_Menu_Walker à mon _ site WebWP. https://Gist.github.com/thefuxia/1053467

Et je veux personnaliser mon menu WP pour pouvoir ajouter des icônes de wp-admin via les classes FontAwesome. Capture d'écran: Afficher

Mais lorsque j'ajoute une classe CSS dans le menu, rien ne s'affiche dans le code HTML, car j'utilise t5_nav_walker. Comment puis-je ajouter des icônes dans ce wordpress walker? Code php de ce marcheur:

<?php # -*- coding: utf-8 -*-
/**
 * Create a nav menu with very basic markup.
 *
 * @author Thomas Scholz http://toscho.de
 * @version 1.0
 */
class menu_walker extends Walker_Nav_Menu
{
    /**
     * Start the element output.
     *
     * @param  string $output Passed by reference. Used to append additional content.
     * @param  object $item   Menu item data object.
     * @param  int $depth     Depth of menu item. May be used for padding.
     * @param  array $args    Additional strings.
     * @return void
     */
    public function start_el( &$output, $item, $depth, $args )
    {
        $output     .= '<li>';
        // $output .= '<li'.($item->current ? ' class="current"':'').'>';
        $attributes  = 'class="app-menu__item"';

        ! empty ( $item->attr_title )
            // Avoid redundant titles
            and $item->attr_title !== $item->title
            and $attributes .= ' title="' . esc_attr( $item->attr_title ) .'"';

        ! empty ( $item->url )
            and $attributes .= ' href="' . esc_attr( $item->url ) .'"';



        $attributes  = trim( $attributes );
        $title       = apply_filters( 'the_title', $item->title, $item->ID );
        $item_output = "$args->before<a $attributes>$args->link_before$title</a>"
                        . "$args->link_after$args->after";

        // Since $output is called by reference we don't need to return anything.
        $output .= apply_filters(
            'walker_nav_menu_start_el'
            ,   $item_output
            ,   $item
            ,   $depth
            ,   $args
        );
    }

    /**
     * @see Walker::start_lvl()
     *
     * @param string $output Passed by reference. Used to append additional content.
     * @return void
     */
    public function start_lvl( &$output )
    {
        $output .= '<ul class="treeview-menu">';
    }

    /**
     * @see Walker::end_lvl()
     *
     * @param string $output Passed by reference. Used to append additional content.
     * @return void
     */
    public function end_lvl( &$output )
    {
        $output .= '</ul>';
    }

    /**
     * @see Walker::end_el()
     *
     * @param string $output Passed by reference. Used to append additional content.
     * @return void
     */
    function end_el( &$output )
    {
        $output .= '</li>';
    }
}
menuscsswalker
1
Orkhan Hasanli

Vous devez créer un champ supplémentaire pour l'élément de menu. Parce que si vous allez utiliser le champ de classe - vous bloquerez l'ajout d'une classe supplémentaire aux liens. Mais si c'est bon, créez <i class="$your_class"></i> avant le titre du lien. Et @Dilip Gupta vous a donné une solution.

1
Maxim Sarandi

Voir, vous devez mettre à jour votre variable $item_output. fontawesome affiche les icônes dans ce format <i class="fa fa-angle-right"></i>.

vous devez ajouter ceci <i> dans votre <a> comme ceci.

$item_output = "$args->before"
    . "<a $attributes>"
        . "$args->link_before"
        . "<i class='$variable_which_stores_fontawesomme_value'></i>"
        . "$title"
    . "</a>"
    . "$args->link_after"
    . "$args->after";

$variable_which_stores_fontawesomme_value devrait être égal à fa fa-angle-right.

1
Dilip Gupta