TransMenu
Creates a nice looking animated drop down menu for listing your pages and subpages (and more in the future)
Cria um menu dropdown animado bonitão que lista suas páginas e subpáginas (e mais coisas no futuro)
OBS: All credits to this menu should go to:
OBS: Todos os créditos para este menu deve ir para:
* TransMenu
* March, 2003
*
* Customizable multi-level animated DHTML menus with transparency.
*
* Copyright 2003-2004, Aaron Boodman (www.youngpup.net)
All I did was to put it to work on wordpress
== Instalação / Installation ==
. Faça o download do arquivo
. Descompacte a pasta transMenu inteira no diretório “plugins” do seu wordpress
. Acesse o Painel de Administração > Plugins e ative o plugin.
. Cole o código < ?php trans_list_pages('exclude=&sort_column=menu_order&title_li=' ); ?> onde você quiser que seu menu apareça no seu tema (note que o padrão é uma lista horizontal)
. Cole o código < ?php trans_add_menus(); ?> logo antes da tag “/body” no arquivo footer.php do seu tema
. Download the package
. Extract the transMenu folder to the “plugins” folder of your wordpress
. In the Admin Panes go to “Plugins” and activate it
. Paste the code < ?php trans_list_pages('exclude=&sort_column=menu_order&title_li=' ); ?> wherever you want your menu to be displayed in your theme (notice its a horizontal list by default)
. Paste the code < ?php trans_add_menus(); ?> just before the “/body” tag on you footer.php file of your theme (or in wichever file it is).
Veja ele em ação / See it in action
Hi! Very nice job as a whole, but I found some things that look a bit buggy:
Quite important, the plugin doesn’t respect private or draft pages (it shows them in the menu). I’m using WordPress 2.2.1
A matter of css styles, the plugin doesn’t define any style for the links, and MSIE 6 is quite annoying about inheritance and a.hover.
Not very important, but I had the menu set text-align:right, I had three links in a horizontal fashion and the menu for the third one showed under the first one.
Thank you for your excellent work
Alejandro
Hey, great plugin!
I know the default is horizontal; how would I go about making it vertical?
thanks in advance.
Keep up the good work.
Hi issy,
I think it should not be very difficult, cause the javascript is ready for it. On transmenu.php you can see this line:
var ms = new TransMenuSet(TransMenu.direction.down, 1, 0, TransMenu.reference.bottomLeft);
Try changinf direction.down to direction.right … I think its a good start.. Have a look also at the .js file.
If you want to make it as an option for the plugin it woul be really great…
cheers
Leo,,
Hi
Great plugin, thanks. Using this on Wordpress MU by the way.
Any way to get the submenu items to respect page order set when posting the page?
At the moment the subpage menu orderit is defaulting to alphabetical order (it seems).
I’d like a specific
Great work
hi Rob,
nice to know its working on WPMu as well.. can I see it?
You can change the arguments that are passed when you call trans_list_pages() function. Where you read “sort_column=menu_order” you can change to “sort_column=ID” or whatever column you want…
Since this function is a modified version of wp_list_pages, you can use any arguments it gets. Here you have a detailed descriptions of all possible arguments and its values:
http://codex.wordpress.org/Template_Tags/wp_list_pages
I beleive this should work, but I am not able to test it right now. Please give us feedback if it works..
Support for CSS and IE6/7 would be very helpful
Hi,
having some problems with a bit of CSS.
I am using the Seashore. If you take a look at the theme you will notice whitespace in between the list items in the menu.
From the header.php the code for it is:
>
” title=”Home”>Home
and from style.css
#menu {
text-align:right;
padding:10px 0 0;
height:30px;
line-height:30px;
}
#menu ul {
margin: 0;
padding:0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a
{
padding:8px 16px;
text-decoration: none;
font-variant:small-caps;
font-size: 1em;
background:#778899;
border:0;
color:#eee;
}
#menu a:hover,
#menu a:active,
#menu li.current_page_item a:link,
#menu li.current_page_item a:visited,
#menu li.current_page_item a:hover,
#menu li.current_page_item a:active
{
background:#556677;
color:#eee;
border:0;
}
If you take a look at my test site you will notice that there is no white space in between the list items when I have the TransMenu plug-in running.
I tried applying changed to the CSS file for TransMenu, but nothing changed. Wondering if you could please take a look and maybe find a solution.
Ian
Hi Ian,
Unfortunatly I havent got the time nor the resources to have a look at it right now.
What I suggest to you is to use, if you dont use it yet, a firefox plugin called “Firebug”. Its awesome to inspect CSS. (thats what I meant by the resources I dont have right now… Im on someone elses computer…).
Try intalling it, clicking on Inspect, and then click on the object you want to have a look. Try to change the css on the fly and find out where the problem is…
cheers
Leo,,
New version released.
This version fixes the problem addresses by Alejandro, in wich the menus lists all pages, including Private and Drafts. Now it never shows drafts and shows private pages when you are logged in.
It also includes a class=”transmenu_page_link” to the A tags of the list of pages, so its easier to play with the css.
hope you enjoy
Leo,,
I am using your plugin but the only time I see the sub pages is on the first of every link, what I mean is this:
Say i have a nav bar with this: home, about catalog
Now in the catalog link there is a few cateogories, within those categories are sub categories. The only time i see the sub categories is in the first item of the dropdown, the rest do not show up, any tips?
hi Trevor,
just to make it clear. When you talk about categories and sub-cats, you’re actually talking about sub-pages and sub-sub-pages, right?
I dont see why it would display only the sub-sub-pages of one specific sub-page and not from the others…
Did you check if the pages are published and that they are not marked as private? Do you see any javascript errors? If so, send me the output. Do you have a link where I can see it?
Leo,,
hey leo,
Sorry i meant pages yes. Can I email you the link, its a site meant to kept private until launch and the menu is the only thing from keeping it so hehe.
There are no JS errors i see the js at the bottom of the file, it all looks good to me thats why im confused. I double checked the pages about 10 times and they are published.
Hope you can help out
Any suggestions are appreciated.
Trevor
leo, sorry i forgot to mention, I need your email in order to email you the site with the problem. if you can post your email here or email it to me: tdelam[at]gmail.com that would be helpful.
Thanks in advance,
Trevor
Thanks for very useful plugin!
But there is some strange problem: Transmenu is working on locally installed wordpress, but when I upload it to my hosting, it stops working.
I installed Firebug, it displays 2 errors:
TransMenu is not defined
if (TransMenu.isSupported()) {
and
TransMenu is not defined
initTransMenu ()
if (TransMenu.isSupported()) {
Hi Kamneed
Double check your installation and see if the folders have the same names they did locally.
Have a look at the source code of your site on the broser, and look for the lines that firebug had said they have an error. Just above, you will find something like this:
script language="javascript" src="http://www.yoursite.com/wp-content/plugins/transMenu/transmenu.js"
Check if its pointing to the right address. Its probably not, and this shoul be the configuration of the URL of your blog. Go to Options > General and check it.
Leo,,
Thanks Leo for advices!
I have resolved my problem by replacing “transMenu” to “transmenu” in transmenu.css, .js and .php files in plugin directory
So, it turned out that my hosting provider has case sensitive software =)
Be awared everyone =)
Hey there.. Wondering if you can help me out a little.. Im using Transmenu but want the sub menus to link into a target iframe. I cant figure out how to do this.. Any tips?
Cheers in advance
Darren
Hi Darren,
This is not very simple to do, because all the links are dynamic generated through javascript. You would have to find out inside transmenu.js how to do that…
Leo,,
Darren,
maybe I found it. But I cant test it now… Go to line 429 and change:
location.href = …
to
iframeName.href = …
or iframeName.location.href = ….
I dont remember right now… play with this line, because this is the place! And let me know if it works…
Leo,,
Thats where i’m struggling.. boohoo..
Thanks anyway Leo..
I’ll give that a go and let ya know.. CHeers
Kerchiing!!! It’s “iframeName.location.href ” You are a Java God among us mere mortals.. Thanks again!!
Hi Leo
Was wondering if you are interested in updating this plugin for compatibility with IE 6 and 7 and Firefox (Win) on a for fee / consultancy basis.
As I mentioned in my previous post above I am using your plugin in a commercial project using WP MU and would like to get rid of some of the display bugs which are CSS related. (Per Trisha’s comment of 13/1/08 above also).
This is a great plugin and I would like to see it brought up to date for the benefit of WP users.
Please get in touch asap via email to discuss this proposal.
Thanks
Rob
Hai, i love your plugin very much. Then, i have a doubt on your plugin. How can i sort the sub menus by the Page Order ??? I need this information urgently bcoz i have to design a blog very soon. I hope its possible and you would help me.
Thank You !
Hi Logesh,
Have a look at this comment:
http://pirex.com.br/wordpress-plugins/transmenu/#comment-37974
Leo,,
hi, i am facing another problem in IE 6. If i place the mouse over the Parent menu containing some sub menus, the sub menu is hiding the Parent item and i can’t see the Parent menu in IE 6. How can i fix this ???
check this
http://wordpress.org/support/topic/135053
It does put my pages in numerical order, but no drop-down menu.
hi Alan,
you are right.. Thats a weakness of the pluin that should be worked out… If there is anyone willing to help, remember it is free software, you dont need to ask permission to improve it..
cheers
Leo,,
The code doesn’t validate. Usually not a problem, but might cause some of my design issues in IE. The problem is that the line tags and inside the a tags.
How can I make this validate without screwing everything up?
$output.=’ID).’” title=”‘.wp_specialchars($page->post_title).’” class=”transmenu_page_link”>’.'ID.’” ‘.$cur_element.’>’.$page->post_title.’‘;
leogermani,
great plugin that will solve many problems… unfortunately it didn’t work for me.. I do as said, paste the additional codes where said and still not working. i am using wordpress 2.3.3. could be this my problem?
I have the same problem. It not work on 2.3.3
thanks for any help
I love this plugin and I’ve successfully used it on a few sites already. Right now I am trying to restrict the depth to only parent and first level child pages. For some reason, the transMenu is not following the default “depth” argument. Here is my transMenu line:
Not really sure what I am doing wrong. Any ideas?
Thanks Leo!
Sorry, my code didn’t show up properly — here it is –
Hello,
I have a small problem with transmenu. We`ve customized it a bit to get the rounded corners and everything was working fine, but there is a problem with the placement of submenu in IE. It appears too far to the right and it`s too narrow to display all submenu text.
Is there any fix?
hi Adomas,
the easiest way is to make a css style sheet only for internet Explorer to fix its position. You can tell you blog to load this css with a tag “IF IE”. Google it and you will find
Leo,,
Loaded the script but it shows as a left justified unordered list instead of a horizontal menu as shown on the sample pages at the top of this page. I’m guessing this is due to it not being compatible with WP 2.5 so I’m wondering if you’ll be updating this script, I’d love to use it.
Stereoblind
I dont think this is a 2.5 issue.
You probably have to adjust your css. The pages are listed as a regular list_pages() tag.. So if you have a theme that already has a horizontal list of the pages at the top, its easier to place the menu there, cause it will adjust the same way the page list that comes with the theme by default.
If you theme does not have a horizontal list of pages you must create the css yourself
Leo,,
Thank you for the quick reply, Leo.
I didn’t read that tidbit in the description of the plugin. I thought you had everything needed to get the look already coded. I just use the default theme.
Do you have or could you recommend an existing CSS I could insert into the default theme or add to the plugin files?
In the meantime I’ll start looking for alternative themes just in case.
I found a horizontal menu css for the kubrick (default) theme. Two questions:
1. I found in your code where to change the background color for submenu items. Where do I change the font color for the submenu items?
2. Your script makes reference to two png’s that were not included in the add-on download, menu_grey_40.png and menu_white_90.png. May I have the specifics on these images (or links to download them)?
(Found the answer to question #1. Sorry to spam your comments.)
Hi.
Where do I have to put exactly the code:
??
I’d like to put it in the header.php, just under the headerimage, but it doesn’t work. I keep seeing the code instead of the menubar.
Sorry, I have no experience about codes…
Arianna - Please remove the space after the < in both of the codes you have to insert.
Great plugin. I have used it on another blog. Using it now in a 2.5 WordPress blog and it refuses to work. Could it be a conflict with the other javascript?
http://www.realestateblogbuilder.com/
hello. i have the theme on my website and the “transmenu” goes crazy on it. i had the same problem as Kamneed and couldn’t see anything. now the menu is displayed but looks horrible. i should change the theme’s css? f it’s complicated , forget about it, because i don’t know css. i just need a dropdown menu and this one was my favorite because it stretches to fit all the text and doesn’t split it in 2 lines, and of course the animations are great.
thank you
i meant “i have the K2- http://getk2.com theme on my website”…sorry for the huge link
rete51,
if you dont want to bother with css look for a theme with an horizintal menu at the top and test the plugin. There are many themes in wich the plugin just works at first attempt, others not. Since you dont do css, you will have to stick to those who just works
Leo,,
first: sorry my english, i speak spanish
second: great plugins, i find that for long time!!!!!!
but i have a problem with IE…. this plugins work with IE ????? because in my site work bad with IE
What can I do?
My site: http://www.kairosjuvenil.com
Hi Andrés,
Eu falo portugues. Mas vou escrever em ingles para todos poderem ler:
Yes. It works with IE. But sometimes it looks ugly. You may have to create a specific css style sheet for IE. See:
http://www.quirksmode.org/css/condcom.html
Leo,,
Hi Leo.
thank you for the great plugin.
I have the same problem as Ovidiu (http://wordpress.org/support/topic/137154), trying to use transmenu in combination with a language switcher. The output page-title should be filtered due to the chosen language .
Did you find time to go after it yet?
Gostei muito do estilo de menu gerado por este plugin, porém não consigo ativá-lo, segue o erro:
Parse error: syntax error, unexpected $end in [local do arquivo]wp-content\plugins\transmenu\transMenu.php on line 175
Não sei se estou fazendo algo errado, pois não sei programar.
Alguma ajuda pra mim?
any news here?
Hey, I’m trying to use this plugin, and would really like to do so. I’ve been looking around for ages, and this is the best I’ve found! So, firstly, thanks!
Secondly however…I cannot seem to get it working on my site.
I’ve put the code in, but it just looks like my previous menu. No drop downs, and no transMenu…
I’m using WP2.6…is this an issue?
Please help, I’m not much of a coder, and cannot figure out why this has happened.
Thanks in advance, Joss.
Hi,
Can someone help me configure this on a website I am building? I am happy to pay if I have to.
contact me on asfahaan@tasmanit.com
Thanks,
Asfahaan
Good 235rter2rwer23r
hi,
i have been trying to figure out how to install this plugin. I have added the code towards the bottom of the header file and also added the code in the footer but I still dont see anything working. the only thing i see is the code on the location where it should be working. (yes it is activated in the plugin menu).
any help would be great.. thanks!
I am having the same problem as Viv and Joss. I’ve activated the plugin and pasted the codes into my header.php and footer.php files but no drop down menu. The only subpages on my site are in the “Natural Health” parent page.
I would appreciate any assistance! If I can get this to work, this plugin is exactly what I am looking for!
Thank you for your time!
Blessings,
Jocelyn
Okay, I figured one of my problems — I had to change the plugin folder name to transMenu (with a capital “M”). Now I am getting the following error:
Fatal error: Call to undefined function: trans_list_pages() in /srv/www/virtual/homemakerinprogress.com/blog/wp-content/themes/kind-of-business/header.php on line 12
Line 12 is the line where I placed the transmenu code. So I’m not sure what’s going on.
What am I missing?
Thanks in advance for your help!
I GOT IT!
My problem was to keep the plugin directory folder name as ‘transmenu’ (lowercase ‘m’). But then I needed to change ‘transMenu’ to ‘transmenu’ in the transMenu.php file as follows:
Line 31: /wp-content/plugins/transmenu/transmenu.css
Line 32: /wp-content/plugins/transmenu/transmenu.js
HTH! And hope it makes sense. Now I need to play around with the CSS since it’s giving me different colors on my menu links.
Good afternoon,
When I paste the code in the header or footer, the code appears as misplaced HTML and is seen on the public page itself in the header and footer. I am using the Daleri Selection theme and on http://www.vancouverandbeyond.com I am using Khaki Traveller. Any hints?
Found a solution to ordering the submenus.
In the file transMenu.php, find the function ‘trans_get_pages’
In the line…
$r[’sort_column’] = ‘post_title’;
you can change ‘post_title’ to any column in the wp_post table. I changed it to the following:
$r[’sort_column’] = ‘menu_order’;
Now you can use Page Order under the Advanced Options to control the submenu order. Each submenu is ordered under its parent page. I simply numbered my parent pages 1, 2, 3, etc., and the submenu for each 11, 12, 13, etc. for parent 1, and 21, 22, 23, etc., for parent 2, and so on.