WordPress как на ладони

Добавление дополнительных аттрибутов в меню wp_nav_menu

Использую функцию wp_nav_menu() в HTML коде.

В li созданного меню хочу добавить аттрибуты data-duration="2s" data-delay=".1s". Как это можно сделать ?

0
Sergei
3 года назад -9
  • 1
    stepan2278 www.weblancer.net/users/stepanko/?affili...

    https://wp-kama.ru/note/custom-wp_nav_menu-function
    вам нужно использовать свой WALKER для меню.
    Если не сможете разобраться - хотя там доступно написано - то напишите.

    Sergei 2.9 лет назад

    Я пока только скопировал код, но уже выводится такая ошибка:

    Fatal error: Declaration of My_Walker_Nav_Menu::start_lvl(&$output, $depth) must be compatible with Walker_Nav_Menu::start_lvl(&$output, $depth = 0, $args = null) in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 6

    stepan 2.9 лет назад
    // свой класс построения меню:
    class My_Walker_Nav_Menu extends Walker_Nav_Menu {
    
    	public function start_el( &$output, $item, $depth = 0, $args = null, $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;
    
    		/**
    		 * Filters the arguments for a single nav menu item.
    		 *
    		 * @since 4.4.0
    		 *
    		 * @param stdClass $args  An object of wp_nav_menu() arguments.
    		 * @param WP_Post  $item  Menu item data object.
    		 * @param int      $depth Depth of menu item. Used for padding.
    		 */
    		$args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );
    
    		/**
    		 * Filters the CSS classes applied to a menu item's list item element.
    		 *
    		 * @since 3.0.0
    		 * @since 4.1.0 The `$depth` parameter was added.
    		 *
    		 * @param string[] $classes Array of the CSS classes that are applied to the menu item's `<li>` element.
    		 * @param WP_Post  $item    The current menu item.
    		 * @param stdClass $args    An object of wp_nav_menu() arguments.
    		 * @param int      $depth   Depth of menu item. Used for padding.
    		 */
    		$class_names = implode( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
    		$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
    
    		/**
    		 * Filters the ID applied to a menu item's list item element.
    		 *
    		 * @since 3.0.1
    		 * @since 4.1.0 The `$depth` parameter was added.
    		 *
    		 * @param string   $menu_id The ID that is applied to the menu item's `<li>` element.
    		 * @param WP_Post  $item    The current menu item.
    		 * @param stdClass $args    An object of wp_nav_menu() arguments.
    		 * @param int      $depth   Depth of menu item. Used for padding.
    		 */
    		$id = apply_filters( 'nav_menu_item_id', 'menu-item-' . $item->ID, $item, $args, $depth );
    		$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
    
    		$output .= $indent . '<li' . $id . $class_names . ' data-duration="2s" data-delay=".1s">';
    
    		$atts           = array();
    		$atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
    		$atts['target'] = ! empty( $item->target ) ? $item->target : '';
    		if ( '_blank' === $item->target && empty( $item->xfn ) ) {
    			$atts['rel'] = 'noopener';
    		} else {
    			$atts['rel'] = $item->xfn;
    		}
    		$atts['href']         = ! empty( $item->url ) ? $item->url : '';
    		$atts['aria-current'] = $item->current ? 'page' : '';
    
    		/**
    		 * Filters the HTML attributes applied to a menu item's anchor element.
    		 *
    		 * @since 3.6.0
    		 * @since 4.1.0 The `$depth` parameter was added.
    		 *
    		 * @param array $atts {
    		 *     The HTML attributes applied to the menu item's `<a>` element, empty strings are ignored.
    		 *
    		 *     @type string $title        Title attribute.
    		 *     @type string $target       Target attribute.
    		 *     @type string $rel          The rel attribute.
    		 *     @type string $href         The href attribute.
    		 *     @type string $aria-current The aria-current attribute.
    		 * }
    		 * @param WP_Post  $item  The current menu item.
    		 * @param stdClass $args  An object of wp_nav_menu() arguments.
    		 * @param int      $depth Depth of menu item. Used for padding.
    		 */
    		$atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );
    
    		$attributes = '';
    		foreach ( $atts as $attr => $value ) {
    			if ( is_scalar( $value ) && '' !== $value && false !== $value ) {
    				$value       = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
    				$attributes .= ' ' . $attr . '="' . $value . '"';
    			}
    		}
    
    		/** This filter is documented in wp-includes/post-template.php */
    		$title = apply_filters( 'the_title', $item->title, $item->ID );
    
    		/**
    		 * Filters a menu item's title.
    		 *
    		 * @since 4.4.0
    		 *
    		 * @param string   $title The menu item's title.
    		 * @param WP_Post  $item  The current menu item.
    		 * @param stdClass $args  An object of wp_nav_menu() arguments.
    		 * @param int      $depth Depth of menu item. Used for padding.
    		 */
    		$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;
    
    		/**
    		 * Filters a menu item's starting output.
    		 *
    		 * The menu item's starting output only includes `$args->before`, the opening `<a>`,
    		 * the menu item's title, the closing `</a>`, and `$args->after`. Currently, there is
    		 * no filter for modifying the opening and closing `<li>` for a menu item.
    		 *
    		 * @since 3.0.0
    		 *
    		 * @param string   $item_output The menu item's starting HTML output.
    		 * @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.
    		 */
    		$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    	}
    
    }
    
    wp_nav_menu(
    	array(
    		'container'      => '',
    		'theme_location' => 'header_menu',
    		'walker'         => new My_Walker_Nav_Menu()
    	)
    );
    stepan 2.9 лет назад

    выше код проверил, локально работает. дата атрибут добавил.
    Дальше - может быть логику вам поправить нужно будет.

    Sergei 2.9 лет назад

    В файле footer.php walker необходимо так подключать ?

    'footer',
    'menu' => '',
    'container' => null,
    'container_class' => '',
    'container_id' => '',
    'menu_class' => 'nav navbar-nav',
    'walker' => new My_Walker_Nav_Menu()
    )); ?>

    stepan 2.9 лет назад
    <?php
    wp_nav_menu(
    	array(
    		'container'      => '',
    		'menu_class' => 'nav navbar-nav',
    		'theme_location' => 'header_menu',
    		'walker'         => new My_Walker_Nav_Menu()
    	)
    );
    ?>
    Sergei 2.9 лет назад

    Я так и сделал, но выдаются следующие ошибки:

    Warning: Attempt to read property "before" on array in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 114

    Warning: Attempt to read property "link_before" on array in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 116

    Warning: Attempt to read property "link_after" on array in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 116

    Warning: Attempt to read property "after" on array in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 118

    Warning: Attempt to read property "before" on array in C:\OpenServer\domains\acme\wp-content\themes\acme\inc1\walker.php on line 114

    и т. д.

    Sergei 2.9 лет назад

    В файл functions.php записана строка

    require get_template_directory() . '/inc1/walker.php';

    Это ведь тоже верно ?

    stepan 2.9 лет назад

    это верно, если было бы не верно - то было бы fatal error

    По поводу warning - смотрите переменные.
    $args
    она объект или массив
    Если массив - то обращаться нужно как к елементу массива. а не объекта.

    Sergei 2.9 лет назад

    В коде везде написано, что $args An object of wp_nav_menu() arguments. Это означает, что
    $args есть объект ?

    Комментировать
На вопросы могут отвечать только зарегистрированные пользователи. Вход . Регистрация