Fügen Sie eine ID zu den Menüpunkten in wp_nav_menu hinzu

Ich verwende wp_nav_menu in WordPress, um meine Navigation zu erstellen

Die Ausgabe ist ähnlich (Ich habe href-Links entfernt)

 

Ich muss jeden Link einzeln stylen.

Wie kann ich eine ID zu jedem (li) oder (a) im Menü hinzufügen, damit ich es stylen kann?

Solutions Collecting From Web of "Fügen Sie eine ID zu den Menüpunkten in wp_nav_menu hinzu"

Klingt so, als müssten Sie eine benutzerdefinierte Walker-function verwenden

Ich habe Code in den WordPress-Support-Foren gefunden, die nützlich sein könnten:

Walker-class – Pastebin

 class custom_nav_walker extends Walker_Nav_Menu { function start_el(&$output, $item, $depth, $args) { global $wp_query; $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = ' class="' . esc_attr( $class_names ) . '"'; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '
  • '; $attributes = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) .'"' : ''; $attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) .'"' : ''; $attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) .'"' : ''; $attributes .= ! empty( $item->url ) ? ' href="' . esc_attr( $item->url ) .'"' : ''; $item_output = $args->before; $item_output .= ''; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= ''; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } /** * @see Walker::end_el() * @since 3.0.0 * * @param string $output Passed by reference. Used to append additional content. * @param object $item Page data object. Not used. * @param int $depth Depth of page. Not Used. */ function end_el(&$output, $item, $depth) { $output .= "
  • \n"; } }

    Thread-Quelle – WP-Unterstützung

    Ausgabe: