如何将数据属性添加到WordPress菜单项

我是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;
}

，它确实起作用，但是按预期的方式将属性添加到菜单中的所有a标签。因此，我正在尝试找出如何使用＃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);

UPDATE-下面的唯一答案听起来像是在做某事，但从中不能确定如何实际找到针对我的特定对象的数字链接以及在工作示例中在何处/如何添加该条件。添加了评论，但没有收到回复。既然已经有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;
    }
}

但是，如果添加该if语句，则一个评论者建议我得到以下错误：

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变量中。谢谢

#1 楼

专门编辑您在原始问题中提供的代码：

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
13年11月22日在15:50

乐于帮助！：D

–仁
13年11月22日15:51

我在《梦幻般的》中设置了提醒，所以我不会忘记明天授予赏金。

–cchiera
13年11月22日在16:07

如果您有多个菜单项作为目标怎么办？

–埃里克·米特詹斯（Eric Mitjans）
15年11月20日在12:23

如果data-toggle值不同，则仅使用多个if语句。或者，您可以将id保存到数组键中（考虑它们是唯一的），并将模式名称保存为数组值。然后使用array_key_exists（）检查if语句

–西西尔
16-4-17的13:32

#2 楼

第二个$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'] )

谢谢你！我不太确定我是否了解如何获取特定菜单项的$ item ID。在您的示例中，2220也与您的网址“ dev.rarst.net/?p=2220”相同。我要向其添加数据属性的链接不会转到另一个wordpress URL，而是href =“＃ContactForm”。根据上面的示例，我在Google上进行了更多的搜索，并尝试运行echo var_export（$ GLOBALS ['post']，TRUE）;。但是当我靠近单个菜单项时，看不到任何唯一的ID。你能澄清一下吗？或在“ if（2220 == $ item ['ID']）”中，谢谢！

–cchiera
2013年11月4日14:07

您看到的错误是因为$ item是一个对象，而不是数组；将$ item ['ID']更改为$ item-> ID。

–仁
13年11月22日在15:36

#3 楼

为什么不从另一个方向解决这个问题呢？而不是尝试以id == ??定位菜单项可能会在某个时候发生变化（菜单项，而不是ID），请使用WP Admin区域将自定义类添加到要定位的菜单项。然后在您的Javascript中使用该类来触发所需的信息：

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

我的JavaScript不能得到保证。如果您不使用jQuery，则可以尝试使用此方法。

#4 楼

我想将数据字母添加到在WordPress中创建的自定义菜单中。

我选择的步骤是：

找到菜单的ID号。
在@guiniveretoo中添加了这些代码行
为每个菜单项写了if语句（因为我希望注入不同的属性值。）
工作了！

这里是我的代码。

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;
}

希望对您有所帮助。

编程黑洞网

如何将数据属性添加到WordPress菜单项

评论

#1 楼

评论

#2 楼

评论

#3 楼

#4 楼