metaloha

<p>Use a shortcode to define a drop-down form field, and shortcodes to define blocks of content that will be displayed when a specific entry is selected.</p>
<h3>Usage</h3>
<p>To add a content dropdown to a post, you can either select the Content Dropdown icon from the TinyMCE editor, or enter the shortcodes manually.</p>
<pre><code>[dropdown name="controlName" class="customClassName"] - both `name` and `class` are optional; `name` will default to `dropdown-content`
</code></pre>
<ul>
<li>the <code>name</code> is used to identify which content sections are targetted by this dropdown; if there is only one dropdown on a page, it is optional; if there are multiple dropdowns on a page, each will need a unique name</li>
<li><code>class</code> can be a space-separated list of class names, or just a single class name</li>
<li>
<p>only <code>[dropdown-option]</code> shortcodes may be inside this shortcode</p>
<p>[dropdown-option value=”someValue”] – the <code>value</code> field is technically optional, but is required if this option is meant to make a content block visible</p>
</li>
<li>
<p>must be inside a <code>[dropdown]</code> shortcode</p>
<p>[dropdown-content name=”controlName” value=”someValue”] – if the <code>name</code> matches a dropdown name, and the <code>value</code> matches the value of an option within that dropdown, then this content will be displayed when that specific option is selected.</p>
</li>
<li>
<p>again, <code>name</code> is technically optional, but must match a <code>[dropdown]</code> name (also defaults to <code>dropdown-content</code>)</p>
</li>
<li><code>value</code> is required, and must match a <code>value</code> for a <code>[dropdown-option]</code></li>
<li>can be anywhere on the page</li>
</ul>
<h3>Example</h3>
<p><em>Copy and paste the following content to see the plugin in action</em></p>
<p>[dropdown]<br />
[dropdown-option]Select one…[/dropdown-option]<br />
[dropdown-option value=”option1″]First option[/dropdown-option]<br />
[dropdown-option value=”option2″]Second Option[/dropdown-option]<br />
[/dropdown]</p>
<p>[dropdown-content value=”option1″]Content for the first option.[/dropdown-content]</p>
<p>[dropdown-content value=”option2″]Content for the second option.[/dropdown-content]</p>
<p>Those were all using the default values from the plugin. Let’s change it up a bit.</p>
<p>[dropdown]<br />
[dropdown-option value=”option1″]The First[/dropdown-option]<br />
[dropdown-option value=”option2″ default=true]The Second[/dropdown-option]<br />
[dropdown-option value=”option3″]The Third[/dropdown-option]<br />
[/dropdown]</p>
<p>You’ll notice below that the second option will be displayed by default for you.</p>
<p>[dropdown-content value=”option1″]Some different content for the second first option.[/dropdown-content]</p>
<p>[dropdown-content value=”option2″]Some different content for the second second option.[/dropdown-content]</p>
<p>[dropdown-content value=”option3″]Some different content for the second third option.[/dropdown-content]</p>


Dropdown Content

Allows different content to be displayed based on the value of an author-defined drop-down box.

grooni

