Adding jQuery link to Nav

  • I need to add a link to a jQuery function to my main navigation. Something like this:

    <a id="myJQueryLink" onclick="return false">MY JQ LINK</a>

    I found this nifty code and added it to functions.php:

    function add_my_link($items, $args) {
            $class = 'class="menu-item"';
            $homeMenuItem =
                '<li ' . $class . '>' .
                $args->before .
                '<a href=" " id="myJQueryLink" onclick="return false">' .
                $args->link_before . 'MY JQ LINK' . $args->link_after .
                '</a>' .
                $args->after .
                '</li>';
        $items = $homeMenuItem.$items ;
    return $items;
}
add_filter( 'wp_nav_menu_items', 'add_my_link', 10, 2 );

    It worked great, until I realized I shouldn’t be editing the main theme (twentytwelve). So I created a child theme, updated the parent theme and added the same code to a functions.php file in the child’s directory. Now it doesn’t work.

    What am I doing wrong? Is there an easier way to add a link with no href, an onclick and an id to the main navigation?

    Thanks,
    ~gyz

Viewing 7 replies - 1 through 7 (of 7 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    What exactly doesn’t work, the jQuery or PHP? Both? Any errors?

    Thread Starter gyzhor

    (@gyzhor)

    Weirdly I’m not seeing any errors. I open up my page and the link isn’t getting injected into the navigation, as it previously had been.

    Here’s the site:
    apennydreadful.com/2.0/

    Before I created the child theme, there was a “chapters” link to the left of “Home”.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    What else is in your (Child Theme) functions.php file?

    Thread Starter gyzhor

    (@gyzhor)

    Just a few script enqueues and registrations for the jQuery itself:

    function dogear_styles() {
	/*DOGEAR SCRIPT ENQUEUES*/

	wp_enqueue_style( 'dogear_styles', get_template_directory_uri() . '/../../../dogear/css/dogear.css', false, '1.0', 'all' );
	wp_enqueue_style( 'dogear_fonts', get_template_directory_uri() . '/../../../dogear/css/fonts.css', false, '1.0', 'all' );
	wp_enqueue_style( 'dogear_comic_styles', get_template_directory_uri() . '/../../../dogear/css/comics.css', false, '1.0', 'all' );

	wp_register_script( 'apd_navArray', '/dogear/scrpts/navArray.js');
	wp_register_script( 'dogear_Modernizr', '/dogear/scrpts/modernizr.custom.18541.js', array( 'jquery' ), '1.0' , true );
	wp_register_script( 'apd_dogear', '/dogear/scrpts/dogear.js', array( 'jquery' , 'dogear_Modernizr' ), '1.0' , true );
	wp_register_script( 'apd_chapterNav', '/dogear/scrpts/chapterNav.js', array( 'jquery' , 'apd_navArray' ), '1.0');

	wp_enqueue_script('apd_navArray');
	wp_enqueue_script('dogear_Modernizr');
	wp_enqueue_script('apd_dogear');
	wp_enqueue_script('apd_chapterNav');

}
add_action( 'wp_enqueue_scripts', 'dogear_styles' );
    Thread Starter gyzhor

    (@gyzhor)

    If I add the code back into the main theme, it still doesn’t work.
    This makes me wonder if there wasn’t something in the theme update that killed this.

    Thread Starter gyzhor

    (@gyzhor)

    Okay, if I change wp_nav_menu_items in the add_filter call to wp_page_menu, it injects the link into the main menu, just not inline with the other menu items (instead it floats one line-break above the others and in a different style).
    So, for some reason, wp_nav_menu_items isn’t working. I need to find the right filter.

    Any suggestions?

    Thread Starter gyzhor

    (@gyzhor)

    I’ve tried changing the parent theme. Still no change.
    I could really use a little help.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Adding jQuery link to Nav’ is closed to new replies.