Monday, May 21st

Last update05:36:30 AM GMT

Font Size

Screen

Profile

Layout

Menu Style

Cpanel
Welcome, Guest
Username Password: Remember me

Footer Menu replicating Main Menu
(1 viewing) (1) Guest
  • Page:
  • 1

TOPIC: Footer Menu replicating Main Menu

Footer Menu replicating Main Menu 12 months ago #4221

  • littleET
  • OFFLINE
  • Senior Boarder
  • Posts: 79
  • Karma: 1
Hi,

I would like to create a footer menu for a site which replicates my main menu along with showing each of its sub menus. Something like on this site . I don't want to have to manually create each main menu and its sub menus as a module.

I tried copying the mainmenu module and using List as the menu style but it just put the list in one long vertical list - what I need is for each main menu item to be in a new column.

Anyone know how to easily achieve this?

Re: Footer Menu replicating Main Menu 12 months ago #4222

  • dex
  • OFFLINE
  • Moderator
  • Posts: 779
  • Karma: 12
Off the top of my head, how about floating all the top level UL LIs left, giving them a fixed width of 20% or whatever, then setting top=0 relative to the UL?

e.g. <li style="position:relative;top=0;float:left;width="20%">
Dex Randall
Joomla! web design and production
Sydney JUG organiser + joomla.org.au site admin
www.spikesystems.com.au
www.twitter.com/dexx

Re: Footer Menu replicating Main Menu 12 months ago #4224

  • littleET
  • OFFLINE
  • Senior Boarder
  • Posts: 79
  • Karma: 1
Thanks Dex, that could work. I'll give it a try and report back.

Re: Footer Menu replicating Main Menu 12 months ago #4230

  • RicRaftis
  • OFFLINE
  • Expert Boarder
  • Posts: 146
  • Karma: 5
You may glean a solution from Joomla Bamboo's site using Firebug..
Now Retired but still interested...
Follow me on Twitter

Re: Footer Menu replicating Main Menu 12 months ago #4234

  • littleET
  • OFFLINE
  • Senior Boarder
  • Posts: 79
  • Karma: 1
dex - using CSS for ul and li etc. does the trick and will be just what I need.

RicRaftis - I checked our joomlabamboo but I think that they have created individual modules for their footer menus which are updated independant of the mainmenu as they have different headings, not all the mainmenu items are in the footer and each column has a different id name.

Re: Footer Menu replicating Main Menu 12 months ago #4237

  • normdouglas
  • OFFLINE
  • Senior Boarder
  • Posts: 50
  • Karma: 1
Just thought I would pipe in on this.

I use this technique often... here's how I do it.

Just make a copy of the Menu Module and publish it to the correct position (footer)
Then give it a different menu class suffix... and away you go.

This way you are essentially creating a duplicate of the same menu only styled differently.

Generally to get a list (don't use the legacy flat list) to lay out in a horizontal fashion you would do something like.

ul.footermenu {
list-style: none;
padding: 0;
margin: 0;
}
ul.footermenu li {
float: left;
padding: 5px 10px;
}

That's obviously just a start.

Hope this helps.
Rules for Website development:
Step 1: Backup
Step 2: Refer step 1
  • Page:
  • 1
Time to create page: 0.48 seconds
You are here: Forum