如何向Wordpress菜单添加onclick事件

I'm trying to add an onclick event to a WordPress menu that uses a nav walker. While I understand code and php I'm not very experienced with the WordPress system nor would I could myself an experienced coder.

我正在尝试将onclick事件添加到使用nav walker的WordPress菜单中。虽然我理解代码和php我对WordPress系统不是很有经验,也不会让自己成为经验丰富的程序员。

I have a menu item that I'd like to add an onclick event to it but I can't figure how to do this.

我有一个菜单项,我想添加一个onclick事件,但我无法想象如何做到这一点。

Normally I'd use code such as the following

通常我会使用如下代码

<a href="tel:1300XXXXXX" onclick="__gaTracker('send','event','phone call','click');"></a>

The menu itself looks like this

菜单本身就是这样的

<nav>
    <ul class="sf-menu">
        <li id="menu-item-2785" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2785"><a href="tel:1300XXXXXX"><span class='icon-phone'></span>Call us today 1300 XXX XXX</a></li>
    </ul>
</nav>

While I can specific the link in the menu to be a tel: link there is no way from what I see to add an onclick to menu item itself.

虽然我可以将菜单中的链接指定为tel:link,但我没有办法将onclick添加到菜单项本身。

I tried a plugin called the Jin Menus but for the life of me I couldn't it to work.

我尝试了一个名为Jin Menus的插件,但对于我的生活,我无法工作。

I also found these articles but haven't been smart enough to get them to work at this point

我也发现了这些文章,但还不够聪明,无法让他们在这一点上工作

How to add an onclick function to wordpress menu item (For google cross domain tracking)

如何在wordpress菜单项中添加onclick功能(适用于谷歌跨域跟踪)

I would greatly appreciate any help you could provide.

我非常感谢您提供的任何帮助。

3 个解决方案

#1

if you want it for all of the menu items, use a class to identify it or if it's different for each item use an id.

如果你想要它用于所有菜单项,请使用类来识别它,或者如果每个项目的ID不同,则使用id。

in your js file:

在你的js文件中:

$( ".menu-item" ).click(function() {
  // your on click code here
});

change the .menu-item to whatever class/id you wish to target

将.menu-item更改为您希望定位的任何类/ ID

#2

This is what I used in the end. Thanks everyone for your help.

这就是我最后使用的。谢谢大家的帮助。

<script>
     (function($){
         $( ".sf-menu" ).click(function() {
             __gaTracker('send','event','phone call','header');
         });
     })(jQuery);
</script>`

#3

On a one page site, for example, you'll want to track the click Events for each menu item as your navigation, so I like adding a function tracking the Anchor tag.

例如,在单页网站上,您需要跟踪每个菜单项的单击事件作为导航,因此我想添加一个跟踪Anchor标记的函数。

$('a').click(function(){
    ga('send', 'event', 'Navigation', 'Click', $(this).text());
});

For me, the more data on clicks the better, but you could do some conditional weeding if necessary.

对我来说,点击次数越多越好,但如果有必要,你可以做一些有条件的除草。

#1