Use Wordpress' nav menu system to create left/right widget flyouts, with support for Superfish
Note: This plugin requires PHP 5
Warning: This plugin requires knowledge of CSS to use adequately in widgets
Features at a glance:
Theming options:
If you want me to modify the CSS for you simply contact me and I will do it easily and quickly for you for a moderate sum.
It uses Stu Nicholl’s final drop-down code which is a complete CSS solution – no Javascript required!!
You can look on Stu’s site for other drop-down code as I got the flyout left and right code from there. Don’t forget to donate if you’re using his styles.
Most of his CSS should work just fine with the menu. I’ve made it so that the plugin automatically finds menu.css in the plugin’s folder and loads it in your WordPress site so you can instantly see how it will look. If you want to create your own CSS simply create menu.css in your theme’s root directory and the plugin will load that automatically for you.
Please note that if you’re upgrading you will need to change your theme files to suit the new approach. See Installation for further information.
/wp-content/plugins/
directory or install it from WordPress.org’s Plugin directory inside your WordPress installation.Add the required code to header.php in your WordPress theme
orientation=”top”; */
$myMenu->show();
}
?>
You can place the above code anywhere in your theme, not just the header. Options available to you are:
$myMenu->orientation – Values are ‘top’, ‘right’, ‘left’ – default is ‘top’
$myMenu->name – WordPress menu id, slug, or name
$myMenu->container_class – the class that is applied to the container
$myMenu->theme_location – The location in the theme to be used (defined via register_nav_menu)
$myMenu->menu_class – CSS class to be used for the ul element which forms the menu
These are a subset of the options given here: https://codex.wordpress.org/Function_Reference/wp_nav_menu
If you want to show the widget in the header of your theme, add a sidebar to your header.php file and update your functions.php file to add a new sidebar there.
PHP for your sidebar.php file in your WordPress theme:
<?php if ( function_exists ( dynamic_sidebar('menu') ) ) : dynamic_sidebar ('menu'); endif; ?>
Example PHP for your functions file:
<?php if ( function_exists ('register_sidebar')) { register_sidebar( array( 'name' => __('Menu', 'menu'), 'id' => 'menu', 'description' => __('Shows a dropdown menu in the header.', 'menu'), 'before_widget' => '', 'after_widget' => '', 'before_title' => '', 'after_title' => '' ) ); } ?>
The plugin defines its own menu.css in your theme’s header. If you have your own menu.css file in your theme folder the plugin will check for that and load that for you automatically. It may be easier to simply copy across menu.css from the plugin folder and use that as the basis for your own. Or, browse the internet for unordered CSS list menu styles. Stu’s site is a good start.
You can also activate the JS addon plugin to use Superfish javascript. This plugin uses its own Superfish CSS which you can find in the plugin js/superfish directory. It has been modified for use with WordPress. Place superfish.css into your own theme folder to avoid having your CSS overwritten on a plugin update!
It’s also possible to use other Superfish menu variants but you will need to edit and include them yourself using functions.php in your theme folder. Please also note that right/left widget items won’t work with this menu type installed right now.
If you get ‘broken image links’ in IE it’s because the background dropdown images in your menu.css file are set to Stu’s original ones. You will need to change these.
(Un)fortunately the WordPress nav menu system doesn’t use the browser hacks Stu Nicholl used. There are many other CSS navigation menus out there these days, do a quick Google search, pop it into your own menu.css file, and target the correct class. It’s easy to drop over the top!
That’s what I’m here for. I do WordPress sites for many people in a professional capacity and
can do the same for you. Check out www.zackdesign.biz
You need PHP 5 to run this
I left dynamic menu width code in until a replacement CSS menu can be found… it should not break existing dynamic CSS, but you can no longer change the options in the WP Settings.
Contact me to suggest a good alternative, and if you need to change any of the options found in the css_dropdownmenu_css
function use functions.php and this as a guide: https://codex.wordpress.org/Function_Reference/update_option
4.0.2
4.0.1
4.0
3.0.9
3.0.8
3.07.1
3.0.7
3.0.6
3.0.5
3.0.4
3.0.3
3.0.2
3.0.1
3.0
2.3.7
2.3.6
2.3.5
2.3.4
2.3.3
2.3.2
2.3.1
2.3
2.2.2
2.2.1
2.2
2.1
2.0
1.2
tags were apearing when no children were present)
1.1
1.0
0.3
0.2
Added admin page
Can now stop certain pages showing… at the moment just doesn’t fetch the pages (some parentless child pages
are fetched but now shown)
0.1