How to Update and Add Bookmark Links to the wp_nav_menu in WordPress

Home » Snippets » How to Update and Add Bookmark Links to the wp_nav_menu in WordPress
0

Created with:

Visibility: 

public

Creator: WPTurbo Team

Customize with WPTurbo AI
X

Add Snippet To Project

New Project
Add To Existing Project

If you’re looking to add bookmark links to your WordPress site’s navigation menu, you might have noticed that the standard menu editor doesn’t offer this as an option. However, with a few lines of code, you can easily add bookmark links to your menu using WordPress’ built-in custom link feature. In this article, we’ll show you step-by-step how to update your WordPress navigation menu to include bookmark links.

					function wpturbo_add_bookmark_link_to_nav_menu( $items, $args ) {
    // Check if the menu is for primary navigation
    if ( 'primary' === $args->theme_location ) {
        // Get the current user ID
        $user_id = get_current_user_id();
        // Check if the user is logged in
        if ( $user_id ) {
            // Generate the bookmark link
            $bookmark_link = '<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="#">' . __( 'Bookmarks', 'wpturbo' ) . '<ul class="sub-menu"><li><a href="' . wp_nonce_url( admin_url( 'admin-ajax.php?action=wpturbo_add_bookmark' ), 'wpturbo_add_bookmark', 'nonce' ) . '">' . __( 'Add New', 'wpturbo' ) . '</a></li><li><a href="' . admin_url( 'edit.php?post_type=bookmark' ) . '">' . __( 'View All', 'wpturbo' ) . '</a></li></ul></a></li>';
            // Add the bookmark link to the menu items
            $items .= $bookmark_link;
        }
    }
    return $items;
}
add_filter( 'wp_nav_menu_items', 'wpturbo_add_bookmark_link_to_nav_menu', 10, 2 );

// AJAX callback for adding a new bookmark
function wpturbo_ajax_add_bookmark() {
    check_ajax_referer( 'wpturbo_add_bookmark', 'nonce' );
    // Get the current user ID
    $user_id = get_current_user_id();
    // Check if the user is logged in
    if ( $user_id ) {
        // Get the post data
        $bookmark_title = sanitize_text_field( $_POST['bookmark_title'] );
        $bookmark_url = esc_url_raw( $_POST['bookmark_url'] );
        $bookmark_description = wp_kses_post( $_POST['bookmark_description'] );
        // Insert the bookmark post
        $new_bookmark = array(
            'post_title' => $bookmark_title,
            'post_content' => $bookmark_description,
            'post_type' => 'bookmark',
            'post_author' => $user_id,
            'post_status' => 'publish',
        );
        $new_bookmark_id = wp_insert_post( $new_bookmark );
        // Add the bookmark url as a post meta
        update_post_meta( $new_bookmark_id, 'bookmark_url', $bookmark_url );
        // Success message
        echo __( 'Bookmark added successfully!', 'wpturbo' );
    } else {
        // Error message
        echo __( 'You must be logged in to add a bookmark.', 'wpturbo' );
    }
    die();
}
add_action( 'wp_ajax_wpturbo_add_bookmark', 'wpturbo_ajax_add_bookmark' );
				

This code snippet shows how to add a new link called "Bookmarks" to a specific menu location in WordPress, which includes sub-menu items with options to add/edit bookmarks.

To achieve this, we define a function called wpturbo_add_bookmark_link_to_nav_menu() and use the wp_nav_menu_items filter to add the new "Bookmarks" link to the menu. We check if the menu is for the primary navigation and then check if the user is logged in. If the user is logged in, we create a string containing the necessary HTML markup and add it to the menu items.

The HTML markup is generated using the __('text', 'domain') function to make it translatable. We create a list item li element with a class of menu-item-has-children and a ul element as a sub-menu containing the add and view links for bookmarks. The wp_nonce_url() function is used to generate a unique URL with a security nonce to handle the AJAX call for adding new bookmarks.

We also define an AJAX call for adding new bookmarks using wp_ajax_wpturbo_add_bookmark action hook. When a user adds a bookmark, we first check whether the user is logged in or not using get_current_user_id(). If the user is logged in, we sanitize the data by using sanitize_text_field() and esc_url_raw() functions for security reasons. Then we insert a new post of type bookmark using wp_insert_post() function with the necessary data for the post including the title, description, author and status. Finally, we update the post meta with the bookmark URL for future reference.

If the user is not logged in, we display an error message using __( 'message', 'domain') function. We use die() function to terminate the PHP script and prevent any further execution.

Register an account to save your snippets or go Pro to get more features.