Joomla Templates Club 406,261 posts

[finetoons Friend finetoonsJoin date: June 2011Posts: 27Downloads:0Uploads:4 Thanks: 6]

#166906

Hi,
These templates are great, although I must admit I’m a little overwhelmed, and naturally I have a deadline, so I’m asking for help.

I love the mega menu.

However, there is one section of the site (about us) in which I would like to use an inline menu, or at least a submenu that appears horizontally in that section only. I can get a menu to show up on the one page, but it is vertical. I’d like to make it horizontal. Can you tell me how to do that?

Thanks

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#403807

Can you post an image of what you are trying to achieve?

[finetoons Friend finetoonsJoin date: June 2011Posts: 27Downloads:0Uploads:4 Thanks: 6]

#403815

Sure…basically, this is what I have:

This is what I’d like…
http://finetoons.com/mk1/want.png

But I’d also like to keep the mega menu
http://finetoons.com/mk1/keep.png

Thanks for looking!

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#403817

So you want to keep the mega menu and display underneath it a normal inline menu below? If that is the case we can create a new module position underneath the mega-menu and only display a menu module in there on the page of your choice.

[finetoons Friend finetoonsJoin date: June 2011Posts: 27Downloads:0Uploads:4 Thanks: 6]

#403818

That would be ideal! I just don’t know how to do it.

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#403820

On that page are you using the slideshow position? If not then we could simply use that.

Go into the module manager and create a new menu module and select the menu to the one you want. Set it to only display on the about us page and put it in the position slideshow. In the Advanced options put ” topmenu” in the “Menu Class Suffix” box making sure you put a leading space.

Save and publish that and you will have a verticle menu shown. See if you can get that far while I look into styling it as an inline menu.

[finetoons Friend finetoonsJoin date: June 2011Posts: 27Downloads:0Uploads:4 Thanks: 6]

#403822

oh I forgot about that space in the menu class box!
Any way, I’ve done exactly what you said. A vertical menu is now on the about page.

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#403824

Try adding the following css to the bottom of your templates>ja_business>css>templates.css file


.topmenu li {
float: left;
padding: 4px 10px 0 0;

}

You can add any other styling you wish in there such as font size or weight etc.

[finetoons Friend finetoonsJoin date: June 2011Posts: 27Downloads:0Uploads:4 Thanks: 6]

#403828

This did the trick in FireFox and Safari. It remains a vertical menu in chrome. I don’t have IE, so not sure how it looks there. At this point, I’d be happy with IE and Firefox.

http://www.maryknoll-laymissioners.org/maryknoll-laymissioners/index.php/who-mklm-is

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#403830

Looks OK in chrome to me. Probably some cacheing somewhere. IE is fine too. It could probably do with a little styling but I will leave that up to you.

1 user says Thank You to Phill for this useful post

1. finetoons

[Author]

Posts