<p><a href="https://codecanyon.net/item/groovy-menu-wordpress-mega-menu-plugin/23049456" rel="nofollow ugc">Mega Menu Pro</a> | <a href="https://groovymenu.grooni.com/" rel="nofollow ugc">Demo</a> | <a href="https://grooni.com/docs/groovy-menu/" rel="nofollow ugc">Documentation</a> | <a href="https://www.youtube.com/channel/UCpbGGAUnqSLwCAoNgm5uAKg" rel="nofollow ugc">Video tutorials</a></p>
<p>Groovy Mega Menu is a responsive and free <a href="https://groovymenu.grooni.com/" rel="nofollow ugc">Mega Menu WordPress plugin</a> that will allow you easily to add an awesome menu on your site and improve website navigation. Is an easy to customize, just need to upload your logo and fit your own colors, fonts and sizes.<br />
https://youtu.be/w1SIBwMdfn8</p>
<p><iframe loading="lazy" title="How to Add a Mega Menu on Your WordPress Site | Groovy Menu Free | Best Mega Menu plugins in 2023" width="750" height="422" src="https://www.youtube.com/embed/_f-11Ujp410?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></p>
<p>View more video tutorials: <a href="https://www.youtube.com/channel/UCpbGGAUnqSLwCAoNgm5uAKg" rel="nofollow ugc">Mega Menu Tutorials</a></p>
<h4>Features</h4>
<ul>
<li>Mega Menu</li>
<li>Horizontal menu</li>
<li>Vertical menu (as hamburger menu)</li>
<li>Onepage menu</li>
<li>Dropdown menu</li>
<li>Submenu</li>
<li>Topbar header</li>
<li>Toolbar menu</li>
<li>Ajax Cart</li>
<li>DIVI Compatible (without mega menu module)</li>
<li>Avada Fusion Builder Compatible</li>
<li>Elementor Compatible</li>
<li><a href="https://groovymenu.grooni.com/shop/" rel="nofollow ugc">WooCommerce Mega menu</a></li>
<li>Responsive layout</li>
<li>Full width mega menu</li>
<li>Mobile menu</li>
<li>Mega menu mobile</li>
<li>Mobile slide menu </li>
<li>Custom block in menu predefined areas (partially)</li>
<li>Multi-level menu support</li>
<li>Smooth scroll</li>
<li>RTL Ready</li>
<li>WPML / Polylang compatible</li>
<li>GDPR Compliance</li>
<li>Preview mode</li>
<li>2 hover types</li>
<li>1 desktop logo + 1 mobile logo</li>
<li>Automatic and manual integration</li>
<li>No coding skills needed</li>
<li>Easy to customize</li>
</ul>
<h4>Premium Features</h4>
<ul>
<li>Megamenu</li>
<li>Mega menu blocks – that allow adding rich content into the mega menu. Compatibility with best popular page builders as Elementor,<br />
Elementor, DIVI, WPBakery</li>
<li><a href="https://groovymenu.grooni.com/divi-mega-menu/" rel="nofollow ugc">Divi Mega menu</a></li>
<li>Divi Fullwidth Module</li>
<li>Divi Regular Module </li>
<li><a href="https://groovymenu.grooni.com/standard-wordpress-menu-plugin/" rel="nofollow ugc">Elementor Mega Menu</a></li>
<li>WPBakery Mega Menu (ex Visual Composer)</li>
<li>Vertical menu</li>
<li>Icon menu</li>
<li>Sticky menu</li>
<li>Fixed menu</li>
<li>Off canvas menu</li>
<li>Custom badges for menu items (icon, text, image)</li>
<li>Sidebar menu</li>
<li>Expandable menu</li>
<li>Collapse sidebar menu</li>
<li>Secondary navigation bar </li>
<li>Custom block in menu predefined areas </li>
<li>Secondary navigation bar </li>
<li>Additional sidebar menu </li>
<li>Full width menu </li>
<li>Many header layouts</li>
<li>Online library preset</li>
<li>Premium Support</li>
<li>Theme Developers features</li>
<li>User roles with user role plugins</li>
<li>Set specific menu for the taxonomies</li>
</ul>
<p>Get max from your site menu with the Groovy Mega Menu PRO for WP.</p>
<h4>Page Builders compatibility</h4>
<ul>
<li>Elementor, Elementor Pro</li>
<li>DIVI Theme Builder – new</li>
<li>Fusion Builder (Avada Theme Builder) new</li>
<li>WPBakery (Visual Composer)</li>
<li>BeaverBuilder</li>
<li>Brizy</li>
<li>UX Builder from Flatsome theme new</li>
<li>Cornerstone by Themeco authors X theme, Pro theme</li>
<li>Gutenberg</li>
<li>SiteOrigin Page Builder</li>
</ul>
<h4>Plugin compatibility</h4>
<p>WooCommerce, Contact Form 7,  Slider Revolution, ConvertPlug, WPML, Polylang,<br />
Ninja forms, Elementor PRO, Cache plugins such as WP Rocket, W3 Total Cache,<br />
Fastest Cache, Hummingbird, Super Cache, Autoptimize, WP Optimize. Cache Enabler and others.</p>
<h3>Additional Info</h3>
<p>The source code of the plugin can be found at <a href="https://github.com/grooni/groovy-wordpress-mega-menu-plugin" rel="nofollow ugc">GitHub</a></p>


WordPress Mega menu Plugin – Groovy Menu (Free)

Groovy Menu is a Free responsive Mega Menu plugin that will allow you easily to add an awesome menu on your site and improve website navigation.

Dropdown Content vs WordPress Mega menu Plugin – Groovy Menu (Free)