Forums

Footer Nav Bar??

Permalink 1 user found helpful
I have redesigned the plain yogurt theme - visually. Other than the CSS the backend code (header.php / footer.php) have stayed the same.

I want to create a footer nav bar of just the top page (no children) in the sitemap that would have an image behind it.

It is driving me crazy. I have attempted to use auto-nav, but can't get it to go to the footer.

I have also attempted to do this with a custom auto nav block, but it does not show up at the footer hovering above a footer image I created.

I tried what is in this article:

http://www.concrete5.org/index.php?cID=68337...

But that didn't really solve my problem.

The site is being developed, but it is:

http://bigeastlabs.com/new/

Note in the footer the site name, etc. I figure I have to change something in the footer.php but have not been able to (successfully) make that change correctly.

Any help would be greatly appreciated.
globalnerds
 
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
In your footer.php file, depending on where you want it, copy / paste the following code. It will auto-create only the top-level pages of your site. 

<div class="navigation">
   <?php 
   $bt = BlockType::getByHandle('autonav');
   $bt->controller->displayPages = 'top';
   $bt->controller->orderBy = 'display_asc';                    
   $bt->controller->displaySubPages = 'none'; 
   $bt->controller->displaySubPageLevels = 'custom';
   $bt->controller->displaySubPageLevelsNum = '1';                   
   $bt->render('templates/main_menu');
   ?>
</div>


I hope this helps?
globalnerds replied on at Permalink Reply
globalnerds
That helped... mostly. It is showing the nav, but it is vertical instead of horizontal Ideas?

Take a look:

http://bigeastlabs.com/new/
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
From there, it all depends on what you're trying to accomplish. In the css file for your theme, you'll need to add some styling.

Add the following code below to your theme's main css file (main.css). This will at least make it horizontal, to give you a starting point: 

.navigation ul.nav { list-style: none; }
.navigation ul.nav li { display: inline; padding: 8px; }
.navigation ul.nav li a { text-decoration: none; display: block; }


Generally, most themes have built-in styling for navigation menus. Let me know if you got it to work.
globalnerds replied on at Permalink Reply
globalnerds
Sorry, no it didn't work, it is still showing up vertical.
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Sorry, forgot to mention that ".navigation ul.nav" needs to also have "display: inline;".
globalnerds replied on at Permalink Reply
globalnerds
Here is the entire css piece that worked.

.navigation ul.nav { list-style: none; display: inline;}
.navigation ul.nav li { display: inline; padding: 8px; }
.navigation ul.nav li a { text-decoration: none; display: inline; }


Thank you so much! This was driving me crazy!