Walker або як змінити класи меню?

Avatar

Від Liberbox 17-09-2014 01:12:54

Новенький · 3 повідомлень

Вітаю! Допоможіть дилетанту, будь ласка, вирішити проблему з класами меню.
Меню створюю за допомогою wp_nav_menu. Звичайно в тегах генерується безліч непотрібних id та
класів. Задача - видалити все, окрім класів предка, батька та поточної сторінки.

В мережі знайшов деякі готові рішення, але в результаті все одно виходить не те, що потрібно.

Для того, щоб видалити зайві ID та класи:
1) Замінюю назви класів, які генеруються автоматично:
function replace_menu_css_class($text) {
  $my_classes = array(
    'menu-item' => '',
    '-type-custom'=>'',
    '-object-custom'=>'',
    '-home'=>'',
    '-type-post_type'=>'',
    '-object-page'=>'',
    '-has-children'=>'page-has-children',
    'current-page-ancestor'=>'',
    'current-menu-ancestor'=>'',
    'current_page_parent'=>'current_parent',
    'current-menu-parent'=>'',
    'current_page_ancestor'=>'current_ancestor',
    '-type-custom'=>'',
    '-object-custom'=>'',
    'current-'=> 'current-page',   
);
  $text = str_replace(array_keys($my_classes), $my_classes, $text);
  return $text;
}
add_filter( 'nav_menu_css_class', 'replace_menu_css_class' );

2) Також додав новий класс Walker. Взяв кастомний і просто видалив звідти деякі елементи таким чином:
- в цій частині видалив третій рядок, який, як я зрозумів відповідає за створення класу menu-item-ID сторінки
/* Генеруємо рядок із CSS-класами елемента меню*/
        $class_names = $value = '';
        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;

- цілком видалив частину, яка відповідає за генерацію ID тегів <li>
/* Генеруємо ID елемента*/
        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
        $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';

В результаті Walker вийшов такий
class True_Walker_Nav_Menu extends Walker_Nav_Menu {
    /**
     * @see Walker::start_el()
     * @since 3.0.0
     *
     * @param string $output
     * @param object $item
     * @param int $depth
     * @param object $args
     */
    function start_el(&$output, $item, $depth, $args) {
        global $wp_query;           
       
        $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

        /*
         * Генеруємо рядок з CSS-класами елемента меню
         */
        $class_names = $value = '';
        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
         
        // функція join перетворює масив у рядок
        $class_names = join(' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
        $class_names = ' class="' . esc_attr( $class_names ) . '"';

        /*
         * Генеруємо елемент меню
         */
        $output .= $indent . '<li' . $value . $class_names .'>';

        // атрибути елемента, title="", rel="", target="" и href=""
        $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 .= '<a'. $attributes .'>';
        $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
        $item_output .= '</a>';
        $item_output .= $args->after;

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

HTML виходить майже правильний
<ul id=menu><li class="      current_parent current_ancestor page-has-children"><a href="адреса">Заголовок</a>
<ul class="sub-menu">
    <li class="   current-page"><a href="адреса">Заголовок</a></li>
    <li class="  "><a href="адреса">Заголовок</a></li>
    <li class="  "><a href="адреса">Заголовок</a></li>
    <li class="  "><a href="адреса">Заголовок</a></li>
</ul>
</li>
</ul>

Не влаштову те, що у разі відсутності класа у тега <li> залишається <li class="  ">, тобто потрібно видалити class="  ", якщо у <li> немає класа и прибрати пробіли після перших лапок, якщо <li> має класи.
Розумію, що десь у цій частині кода необхідно правити
// функція join перетворює масив у рядок
        $class_names = join(' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
        $class_names = ' class="' . esc_attr( $class_names ) . '"';

Але як це зробити не знаю.
Може у когось є рішення із цього питання? Або ж взагалі рішення як підправити масив $classes, щоб видалити зайві класи, залишивши потрібні. Дякую.

Avatar

Від AzzePis 17-09-2014 09:50:24

Administrator · 1,020 повідомлень

Вибачте за, можливо, не досить доречне питання, а навіщо? Наявність класу, наприклад, current-page у елемента списку додає вам можливості по стилізації елементу, але не заважає робити щось інше.


Український хостинг для WordPress | Шаблони та плагіни для WordPress українською
Тут можна купити домен за найкращою ціною

Avatar

Від Liberbox 17-09-2014 14:13:27

Новенький · 3 повідомлень

current-page я як раз залишив, а також page-has-children, current_parent і current_ancestor, якщо Ви дивились код, який я навів.
А ось інші 11 класів мені не потрібні - це сміття, які лише навантажують кінцевий код.
Рішення знайдене на іншому ресурсі, все працює як треба. Якщо комусь цікаво, то будь-ласка http://searchengines.guru/showpost.php? ... tcount=656
Тыльки в першому наведеному рішенні у другому рядку додати ще одну дужку ) перед ;

Avatar

Від AzzePis 17-09-2014 14:28:56

Administrator · 1,020 повідомлень

Дякую за посилання.
П.С. код я бачив, я просто цей клас для прикладу навів. Щодо сміття, це відносно - 3кб лишнього тексту )


Український хостинг для WordPress | Шаблони та плагіни для WordPress українською
Тут можна купити домен за найкращою ціною

Avatar

Від Liberbox 17-09-2014 14:53:52

Новенький · 3 повідомлень

Скільки там Кб не дуже важливо дійсно. Але читати чистий HTML набагато приємніше і зручніше.