Dani Llewellyn

This plugin provides an API which allows the developer of a site to add custom fields on the default menu editor.
<h4>Example Initialisation</h4>
<pre><code><?php
add_action('init', 'menu_excerpt__add_menu_field');
function menu_excerpt__add_menu_field() {
 if (!is_callable('bh_add_custom_menu_fields'))
 return;

 bh_add_custom_menu_fields(array(
 'excerpt' => array(
 'description' => 'Excerpt',
 'type' => 'textarea',
 )));
}
?>
</code></pre>
<h4>Accessing the fields</h4>
The easiest way to access the field(s) you’ve added is to use something along the lines of:
<pre><code>$menu = 'menuName';
$posts = wp_get_nav_menu_items($menu);
foreach ($posts as $p) {
 $myitem = get_post_meta($p->ID, '_menu_item_youritem', true);
 // do with $myitem what you like - it should be a string,
 // so the simplest thing is to "echo" it
}
</code></pre>
you can use menu locations to get the menu name if you prefer – replace the first line above with:
<pre><code>$locations = get_nav_menu_locations();
$menu = $locations['locationName'];
</code></pre>
menu locations are useful if you like to swap your menus about.
Unfortunately these examples don’t allow the use of wordpress’ inbuilt menu walkers. To use those you will need to create a custom walker_nav_menu class and access the custom fields with something along the lines of (very stripped down example will need fleshing out for full walker functionality – there are tutorials on the net for custom nav walkers):
<pre><code>class mywalker extends Walker_Nav_Menu {
 function start_el(&$output, $item, $depth, $args) {
 echo $item->custom_field
 }
}
</code></pre>
The important bit here is that the field is placed on the second variable which behaves like an object. the custom_field part is the name you gave your field with dashes replaced with underscores (to allow the name to be used in an accessor).
<h4>NOTE</h4>
This plugin does nothing by itself. It provides an API only.

Custom Menu Fields

Provides an API to add custom fields to the menu editor.

Jeff Starr

Restores the Custom Field meta box for the Gutenberg Block Editor.
Update: This plugin currently is not needed, as WordPress version 5.0+ displays Custom Fields natively. Just click the settings button (three dots) and go to Options, where you will find the option to display the Custom Fields meta box. So this plugin still works great, but it is recommended to use native WP custom fields instead. For more information, read <a href="https://wordpress.org/support/topic/please-read-7/" rel="ugc">this post</a>.
Features
<ul>
<li>Easy to use</li>
<li>Clean code</li>
<li>Built with the WordPress API</li>
<li>Lightweight, fast and flexible</li>
<li>Works great with other WordPress plugins</li>
<li>Plugin options configurable via settings screen</li>
<li>Focused on flexibility, performance, and security</li>
<li>One-click restore plugin default options</li>
<li>Translation ready</li>
</ul>
Options
<ul>
<li>Specify the post types that should display custom fields</li>
<li>Exclude custom fields that are protected/hidden</li>
<li>Exclude custom fields with empty values</li>
<li>Exclude specific custom fields by name</li>
</ul>
Planned Features
<ul>
<li>Ajaxify adding of new Custom Fields</li>
<li>Ajax method to Delete custom fields</li>
</ul>
Privacy
This plugin does not collect or store any user data. It does not set any cookies, and it does not connect to any third-party locations. Thus, this plugin does not affect user privacy in any way.
Custom Fields for Gutenberg is developed and maintained by <a href="https://x.com/perishable" rel="nofollow ugc">Jeff Starr</a>, 15-year <a href="https://plugin-planet.com/" rel="nofollow ugc">WordPress developer</a> and <a href="https://books.perishablepress.com/" rel="nofollow ugc">book author</a>.
Support development
I develop and maintain this free plugin with love for the WordPress community. To show support, you can <a href="https://monzillamedia.com/donate.html" rel="nofollow ugc">make a donation</a> or purchase one of my books:
<ul>
<li><a href="https://wp-tao.com/" rel="nofollow ugc">The Tao of WordPress</a></li>
<li><a href="https://digwp.com/" rel="nofollow ugc">Digging into WordPress</a></li>
<li><a href="https://htaccessbook.com/" rel="nofollow ugc">.htaccess made easy</a></li>
<li><a href="https://wp-tao.com/wordpress-themes-book/" rel="nofollow ugc">WordPress Themes In Depth</a></li>
<li><a href="https://books.perishablepress.com/downloads/wizards-collection-sql-recipes-wordpress/" rel="nofollow ugc">Wizard’s SQL Recipes for WordPress</a></li>
</ul>
And/or purchase one of my premium WordPress plugins:
<ul>
<li><a href="https://plugin-planet.com/bbq-pro/" rel="nofollow ugc">BBQ Pro</a> – Blazing fast WordPress firewall</li>
<li><a href="https://plugin-planet.com/blackhole-pro/" rel="nofollow ugc">Blackhole Pro</a> – Automatically block bad bots</li>
<li><a href="https://plugin-planet.com/banhammer-pro/" rel="nofollow ugc">Banhammer Pro</a> – Monitor traffic and ban the bad guys</li>
<li><a href="https://plugin-planet.com/ga-google-analytics-pro/" rel="nofollow ugc">GA Google Analytics Pro</a> – Connect WordPress to Google Analytics</li>
<li><a href="https://plugin-planet.com/head-meta-pro/" rel="nofollow ugc">Head Meta Pro</a> – Ultimate Meta Tags for WordPress</li>
<li><a href="https://plugin-planet.com/simple-ajax-chat-pro/" rel="nofollow ugc">Simple Ajax Chat Pro</a> – Unlimited chat rooms</li>
<li><a href="https://plugin-planet.com/usp-pro/" rel="nofollow ugc">USP Pro</a> – Unlimited front-end forms</li>
</ul>
Links, tweets and likes also appreciated. Thanks! 🙂

Custom Fields for Gutenberg

If you are searching for the solution to display custom fields like they were displayed before Gutenberg - in native wp meta box - this is solution for you. 

Displays old native interface for Custom Fields

This plugin does one thing and does it well. This is how all plugins should be!

Good plugin by a top dev

Restores the Custom Field meta box for the Gutenberg Block Editor.

Custom Menu Fields vs Custom Fields for Gutenberg