Footer Menu

• 

  adventurer21 · Member · Dec 15, 2015 at 10:44 pm

  • Copy link
  • Add topic to favorites

  Hi everyone,

  I am using Fontfolio theme which does not feature footer menu, except that any secondary menu is located just below the header primary menu. I seek to relocate the secondary menu to footer level, via using CSS.

  Anyone’s quick shortcuts would be very much appreciated.

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Dec 16, 2015 at 7:56 pm

  • Copy link

  Hi there, give the following CSS a try and see what you think. Since you don’t have a secondary menu on your site, I worked this out on the Fontfolio Demo site.

  .site {
      position: relative;
  }
  #secondary-navigation {
      position: absolute;
      bottom: 70px;
      right: 0;
      text-align: right;
      width: 100%;
  }
  #content {
      padding-bottom: 100px;
  }
  .secondary-navigation li {
      width: 150px;
      text-align: left;
  }

• 

  adventurer21 · Member · Dec 16, 2015 at 8:19 pm

  • Copy link

  This code doesn’t do anything and does not specify which goes at the bottom. I already do have a secondary menu, and I’ve put it on the sidebar.

• 

  thesacredpath · Member · Dec 17, 2015 at 1:28 am

  • Copy link

  …except that any secondary menu is located just below the header primary menu. I seek to relocate the secondary menu to footer level, via using CSS.

  The code I provided relocates the secondary menu from the header area to the footer area. Sorry, I didn’t know you were talking about a Custom Menu Widget in the sidebar.

  Moving widgets from a sidebar to the footer area in a responsive designed theme such as Fontfolio never really works very cleanly and requires many, many lines of code in order to adjust things for all the different screen/window widths. Also, the Custom Menu Widget would only appear on pages where there was a sidebar. On pages where there was not, such as on your main page, you would not see the custom menu widget in the footer. That is not something we can do with CSS.

  Since I have given you the code above, and since this change works well and cleanly on Fontfolio, would you consider using the secondary menu at Appearance > Menu instead of using the Custom Menu Widget.