Drag and Drop Nav Menu Items in WordPress

Earlier this week, Sajjad Hossain Sagor released the first version of his Drag & Drop Menu Items plugin in the plugin repository. The plugin is a one-off, single-use plugin that does exactly what its name describes — it allows end-users to drag menu items from the meta boxes on the nav menu screen to the menu they are currently editing.

Sagor is a freelance web developer from Bangladesh. Drag & Drop Menu Items is the latest of his 18 contributions to the free plugin directory.

The plugin is simple in nature and does its one job well. To use it, users merely need to open the Appearance > Menus screen in the WordPress admin. Menu items from the meta boxes under the “Add menu items” section can then be dragged into the menu under the “Menu structure” section.

Screenshot of the Drag & Drop Menu Items WordPress plugin.
Dragging an item into a custom menu.

When dragging a menu item over, a drop-box appears between each of the existing items in the menu. It is worth noting that you cannot drag items into a sub-menu slot directly from the meta boxes. This is on par with the default functionality and could be a limitation of WordPress. However, sub-menu organization works as usual.

The Drag & Drop Menu Items plugin is limited to the Menus screen in the WordPress admin. It does not work in the customizer, which sports a different interface and method of adding menu items.

The plugin code is minimal and does not appear to have any issues. The additional JavaScript, at less than 4 kb, should not add much weight to the page either.

By default, WordPress requires two mouse clicks to add an item to a menu: one click to tick the checkbox and a button click to add the item. However, the default method also allows users to append multiple items at once.

On the whole, the plugin is a good option for users who prefer the drag-and-drop method of adding items or those who prefer to have both methods at their disposal. It adds a nice touch that would make sense as an existing part of WordPress.

An Uncertain Future

Screenshot of the experimental Navigation screen in the Gutenberg plugin.
Experimental Navigation screen from the Gutenberg plugin.

Eventually, Drag & Drop Menu Items may no longer function. The Gutenberg plugin team has already built an early experimental version of a new Navigation screen in the admin. The plan is to incorporate this new screen into core WordPress in the future.

The new screen will work within the block system and likely use the work that has gone into the existing Navigation block. This will provide consistency in how menus are added across the site.

For now, if you would like the ability to drag and drop menu items, this plugin is a solid solution.

위로 스크롤