Fobz
@Fobz
Frontend

Как задать класс для ссылок в навигации?

Есть менюшка
<ul class="navbar-nav mr-auto">
			<li class="nav-item active">	
				<a class="nav-link" href="index.html">Главная <span class="sr-only">(current)</span></a>
			</li>
			<li class="nav-item">
				<a class="nav-link" href="#">Sony Wegas Pro</a>
			</li>
			<li class="nav-item dropdown">
				<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
					After Efects
				</a>
				<div class="dropdown-menu" aria-labelledby="navbarDropdown">
					<a class="dropdown-item" href="#">Action</a>
					<a class="dropdown-item" href="#">Another action</a>
					<a class="dropdown-item" href="#">Something else here</a>
				</div>
			</li>
			<li class="nav-item">
				<a class="nav-link " href="articles.html">Статьи</a>
			</li>
		</ul>


Нужно посадить её на WP, но я не знаю как задать класс для ссылок

<a class="nav-link ">Статьи</a>

Меню вывожу вот так:

wp_nav_menu( array(
		'theme_location'  => 'menu', 
		'menu'            => '',
		'container'       => 'false',
		'container_class' => ' ',
		'container_id'    => '',
		'menu_class'      => 'navbar-nav mr-auto ', 
		'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'           => 2, 
		'walker'          => '',
	) );
  • Вопрос задан
  • 38 просмотров
Решения вопроса 1
@ART_CORP
Девиз по жизни, если не сейчас , то когда?
Вам нужно свойство walker можно его кастомизировать в functions.php нашел пример у себя.

Для изменения вида ul добавляем код в functions.php

class My_Walker_Nav_Menu extends Walker_Nav_Menu {

    /**
     * Starts the element output.
     *
     * @since 3.0.0
     * @since 4.4.0 The {@see 'nav_menu_item_args'} filter was added.
     *
     * @see Walker::start_el()
     *
     * @param string   $output Passed by reference. Used to append additional content.
     * @param WP_Post  $item   Menu item data object.
     * @param int      $depth  Depth of menu item. Used for padding.
     * @param stdClass $args   An object of wp_nav_menu() arguments.
     * @param int      $id     Current item ID.
     */
    public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        if ( isset( $args->item_spacing ) && 'discard' === $args->item_spacing ) {
            $t = '';
            $n = '';
        } else {
            $t = "\t";
            $n = "\n";
        }
        $indent = ( $depth ) ? str_repeat( $t, $depth ) : '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;
        $classes[] = 'header__menu-item';

        $args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
        $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';

        $output .= $indent . '<li' . $class_names .'>';

        $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']   = ! empty( $item->url )        ? $item->url        : '';
        $atts['class']   = 'header__menu-link nav-link';

        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );

        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }

        $title = apply_filters( 'the_title', $item->title, $item->ID );
        $title = apply_filters( 'nav_menu_item_title', $title, $item, $args, $depth );

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

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }

}

я уже установил нужный класс в нужном месте вам нужно лишь вставить код в functions.php и подключить в свойстве
wp_nav_menu( array(
    'theme_location'  => 'menu', 
    'menu'            => '',
    'container'       => 'false',
    'container_class' => ' ',
    'container_id'    => '',
    'menu_class'      => 'navbar-nav mr-auto ', 
    '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'           => 2, 
    'walker'         => new My_Walker_Nav_Menu(),
  ) );


PS не проверял ,дайте знать если не сработает
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
AwardWallet Пермь
от 45 000 до 60 000 руб.
While Web Production Киев
от 5 000 до 15 000 грн.
Dart Simple Санкт-Петербург
от 120 000 до 150 000 руб.
21 авг. 2018, в 10:29
2000 руб./за проект
21 авг. 2018, в 09:20
5555 руб./за проект
21 авг. 2018, в 07:22
100000 руб./в месяц