Як додати атрибут даних до пункту меню WordPress


17

Я Twitter Bootstrap і мені потрібно додати атрибут data-toggle = "modal" до тегу посилання на меню. Під час пошуку більшості всіх посилань на результати робиться прогулянка до випадаючих меню Twitter Bootstrap, однак у цьому меню немає спадних меню, і мені потрібно лише додати певний атрибут.

Далі я виявив це: додайте спеціальні атрибути до пунктів меню без плагіна, що дуже корисно, оскільки це з'являється у WordPress 3.6+ і більше нам не потрібно робити довгі складні ходунки, а натомість ми можемо використовувати це: http://codex.wordpress.org/Plugin_API / Filter_Reference / nav_menu_link_attributes

Однак на цей час цей посилання на API досить голий і не дає прикладів, а оскільки він такий новий, в Google дуже мало посилань на нього.

Я спробував це спочатку:

add_filter( 'nav_menu_link_attributes', 'mywp_contact_menu_atts', 10, 3 );

function pb_contact_menu_atts( $atts, $item, $args )
{
    // inspect $item, then …
    $atts['data-toggle'] = 'modal';
    return $atts;
}

але це працює, проте, як очікується, додає атрибут до всіх тегів у меню. Тому я намагаюся розібратися, як націлити на один пункт меню за допомогою # menu-item-7857 a або іншого.

Хтось знає, де можна знайти приклад націлювання на пункт меню або зможе визначити, як базуватись на інформації, що міститься у вищезазначеній посилання API?

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

add_filter('nav_menu_link_attributes', function($atts, $item, $args) {
    if ( $args->has_children )
    {
        $atts['data-toggle'] = 'dropdown';
        $atts['class'] = 'dropdown-toggle';
    }

    return $atts;
}, 10, 3);

ОНОВЛЕННЯ - Єдина відповідь нижче звучить так, ніби вона є на чомусь, але з цього не вдалося визначити, як насправді знайти номер для націлювання на моє конкретне посилання та де / як додати це умовне у робочому прикладі. Додав коментар, але не почув. Оскільки минуло 18 днів, я думав, що побачу, чи допоможе щедрість.

Переглядаючи код посилання, на який я хочу націлити:

<li id="menu-item-7858" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7858"><a href="#" data-toggle="modal">Chat</a></li>

Я бачу число 7858, тому думаю, можливо, це саме число, на яке я повинен орієнтуватися.

Але коли я намагаюся, наприклад:

add_filter( 'nav_menu_link_attributes', 'my_chat_menu_atts', 10, 3 );


function my_chat_menu_atts( $atts, $item, $args ) {
    if ( 7857 == $item['ID'] ) {
        // inspect $item, then …
        $atts['onclick'] = 'SnapEngage.startLink();';
        return $atts;
    }
}

Однак додаю, що якщо оператор запропонував один коментатор, я отримаю таку помилку:

Fatal error: Cannot use object of type WP_Post as array

Я припускаю, що потрібно більше коду, але втрачено. Як нагадування без оператора if він працює, проте він орієнтований на всі посилання, а не на одне посилання, на яке я хочу націлити.


Я хочу вставити <? Php the_id ();?> У змінну $ atts. Щось подібне // перевірити $ item if ($ item-> ID == $ menu_target) {$ atts ['data-toggle'] = 'модальний - <? php the_id ();?>'; } повернути $ atts; Чи можете мені допомогти, як я можу вставити the_id у змінну $ atts. Спасибі
nadzhq

Відповіді:


36

Конкретне редагування коду, який ви вказали в оригінальному запитанні:

add_filter( 'nav_menu_link_attributes', 'wpse121123_contact_menu_atts', 10, 3 );
function wpse121123_contact_menu_atts( $atts, $item, $args )
{
  // The ID of the target menu item
  $menu_target = 123;

  // inspect $item
  if ($item->ID == $menu_target) {
    $atts['data-toggle'] = 'modal';
  }
  return $atts;
}

Після того, як я поміняв свої власні цінності, які це зробили! Дякую! Відзначив це правильним, але каже, що мені потрібно почекати ще 23 години, перш ніж я зможу присвоїти нагороду.
cchiera

Раді допомогти! : D
Джен

Я встановив нагадування у Fantastical, тому я не забуду завтра нагородити.
cchiera

Що робити, якщо у вас є кілька пунктів меню як цільових?
Ерік Мітчанс

просто використовуйте кратне значення if, якщо значення перемикання даних відрізняється. Або ви можете зберегти id у ключ масиву (враховуючи, що вони унікальні) та модальне ім'я як значення масиву. Тоді перевірте, якщо заява зarray_key_exists()
Sisir

