WP Menu Custom Fields

WP Menu Custom Fields

Wordpress plugin

Install on Wordpress

App Details

This plugin adds custom fields on the menu item’s edit interface of wp-admin and supports only 1-level menu configuration.
Below is the list of custom fields this plugin adds.

  • Custom text
  • Image selection with link and caption
  • Shortcode with caption
  • Custom HTML with TinyMCE editor

Notes:

  • This plugin works with default themes. In order to use it with custom themes, please add the necessary styling in your theme/child theme to override the plugin’s CSS.
  • The custom fields from this plugin should be used in the submenu for well-structured and responsive UI.
  • Currently, this plugin is not supported with FSE themes.

Usage

  1. After installing and activating this plugin, goto Appearance -> Menus of your WordPress admin. Create a menu if you haven’t already and add menu items according to your need.
  2. When you expand any menu item, you’ll see the custom fields added here (see screenshots below). You can see Custom Field and Select Feature options.
  3. Along with Custom Text field, you can choose to use either Image, Shortcode or Custom HTML feature for a particular menu item.
  4. You can click on the option you want to use and the input fields of that option will be visible.

Using Custom Text field

  • You can enter any text here and it’ll be displayed with this menu item.
  • This field can be used by all menu items along with any other feature.

Using Image

  • By clicking on Select Image button, WordPress’ media gallery window will be opened up. You can choose 1 image from already uploaded images or you can upload a new one and select that.
  • The selected image will be shown below Select Image button after you select and close the media gallery window.
  • To remove already selected image, click on Select Image button and deselect the already selected image. You can change the selected image by selecting any other image.
  • You can enter a URL in Image Link text field. On front-end, clicking on the image will lead to this URL.
  • You can enter a caption text in Image Caption field and it’ll be displayed below the image on the front-end.

Using Shortcode

  • You can add a shortcode in Shortcode field. We’ve added some stylings to handle WordPress’ default [video] and [audio] shortcode.
  • You can enter a caption text in Shortcode Caption field and it’ll be displayed below the shortcode on the front-end.

Using Custom HTML

  • TinyMCE editor is used to add custom HTML here.
  • From the Visual tab, you can enter text and format it using tools given in toolbar.
  • You can switch to Text tab to see/change HTML code of the text you entered.

Hooks

