最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

How to open modal window when clicking a WP menu link?

matteradmin9PV0评论

I'm making my first site with WP, I'm a Joomla Developper. I'm using wisten theme, and WP 3.9.2

I want to create a link in my the navigation that opens a modal window (not a new page) on click. Example - , when you click the LOGIN link I have no clue of how I should do this in WordPress.

The Jquery code for such an operation is not very difficult, the code is here :

/

but I have no clue of how to integrate it.

Any help would be appreciated

I'm making my first site with WP, I'm a Joomla Developper. I'm using wisten theme, and WP 3.9.2

I want to create a link in my the navigation that opens a modal window (not a new page) on click. Example - http://kendo.mx , when you click the LOGIN link I have no clue of how I should do this in WordPress.

The Jquery code for such an operation is not very difficult, the code is here :

http://jsfiddle/mmetsalu/hBX6E/2/

but I have no clue of how to integrate it.

Any help would be appreciated

Share Improve this question edited Aug 18, 2014 at 23:53 Ray Mitchell 91911 silver badges29 bronze badges asked Aug 18, 2014 at 21:30 Juliatzin del ToroJuliatzin del Toro 1471 silver badge7 bronze badges
Add a comment  | 

1 Answer 1

Reset to default 1

Using bootstrap's modal you could use this hook in your function.php file top do that:

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

  // inspect $item
  if ($item->ID == $menu_target) {
    $atts['data-toggle'] = 'modal';
    $atts['data-target'] = '#IDofModal';
  }
  return $atts;
}
Post a comment

comment list (0)

  1. No comments so far