Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Montezuma Theme (http://forum.bytesforall.com/forumdisplay.php?f=53)

- - Menu 1 (horizontal) (http://forum.bytesforall.com/showthread.php?t=20511)

Menu 1 (horizontal)

Hi guys!

I would like to personalised my menu1 with others icons a part from the default star. I'm not be able tod do it. I have all the code and the images I want. I just putted on menu1.css but doesnt work. Any idea how to do it?

My web: www.victorfg.com

Thanks!

have you searched the forums? This has been answered.

Yes I saw some posts but I don't get the point. What am I wrong?

When I look at your menu items using Firebug, I don't see the same page IDs that you have listed in your attachment. For example, your attachment shows 186, 48, and 376 as the page IDs that you coded in your CSS file, but when I look at the menu items in Firebug, I see 187, 54, 257.

Second, the classes for the menu items appear differently than the way that you have referred to them in your CSS file. Example, I see item-?p=187&lang=en as the class ID for the Blog menu item and not page-?p=186. Is there a reason why you're not using permalinks? I think using permalinks would help in at least identifying the pages when you modify your CSS settings.

@CrouchingBruin: you got it. The CSS settings do not dynaamically change when you change your permalinks. I sent this to the developer a while ago so we will see what happens.

Thanks for the answers. I already change in menu1.css all the code as you told me @CrouchingBruin but the fact is that nothing change. I have permalinks as you can see on the picture and I have a widget to translate the web (qTranslate). So I wrote the link adding &lang=en. May I have to add three the other two languages in menu1.css once it worked?

I'm confused. I restart apache2 but doesn't work

Thanks

OK, sorry, I had to do a little more research. It looks like in the specification for CSS Class names, you can't have an ampersand (&) or a question mark (?) as part of the class name. You can get rid of the question mark by changing your permalink style (Dashboard > Settings > Permalinks), but I don't know how you'd get rid of the ampersand since it seems to be stuck on there by your language plugin.

So, here's my solution: add a new class name to each menu item using JavaScript (jQuery), then refer to that class name in your CSS file instead.

Copy & paste this code into Appearance > Montezuma Options > Head > Insert Code > Bottom:

Code:

<script>

jQuery(document).ready(function($){



  var iMenuNumber;        // a counter variable



  // Retrieve all LI items from menu1 and store them in a variable

  var menu_items = $("#menu1 li");



  // Cycle through all menu items

  for (iMenuNumber = 0; iMenuNumber < menu_items.length; ++iMenuNumber)

    {

    // Add new class name to the menu item, in the pattern Menu1Item[n]

    $(menu_items[iMenuNumber]).addClass("Menu1Item" + (iMenuNumber + 1));

    }

  

}); 

</script>

Once the document loads (is ready), this code will add the class Menu1Itemn (where n is a number from 1 to the number of menu items that you have) to each menu item in menu1.

So now, when you edit your CSS settings, instead of this:
#menu1 .item?-p=187&lang=en > a > i {...}
#menu1 .item?-p=54&lang=en > a > i {...}
#menu1 .item?-p=257&lang=en > a > i {...}

You would code this:
#menu1 .Menu1Item2 > a > i {...}
#menu1 .Menu1Item3 > a > i {...}
#menu1 .Menu1Item4 > a > i {...}

This should work even if you change the pages that your menu items link to, or if you add or subtract menu items.

For the CSS use this format

HTML Code:

#menu1 .page-xxxxxxxx > a > i                                         { background-position: 0px 0px ; }

where xxxxxxxx is the page slug

Quote:

Originally Posted by juggledad (Post 101655)

For the CSS use this format

HTML Code:

#menu1 .page-xxxxxxxx > a > i                                         { background-position: 0px 0px ; }

where xxxxxxxx is the page slug

His slug IDs look like this, though:
item-?p=54
and if he has a language selected via a plugin (i.e., English or Spanish) then it turns into
item-?p=54&lang=en
He tried
#menu1 .page-item-?p=54&lang=en > a > i
but that didn't work, I think because ? and & aren't allowed in class names.

I also tested the default permalink style on my own sandbox site. This doesn't work:
#menu1 .page-?page_id=2 > a > i

Don't use the default permalink

What version of Montezuma?

I'm using using WordPress 3.5.1. and montezuma Version 1.1.9. I'm gonna try what you told me and I'll let you know. Thanks guys!

Now it works as I want :) I have another idea running into my head. Is it possible when you changed the language automatically changed the menu language too? I guess it's possible.

Thanks for your time

Quote:

Originally Posted by vaictor (Post 101668)

Is it possible when you changed the language automatically changed the menu language too? I guess it's possible.

I think you should post that question in the support section for qTranslate. It looks like changing the menu language is a known problem with qTranslate. You could probably custom code a jQuery script that changes the menu item contents based on the language. That's really outside the scope of Montezuma, though.