wp_menu_custom_fields_image_html Filter

  • Allows to change HTML generated for image feature.
  • There are 3 parameters. $html (Generated HTML), $data (Custom fields data), $item_id (Menu item ID).
  • Example:

     [selected-feature] => image [image] => Array ( [media-id] => 11 [media-type] => image [media-link] => https://google.com/ [media-caption] => This is image caption [media-url] => http://example.com/wp-content/uploads/2020/03/92d43b978cbcdc7b33e3596d131d5256.jpg ) 

wp_menu_custom_fields_shortcode_html Filter

  • Allows to change HTML generated for shortcode feature.
  • Parameters are same as wp_menu_custom_fields_image_html.
  • Example:

     [selected-feature] => shortcode [shortcode] => Array ( [shortcode] => [video src="https://file-examples.com/wp-content/uploads/2017/04/file_example_MP4_480_1_5MG.mp4"] [shortcode-caption] => This is a shortcode caption ) 

wp_menu_custom_fields_custom_markup_html Filter

  • Allows to change HTML generated for custom HTML feature.
  • Parameters are same as wp_menu_custom_fields_image_html.
  • Example:

     [selected-feature] => html [html] => Array ( [custom-html] => <em><strong>This is custom HTML</strong></em> ) 

wp_menu_custom_fields_custom_text_html Filter

  • Allows to change HTML generated for custom text field.
  • Parameters are same as wp_menu_custom_fields_image_html.
  • Example:

     [custom-text] => This is a custom text 

wp_menu_custom_fields_fields_html Filter

  • Allows to change the final custom field’s HTML generated for a particular menu item.
  • Parameters are same as wp_menu_custom_fields_image_html.
  • Example:

     Array ( [custom-text] => This is a custom text [selected-feature] => image [image] => Array ( [media-id] => 11 [media-type] => image [media-link] => https://google.com [media-caption] => This is image caption [media-url] => http://example.com/wp-content/uploads/2020/03/92d43b978cbcdc7b33e3596d131d5256.jpg ) ) 

Styling mega menu

A theme developer can add stylings for the custom fields added by this plugin by referring to the below sample HTML code.

  • Image & Custom text

    • Sample HTML code

       <div class="rt-wp-menu-custom-fields-wrapper" style="padding-top: 10px; padding-right: 20px;"> <div class="rt-wp-menu-custom-fields-image-wrapper"> <a href="https://google.com"> <img class="rt-wp-menu-custom-fields-image" src="http://example.com/wp-content/uploads/2020/03/92d43b978cbcdc7b33e3596d131d5256.jpg"> </a> <span class="rt-wp-menu-custom-fields-image-caption">This is an image caption</span> </div> <span class="rt-wp-menu-custom-fields-custom-text">This is a custom text</span> </div> 
    • If Image Link is entered, then img tag will be wrapped inside a.

    • Custom text will be displayed below the feature’s HTML.
  • Shortcode

     <div class="rt-wp-menu-custom-fields-shortcode-wrapper"> <div class="rt-wp-menu-custom-fields-shortcode"> <!-- shortcode HTML will be here --> </div> <span class="rt-wp-menu-custom-fields-shortcode-caption">This is shortcode caption!</span> </div> 
  • Custom HTML

     <div class="rt-wp-menu-custom-fields-custom-html">Welcome to <strong>WordPress</strong>. This is your first post. Edit or delete it, then start <em>writing</em>!</div> 

Important Links

  • GitHub – Please mention your wordpress.org username when sending pull requests.

License

Same GPL that WordPress uses!

See room for improvement?

Great! There are several ways you can get involved to help make this plugin better:

  1. Report Bugs: If you find a bug, error or other problem, please report it! You can do this by creating a new topic in the issue tracker.
  2. Suggest New Features: Have an awesome idea? Please share it! Simply create a new topic in the issure tracker to express your thoughts on why the feature should be included and get a discussion going around your idea.

Pricing

Starting from $0 per month.

Check Out the Stories Widget

By Common Ninja

StoriesTry For Free!

App Info

Rating

Reviewers

1 reviews

Tags

Navigation Menu

Developed By

rtCamp

Quick & Easy

Find the Best Wordpress plugins for you

Common Ninja has a large selection of powerful Wordpress plugins that are easy to use, fully customizable, mobile-friendly and rich with features — so be sure to check them out!

Testimonial

Testimonial plugins for Wordpress

Contact Form

Contact Form plugins for Wordpress

Maps

Maps plugins for Wordpress

Translation

Translation plugins for Wordpress

Chat

Chat plugins for Wordpress

Slider

Slider plugins for Wordpress

Reviews

Reviews plugins for Wordpress

Contact

Contact plugins for Wordpress

Galleries

Galleries plugins for Wordpress

SEO

SEO plugins for Wordpress

Forms

Forms plugins for Wordpress

Comments

Comments plugins for Wordpress

Backup

Backup plugins for Wordpress

Privacy

Privacy plugins for Wordpress

Optimize

Optimize plugins for Wordpress

Tabs

Tabs plugins for Wordpress

Social Sharing

Social Sharing plugins for Wordpress

Events Calendar

Events Calendar plugins for Wordpress

Comments

Comments plugins for Wordpress

Social Feeds

Social Feeds plugins for Wordpress

Social Sharing

Social Sharing plugins for Wordpress

Portfolio

Portfolio plugins for Wordpress

Video Player

Video Player plugins for Wordpress

popup

popup plugins for Wordpress

SiteMap

SiteMap plugins for Wordpress

Payment

Payment plugins for Wordpress

Coming Soon

Coming Soon plugins for Wordpress

Inventory

Inventory plugins for Wordpress

Testimonials

Testimonials plugins for Wordpress

Portfolio

Portfolio plugins for Wordpress

Membership

Membership plugins for Wordpress

Forms

Forms plugins for Wordpress

Analytics

Analytics plugins for Wordpress

Events Calendar

Events Calendar plugins for Wordpress

Sliders

Sliders plugins for Wordpress

Analytics

Analytics plugins for Wordpress

Reviews

Reviews plugins for Wordpress

Security

Security plugins for Wordpress

Ads

Ads plugins for Wordpress

Music Player

Music Player plugins for Wordpress

Countdown

Countdown plugins for Wordpress

Email Marketing

Email Marketing plugins for Wordpress

Membership

Membership plugins for Wordpress

Ecommerce

Ecommerce plugins for Wordpress

Customer Support

Customer Support plugins for Wordpress

Video Player

Video Player plugins for Wordpress

Tabs

Tabs plugins for Wordpress

Social Feeds

Social Feeds plugins for Wordpress

Common Ninja Apps

Some of the best Common Ninja plugins for Wordpress

Browse our extensive collection of compatible plugins, and easily embed them on any website, blog, online store, e-commerce platform, or site builder.

Stories for Wordpress logo

Stories

Add interactive stories to your site to showcase content in a visual, mobile friendly format that boosts engagement and guides visitors toward action.

Lottie Player for Wordpress logo

Lottie Player

Use a Lottie player to embed lightweight JSON animations that improve visual design, keep pages fast, and create a smoother user experience.

TikTok Feed for Wordpress logo

TikTok Feed

Show your latest TikTok videos in a live feed that keeps content fresh, builds social proof, and keeps visitors engaged.

Music Player for Wordpress logo

Music Player

Add a no-code music player to your site to stream audio, share playlists, and support multiple formats with easy setup.

Glossary for Wordpress logo

Glossary

Create an interactive glossary that displays clear definitions, images, and search options to help visitors learn terms quickly and navigate complex topics with ease.

My Reviews on Amazon for Wordpress logo

My Reviews on Amazon

Show your Amazon product reviews with My Reviews on Amazon to build trust, boost credibility, and help visitors make confident purchase decisions.

Audio Player for Wordpress logo

Audio Player

Add a no-code audio player to your site and boost engagement with music, podcasts, and voice content effortlessly.

App Store Reviews for Wordpress logo

App Store Reviews

Show Apple App Store reviews to build trust, strengthen credibility, and help visitors make confident download decisions that support app growth.

Corner Pop-up for Wordpress logo

Corner Pop-up

Add a floating corner pop-up to display updates or calls to action without disrupting the user experience or site flow.

Appointment Booking for Wordpress logo

Appointment Booking

Manage appointments with an appointment booking widget that lets visitors schedule easily, syncs calendars, sends reminders, and creates a smoother booking experience.

Payment Method Logos for Wordpress logo

Payment Method Logos

Show payment method logos that highlight accepted payment options, build trust at checkout, and help visitors feel confident completing their purchase.

eBay Reviews for Wordpress logo

eBay Reviews

Show eBay reviews to build trust, strengthen credibility, and help visitors make confident purchase decisions that support higher sales.

More plugins

plugins You Might Like

Discover Apps By Platform

Discover the best apps for your website

WordPress
Wix
Shopify
Weebly
Webflow
Joomla
PrestaShop
Shift4Shop
WebsiteX5
MODX
Opencart
NopCommerce

Common Ninja Search Engine

The Common Ninja Search Engine platform helps website builders find the best site widgets, apps, plugins, tools, add-ons, and extensions! Compatible with all major website building platforms - big or small - and updated regularly, our Search Engine tool provides you with the business tools your site needs!

Multiple platforms