Wordpress Spry Menu Plugins
Hi, this is my first plugin I write. WP Spry Menu that automatically creating Spry Drop Down Menu for wordpress category include configuration page with configurable “Home” link. This plugin using Spry (Copyright (c) 2006. Adobe Systems Incorporated) javascript library from www.adobe.com. The Spry library is FREE and redistributable with some condition (see license on the js file).
Feature:
* Displaying Wordpress Category in dropdown css menu.
* No template arguments are needed to configure menu behavior, all settings are place on the Admin.
* Live preview as soon as you change the settings. No need to refresh your homepage to see changes.
* Configurable direction, your menu should appears horizontal, vertical drop left, or vertical drop right.
* Changeable Home text link, you can leave it blank for no home link.
* Depth setting, how many child you want to display.
* Exclue setting, you can select which category should not appears on the menu.
* Order setting, order by name or ID.
* Hide/Hide emtpy category. By default Wordpress won’t display an empty category, now you can configure.
* Child of setting, only display menu from selected parent category.
How to install?
The installation is very easy.
1. Upload `wp-spry-menu` folder to the `/wp-content/plugins/` directory. Make sure wp-spry-menu contains all included files.
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Place `< ?php if ( function_exists('wp_spry_menu') ) wp_spry_menu();?>` in your templates
4. Configure from WP Spry Menu options in your Wordpress Admin.
Note: Since Wordpress 2.7.1 you can easy upload zipped plugin from admin.
Frequently Asked Questions
Is it support to display page menu?
Currently not, may be in the next release.
Can I edit my own css from the settings page?
I’m sorry you can’t, wait for the next release 
Screenshots
1. Setting page and Vertical Drop Right preview.
2. Setting page and Vertical Drop Left preview.
3. Setting page and Horizontal preview.
Changelog
July 01, 2009 version 1.0.1
* Add Child of as dropdown select.
* Live preview from plugin setting page.
* Code improvement
June, 2009 version 1.0.0
* Add admin settings
* No need to add template argument, all go to setting area.
* Add Vertical Drop Left and Vertical Drop Right
January, 2009 version 0.0.1
* Only display Horizontal style
* First release
Download
Question and feedback are welcome
Post updated: August 13, 2009
Next Release’s Features:
1. Added menu for page
2. Added ability to select theme for menu
3. Added ability to change the category title (“View all posts filed under …”)
4. User friendly help, using tooltips.
5. Cleaner output.
6. Fixed some IE problems
Still in my head:
1. Add menu for blogroll.
2. Add ability to edit CSS directly.
3. Add ability to create custom menu.
Incoming search terms:
See Also
Tags: Plugins
Related Search:
wordpress vertical menu plugin, wordpress menu plugin, spry wordpress, WP Spry Menu, wordpress spry, spryassets blank menu line, spry theme, plugin edit menu di wordpress, wordpress vertical menu, wordpress spry menu, spry menu bar arabic vertical, how to fix the width of the WP spry menu, spry menu wordpress list pages, word press change "view all posts filed under" in menu, spry menü template, limit horizontal menu wordpress vertical menu, spry widgets wordpress, turn off wp_list_categories title tip, style a:visited for spry menu, spry with wordpress,
Musisi Indonesia, Dangdutize Your Song!
Last updated: Wed, 1 Jul 2009
Wordpress Spry Menu Plugins
Waks.. master yang satu ini, makin cangih ajah
I tried your plugin. It looks very promising and I thought I can use it to generate a horizontal drop down menu for my pages. Unfortunately, it only supports posts. Please can you add support for pages as well?
Thanks!
yes, I am working on it. on next release it will be able to create page menu. so wait patiently.
thanks for using my plugin
Keren bener ini themes
haahah, thx, theme blom siap :d
i’m having trouble with the way this displays in IE7. with the vertical menu-right, there’s a 1px top border before each menu link. i’m sure it’s a bug in IE because it’s fine in FF. any ideas?
as my previous commented noted, i was having trouble with a 1px, grey top-border showing in the menu and submenu of IE7. this occurred if i did a fresh install, no changes. i couldnt resolve this.
i then tried applying a transparent background by editing the spry CSS files. particularly, removing the background-color declaration for ul.MenuBarVertical a, ul.MenuBarHorizontal a in style.css.php.
in FF, it displayed perfectly. the submenu link had a transparent background and when you hovered, it would display the proper hover bgcolor and text.
in IE, it would hover correctly but the links themselves gave a “false” result and all you saw was an iframe with a white background.
so i found this – http://www.webproworld.com/web-programming-discussion-forum/63523-ie7-doesnt-display-spry-dropdown-properly.html#post341084
followed the directions of commenting out these lines in the .js file –
Goto Line 163 – add /* to the beginning
Goto Line 171 – add */ to the end
Goto Line 178 – add /* to the beginning
Goto Line 182 – add */ to the end
i then tested it in IE7 and FF and now, the menu and submenu links have a transparent background.
not sure if you can integrate this at some point and if you want to see what it looks like, email me.
thanks kimmy, i am using spry library as is and do not modify at all…
could you gimme an example result after editing the js file?
theme nya whaduh.. bikin deg-degan…
does the css editable on admin?
hai bro, plugin ini cuman untuk categories aja yah? untuk pages gimana caranya?? thx!
I have activated the plugin BUT:-
Which templates would I place:
.
I placed mine in the text widget.
I can’t find the WP Spry Menu options in my Wordpress Admin (plugin is activated). Where is it?
T.
the WP Spry Menu Options is located under Settings menu on your dashboard… or this url
your-wp.com/wp-admin/options-general.php?page=wpspryoptions
no no, do not place the code in the text widget, a php code wont work from there.
please paste it in your template….
Thanks for the help Admin. Is it possible to install 2 menus?
thanks for using my plugin,
but sorry you’re unable to install 2 menus at same page…
Hello Admin
is it possible to change the size of the drop-down menu in order to have the full category name in 1 line and not split on 3 lines when it is longer?
many thanks for your help
@christophe,
please edit width property in your SpryAssets/SpryMenuBarHorizontal.css
at line
ul.MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 10em;
position: absolute;
left: -1000em;
and this
ul.MenuBarHorizontal ul li
{
width: 10em;
}
note: you have to enter the same value for both
thanks
I’d like to change the width of the buttons to accomodate more subcategories…once I’m 2-3 deep my menu items are off the page…any tips on how to style the button sizes? Thanks!
@andy,
please refer to my reply for Christophe,
to change the width of sub menu…
additionally, please edit this line in the same file…
ul.MenuBarHorizontal a
{
display: block;
cursor: pointer;
padding: 0.5em 0.75em;
text-decoration: none;
}
look at the padding value, and change it.
Looks like this has great possibilities. I agree with those asking for a menu that works for pages. I have many clients wanting to display pages in a drop down menu, few who need it for posts. As it is, it is not too useful for me yet.
@Jim Camomile, thanks for your comment and idea,
just wait in a couple of days, some requested features will be added to the plugin.
NB: post updated
@admin, thanks a lot for your help
I’ve been wondering where to put,
Does it go in which template??? Where through the editor in Wordpress? Does it go in default.css or or anther file?
Thank you,
Brad
@Brad, just put the code provided in your template file means that you have to paste it in where you wish the menu should appears. eg. in your header.php or sidebar.php. you have to know a basic php and html skill to do that.
Hi again. it’s been two months and I am waiting patiently. Is there any news regarding support for pages?
Thanks
Sorry – very much a newbie here. RE: installation of this plug in. What does this mean?
3. Place “ in your templates
Which template? Does the code go at the beginning of the template or at the end of the template?
@Jeanette, sorry, i mean theme..
do you have a tutorial for the wp spry menu options?
@aloislarc, which option do you want to ask?…
I have some problem’s! It seems to work great in FF! But in the IE it messed up, because it uses font color and hover color from my wordpress theme, not from my Spry menu them…
@hello, which theme you’re using?
Unfortunatelly I found several bugs on IE 6, there are gaps among menu items on the sub menus.
This occured because i don’t set the css background property for
ul.children liTo fix this, please add background properties in the ul.children li (line 48, style.css).
so it would become
ul.children li {
border:none;
width: 15em;
background: #828282;
the background value must be identical with ul.children li a (see line, 57)…
However this issue was added to my To do list.
Sorry in which style file, wordpress theme or spry menu?
in spry theme..
So it fixed sub menu color, but not parent categories colors
Hello, Congratulations for this plugin and thanks for sharing.
I have a question, need to order the categories from my own ID.
In your plugin, sort by ID or name or Slug, etc., ASC, example: 1,2,3,4,5,6 .. n.
But I need to sort my way, something like this: 5,3,8,2,4 .. n
this can be done?
Thank you very much.
Greetings from Arg!
@Gabo,
thanks for trying WP Spry Menu.
Since this plugin use built in wordpress function
wp_list_categories()to retrieve categories, we’re limited to use available arguments from wp_list_categories (see: codex.wordpress.org/Template_Tags/wp_list_categories)However it’s still possible to do what you want by adding and changing some lines in the plugin,
e.g. execute some SQL query with custom ORDER BY..
but i’m not sure whether it will affect to the performance or not.
yeah, your question become a suggestion to me…
Im starting to think that the problem with colors in IE 6 is because of my style.css
Can you see, mby change smt?
/* Hyperlinks
———————————————————————————————- */
a:link, a:visited {color:#4D92CF;}
a:hover {text-decoration:underline;}
.post-cat a, .post-comments a {color:#ccc;}
.pagenavi a:link, .pagenavi a:visited {font-size:.85em;}
#credit a:link, #credit a:visited {}
/* Headers and typhography
———————————————————————————————- */
h1 {font:2.8em Georgia,Garamond,serif;display:inline;width:704px;float:left;margin:10px 0 0 10px;}
h1 a:link,h1 a:visited {color:#ccc;} h1 a:hover {color:#ffffff;text-decoration:none;}
h2 {font:normal 1.5em “trebuchet ms”, garamond, lucida grande, serif;padding-bottom:3px;margin-bottom:1px;border-bottom:double #2a2a2a;}
h2 a:link,h2 a:visited {color:#aaa;} h2 a:hover {color:#eee;text-decoration:none;}
h2#sinposttitle {color:#eee;}
#sidebar h2 {color:#9dc21c;font:bold 1.1em verdana, helvetica;margin-top:10px; margin-bottom:3px;}
h3 {color:#628f8d; font-size:1em;}
h5{font: bold .9em arial, helvetica, verdana, serif;margin:6px 0 5px 17px;background: url(img/bg/rss.png) no-repeat left center;padding:2px 0 0 20px;letter-spacing:1px;}
h5 a:link,h5 a:visited{color:#ffa73b;} h5 a:hover{color:#ffffff;}
Ok, i need to integrate this in style.css of your spry theme:
a:link, a:visited {color:#4D92CF;}
how?
Hi,
I put the code in php header near the bottom which likely means it needs to go higher but the menu doesn’t drop…sorry I am new at this so it could be something quite obvious I used Brain Help as the parent with TBI and memory as the children….Thanks
@Hello,
Do not use `a:link` and `a:visited` together if they have same color. Use only `a` instead.
@whiplash 101,
I don’t know what do you mean with “menu doesn’t drop”, of course it will drop only when you have at least one category under another category.
where and how should i put those in glowgreen/style.css
@Hello,
Firstly, you need to change
a:link, a:visited {color:#4D92CF;}becomea {color:#4D92CF;}in your Wordpress Theme style.css.Then change
ul.MenuBarVertical a, ul.MenuBarHorizontal a, ul.MenuBarHorizontal li.MenuBarItemIE, ul.MenuBarVertical li.MenuBarItemIE {
color: #000; /* text color in normal */
}
to
ul.MenuBarVertical a, ul.MenuBarHorizontal a, ul.MenuBarHorizontal li.MenuBarItemIE, ul.MenuBarVertical li.MenuBarItemIE {
color: #4D92CF; /* text color in normal */
}
in style.css under glowgreen directory.
I did that already in categories making memory and tbi children of brain help. I then repeated the process in Spry menu. Is there another way to do this?
Thank you very much, that’s fixed the problem in IE 6.
Question/
How to make title not to appear (read all posts in this category)
all the links from the menu start with mywebsite.xx/Category/xxx1/xxx2… can i delate “Category” to have only mywebsite.xx/xxx1/xxx2 ?
@Eric, you can remove ‘category base’ slug by installing additional plugin.
I found this http://www.smartblogtips.com/how-to-remove-category-base-from-wordpress-permalinks/
I never try it, though.
This is a great plugin. Is it possible to also allow the menu to list pages?
@Joe,
thanks Joe,
i know it’s possible to use this plugin to list pages, but at this time it’s only support for category..
Hi there
Thanks for this awesome plugin. I was looking for a CSS menu for categories, but now my search ends here. Would be good if you can add a CSS generator for developers? But I managed to find the code anyway, to styled to my own design.
Too easy, thanks again.
CHEERS
@Danny,
Thanks Danny
It’s too easy to style your own design, just duplicate one of available themes on this plugin directory and edit it.
It would automatically recognized and selectable from admin setting since you do not rename style.css file.
If you have any questions or suggestions after using this plugin, it will be much appreciated.
Hi, please tell me how to disable title appearance when mouse hover on category name?
@Groove,
Just empty Category Title field in the option page, it will leave Category Name as Category Title.
Or, do you want to remove category title at all? doing so is not good though…
because the link title tells your visitor whether a link is working or not.
In case you’re curious, please remove or comment this line in wp-spry-menu.php- (.*?)View all posts filed under(.*?)< \/a>/’, ‘
- $2′. get_option(‘cattitle’) .’$3′, $output);
$output = preg_replace (‘/
For my problem with links, i finally use “Advanced Permalinks”.
####
another problem ^^:
I always used FF and it works great but now when i use IE, i see that the menu is at a wrong place.
Thx for everything you do
@Eric,
I have taken a look at your website, the menu dropped to the footer, right?
It seems that the menu width does not fit with your sidebar width,
Solution, please paste the following css hack somewhere inside your <head> and </head> tag.
<style type="text/css">* ul.MenuBarVertical {
width: 14em;
}
</style>
It’s recommended that you place it just before </head> tag to ensure it will be loaded after all other css are loaded.
The menu is in the header.php, at the end.
With FF, it works for horizontal & vertical.
With IE, it works for horizontal but in vertical, it looks like my menu was in footer ^^.
Thx it is perfect now
how to make menu width in horizontal flexible, so if you view site in 640-480 or 1680-1240 etc you will get flexible width. Because on the different monitors the width will not look the same…
@Hello, the width is depend on the number of category item…
to make menu looks flexible to the monitor resolution, please wrap the menu with a div that has same background with menu.
Why do i get this message trying to instal the plug-in?
Fatal error: Cannot redeclare is_ie() (previously declared in /home3/prospiri/public_html/wp-content/themes/WhiteHousePro/includes/functions/theme_functions.php:14) in /home3/prospiri/public_html/wp-content/plugins/wp-spry-menu/wp-spry-menu.php on line 97
@Francois,
I’m sorry for the late reply to your comment,
the error suspected that there’s another function named is_ie() already declared, might be by another plugin…
if it’s true, try to rename (replace) is_ie() function in wp-spry-menu.php file… to another term, e.g. spry_is_ie() etc.
it would better you done it using search and replace with your favorite code editor.
Hi mate, do you think it is possible for me to use this menu on my testing site? centro247.com/news247….I have installed the plugin but the template got ‘buggered’ and broken, so I had to uninstall it…I really need this dropdown thing or dropline menu. This site is not public yet I am testing it. I will be grateful if you can help. Thanks
@James, this plugin is suitable for news publishing website (see in action: hariansumutpos.com)…
show me the screenshot of your template that got buggered and broken…
Great plugin. Is there a hack to make it run pages instead of categories?
@William Muncrief,
Thanks if you like this plugin
Yes, it’s possible to apply it to pages (see sidebar of this site in Pages section) with litle hack…
<ul id="wp_spry_menu_page" class="MenuBarVertical"><?php wp_list_pages('title_li='); ?>
</ul>
<script type="text/javascript">
<!--
var wp_spry_menu = new Spry.Widget.MenuBar("wp_spry_menu_page");
//-->
</script>
Great work. Is there a tweak to make it do pages instead?
How to limit the menu like wp_list_categories ?
wp_list_categories(‘title_li=&number=7′);
btw, pluginsnya keren bro…
@Sastro, this plugin is actually identical with wp_list_categories() function, so it accepts all wp_list_categories() arguments.
Since I didn’t add option for number of categories to be displayed, you can manually add argument when calling the function…
< ?php if ( function_exists('wp_spry_menu') )wp_spry_menu('number=7');?>
Thanks bro..
I need to manualy sort the category, so i’m using Category Order plugin but Spry Menu replace the order from Category Order plugin. Can you help me ?
@Stephen, I’m so sorry but this plugin does not support manual category order yet
Hi, the vertical menu is exactly what I want, but for the flyout parts it doesn’t extend over the main content – it just shows up in the sidebar, so it doesn’t look like the preview. Any ideas for how I could get it to fly out over the content of the blog? Thanks!
@charlene, please gimme a demo link or screenshot of your blog after installing this plugin. thanks
I was just wondering if you can fix the height of the menu boxes. I have a category called “brands” and i have around 100 so when it opens vertically to the right, it doesn’t scroll down. Can you help me with that.
I cant seem to make the exclude option work. in my website i am trying to not show the “marques de parfums” category and i wrote it to the exclude box on dashboard but its still showing….pls help.