8

Другий $itemаргумент, який стає доступним для вашої функції фільтра, містить об'єкт пункту меню. Якщо викинути це виглядає приблизно так:

[1] => WP_Post Object
    (
        [ID] => 2220
        [post_author] => 1
        [post_date] => 2012-12-26 19:29:44
        [post_date_gmt] => 2012-12-26 17:29:44
        [post_content] => 
        [post_title] => Home
        [post_excerpt] => 
        [post_status] => publish
        [comment_status] => open
        [ping_status] => open
        [post_password] => 
        [post_name] => home-3
        [to_ping] => 
        [pinged] => 
        [post_modified] => 2013-06-05 01:55:20
        [post_modified_gmt] => 2013-06-04 22:55:20
        [post_content_filtered] => 
        [post_parent] => 0
        [guid] => http://dev.rarst.net/?p=2220
        [menu_order] => 1
        [post_type] => nav_menu_item
        [post_mime_type] => 
        [comment_count] => 0
        [filter] => raw
        [db_id] => 2220
        [menu_item_parent] => 0
        [object_id] => 2220
        [object] => custom
        [type] => custom
        [type_label] => Custom
        [title] => Home
        [url] => http://dev.rarst.net/
        [target] => 
        [attr_title] => 
        [description] => 
        [classes] => Array
            (
                [0] => 
                [1] => menu-item
                [2] => menu-item-type-custom
                [3] => menu-item-object-custom
                [4] => current-menu-item
                [5] => current_page_item
                [6] => menu-item-home
            )

        [xfn] => 
        [current] => 1
        [current_item_ancestor] => 
        [current_item_parent] => 
    )

Щоб орієнтуватися на конкретний пункт меню, вам потрібно сформулювати свій стан та перевірити його, наприклад, щодо даних, наявних у об'єкті if ( 2220 == $item['ID'] )


Дякую за це! Я не зовсім впевнений, що розумію, як отримати ідентифікатор елемента $ для мого конкретного пункту меню, проте. У вашому прикладі 2220 також такий же, як і ваш URL " dev.rarst.net/?p=2220 ". Моє посилання Я хочу додати атрибут data, щоб не переходити до іншої URL-адреси wordpress, а скоріше href = "# ContactForm". На підставі вашого прикладу вище я гуглив більше і намагався запустити echo var_export ($ GLOBALS ['post'], TRUE); але коли я придивляюсь до пункту меню, що не відображається, я не бачу унікального ідентифікатора. Ви можете уточнити? Або в "if (2220 == $ item ['ID"]) "Дякую заздалегідь!
cchiera

2
Помилка, яку ви бачите, полягає в тому $item, що це об'єкт, а не масив; змінити $item['ID']на $item->ID.
Джен

1

Чому ви не підходите до цієї проблеми з іншого напрямку? Замість того, щоб намагатися націлити на пункт меню за допомогою id == ?? який може змінитися в якийсь момент (пункт меню, а не ідентифікатор), використовуйте область WP Admin, щоб додати спеціальний клас до пункту меню, на який потрібно націлити. Потім використовуйте цей клас у своєму Javascript, щоб запустити потрібну інформацію:

$('.my-class').click(function(e){
  // do other stuff
  e.preventDefault;
});

Мій JavaScript не гарантується. Якщо ви не використовуєте jQuery, ви можете спробувати це .


1

Я хотів додати букви даних у користувальницьке меню, яке я створив у WordPress.

Я обрав кроки:

  1. Знайдено ідентифікаційний номер мого меню.
  2. додав ці рядки коду від @guiniveretoo
  3. писав, якщо заяви для кожного пункту меню (як я хотів, щоб вводилися різні значення атрибутів.)
  4. працювали!

Ось мій код.

add_filter( 'nav_menu_link_attributes', 'wpse121123_contact_menu_atts', 10, 3 );
function wpse121123_contact_menu_atts( $atts, $item, $args )
{  
  $menu_target = 6;

  if ($item->ID == $menu_target) {
    $atts['data-letters'] = 'PROJECTS';
  }

  elseif ($item->ID == 7) {
    $atts['data-letters'] = 'RESUME';
  }
  elseif ($item->ID == 8) {
    $atts['data-letters'] = 'ARTWORKS';
  }
  elseif ($item->ID == 9) {
    $atts['data-letters'] = 'HELLO!';
  }
  return $atts;
}

Сподіваюся, що це вам допоможе.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.