I was able to figure this out in the previous version of Atahualpa, but I'm stumped on this version. I love the way the layout shows the page links on the top of the header. I wanted to use the same style, but instead of page links, provide links to other things (ie: Twitter page, Facebook profile, etc.). I was able to update the header.php file with this before, but I'm unable to figure it out this time. Any help would be greatly appreciated.

Thanks!

In header.php, find

PHP Code:

         <?php bfa_header_config($bfa_ata_configure_header); ?>

and before or after it put this

PHP Code:

 <div id="menu1"><ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li class="rMenu-expand"><a href="link">Link with sub menu</a>
 <ul class="rMenu-ver">
    <li><a href="link">Sub menu item 1</a></li>
    <li><a href="link">Sub menu item 2</a></li>
</ul>
</li>
<li><a href="link">Link Text</a></li>
</ul></div> 


This example has second level items, too. Too remove them, remove this part of the code:

PHP Code:

<li class="rMenu-expand"><a href="link">Link with sub menu</a>
 <ul class="rMenu-ver">
    <li><a href="link">Sub menu item 1</a></li>
    <li><a href="link">Sub menu item 2</a></li>
</ul>
</li> 


Finally, still in header.php, find

PHP Code:

 <?php if (strpos($bfa_ata_configure_header,'pages')!==FALSE) { ?>sfHover( 'rmenu2' );<?php } ?>

and replace with

PHP Code:

 <?php # if (strpos($bfa_ata_configure_header,'pages')!==FALSE) { ?>sfHover( 'rmenu2' );<?php # } ?>
sfHover( 'rmenu2' );

After you implemented this, don't use the page menu bar (%pages) anymore in Atahualpa Theme Options -> Header. Using both the page menu bar and this custom link menu bar at the same time will cause errors in IE6 and maybe other browsers too.

Wow. Thanks for the quick response. I'm most of the way there. I was able to find and add in the code you suggested. Is there a way to have it appear like the links to the pages do in one of the bars in the header?

Originally Posted by Flynn

[/php]Finally, still in header.php, find

PHP Code:

 <?php if (strpos($bfa_ata_configure_header,'pages')!==FALSE) { ?>sfHover( 'rmenu2' );<?php } ?>

and replace with

PHP Code:

 <?php # if (strpos($bfa_ata_configure_header,'pages')!==FALSE) { ?>sfHover( 'rmenu2' );<?php # } ?>
sfHover( 'rmenu2' );

After you implemented this, don't use the page menu bar (%pages) anymore in Atahualpa Theme Options -> Header. Using both the page menu bar and this custom link menu bar at the same time will cause errors in IE6 and maybe other browsers too.

Thanks again, Flynn. I was able to do the first part, but this part is holding me up. It seems that I can almost get it to work with the %pages listed in the Theme Options, but that's the opposite of what you suggested. Right now the links come up fine and in the correct format, but below them the pages will come up. If I take out the %pages, I get a regular, un-styled vertical list of links instead of the horizontal list.

Update: This post is for Atahualpa up to version 3.1.7.
Atahualpa up to 3.1.7: Use Post #2 + Post #5 (this post)
Atahualpa 3.1.8 and newer: Use Post #2 + Post #10 (see below)

Doh - I forgot one setting. In style.css.php, find

PHP Code:

<?php if (strpos($bfa_ata_configure_header,'%pages')!==false OR strpos($bfa_ata_configure_header,'%cats')!==false) { ?>

and replace with

PHP Code:

<?php # if (strpos($bfa_ata_configure_header,'%pages')!==false OR strpos($bfa_ata_configure_header,'%cats')!==false) { ?>

Still in style.css.php, find

PHP Code:

<?php } ?>


/* ------------------------------------------------------------------
---------- HACKS: Clearfix & others ---------------------------------
------------------------------------------------------------------ */

and replace with

PHP Code:

<?php # } ?>


/* ------------------------------------------------------------------
---------- HACKS: Clearfix & others ---------------------------------
------------------------------------------------------------------ */

Thank you so much! That fixed it. Thank you very much for your help with this. I really appreciate it. I'll be donating shortly.

I wonder if I am doing something wrong with this code, because my menu bar (the one mentioned above) comes up fine...looks & works great...but it is showing at the end of the header just above the first post. I want it to be above my header image, where I would have the pages menu show. How can I adjust this?

Thanks.

Have you put the code from post #2 before or after

PHP Code:

<?php bfa_header_config($bfa_ata_configure_header); ?>

And if you're referring to the default page and category menu bars, their order can be re-arranged at Atahualpa Theme Options -> Header -> Configure Header Area

Thanks. I see where I went wrong with the placement, and now it is at the top. I do have two more questions and I promise to go away

1). I have it at the top, but how can I position it to be below the logo bar and above the image bar? I am trying to play with that without success.
2). I can't get it to work without the %pages in the theme options. If I take that away, the formatting for the new menu bar goes away. I can not find the style.css.php file, to insert that code, but I did find one of the lines of code you mention I should edit in header.php. Should I be making changes there? Perhaps I am working in a different version of the blog. I think I have the newest 3.1.9, but those last edits of code you mention escape me because I can't find that style.css.php file in my directory.

Sorry to throw these out there, but this is the last tweaky thing I want to get wrapped up. I appreciate the past help...and any future. I'm sending a small donation, cause you have been a great help!

You're right, the above does not apply to version 3.1.8 and newer as in 3.1.8 the dynamic CSS was moved from style.css.php to header.php. You should have no style.css.php file anymore in 3.1.8 and newer.

Instead of the changes in post #5 in this thread, do these changes for Atahualpa version 3.1.8 and newer.

In header.php, find:

PHP Code:

<?php if (strpos($bfa_ata_configure_header,'%pages')!==false OR strpos($bfa_ata_configure_header,'%cats')!==false) { ?>

and replace with:

PHP Code:

<?php # if (strpos($bfa_ata_configure_header,'%pages')!==false OR strpos($bfa_ata_configure_header,'%cats')!==false) { ?>

Still in header.php, find:

PHP Code:

<?php } ?>    
<?php echo $bfa_ata_html_inserts_css; ?>

and replace with:

PHP Code:

<?php # } ?>    
<?php echo $bfa_ata_html_inserts_css; ?>

Originally Posted by Masselyn

1). I have it at the top, but how can I position it to be below the logo bar and above the image bar? I am trying to play with that without success.

As for putting it between two default header items, the solution for this would be completely different. The

PHP Code:

<?php bfa_header_config($bfa_ata_configure_header); ?>

part contains all default header items as configured at Atahualpa Theme Options -> Header -> Configure Header Area

To put something in between those default items, changes would have to be made to functions/bfa_header_config.php.

Like in the examples above one of the two existing menu bars, %cats or %pages would have to sacrificed if you want to use one of them for arbitrary links. To use the page menu bar for this, find, in bfa_header_config.php:

PHP Code:

// Page Menu Bar 
$page_menu_bar = '<div id="menu1"><div class="clearfix rMenu-center"><ul id="rmenu2" class="clearfix rMenu-hor rMenu">' . "\n";
if ($bfa_ata_home_page_menu_bar != '') {
    $page_menu_bar .= '<li class="page_item';
    if (function_exists('is_front_page')) {
        if (is_front_page() OR is_home()) { $page_menu_bar .= ' current_page_item';
        }} elseif (is_home()) { $page_menu_bar .= ' current_page_item';    }
$page_menu_bar .= '"><a href="' . get_option('home') . '/" title="' . get_option('blogname') . '">' . 
$bfa_ata_home_page_menu_bar . '</a></li>' . "\n";    
}    
if ($bfa_ata_levels_page_menu_bar == "") {$bfa_ata_levels_page_menu_bar = 0; }    
$page_menu_bar .= bfa_hor_pages($bfa_ata_sorting_page_menu_bar, $bfa_ata_levels_page_menu_bar, $bfa_ata_titles_page_menu_bar, $bfa_ata_exclude_page_menu_bar);
$page_menu_bar .= '</ul></div></div>' . "\n";
// END of Page Menu Bar 


and change to

PHP Code:

// Page Menu Bar 
$page_menu_bar = '<div id="menu1"><div class="clearfix rMenu-center"><ul id="rmenu2" class="clearfix rMenu-hor rMenu">' . "\n";
#if ($bfa_ata_home_page_menu_bar != '') {
#    $page_menu_bar .= '<li class="page_item';
#   if (function_exists('is_front_page')) {
#        if (is_front_page() OR is_home()) { $page_menu_bar .= ' current_page_item';
#        }} elseif (is_home()) { $page_menu_bar .= ' current_page_item';    }
#$page_menu_bar .= '"><a href="' . get_option('home') . '/" title="' . get_option('blogname') . '">' . 
#$bfa_ata_home_page_menu_bar . '</a></li>' . "\n";    
#}    
#if ($bfa_ata_levels_page_menu_bar == "") {$bfa_ata_levels_page_menu_bar = 0; }    
#$page_menu_bar .= bfa_hor_pages($bfa_ata_sorting_page_menu_bar, $bfa_ata_levels_page_menu_bar, $bfa_ata_titles_page_menu_bar, $bfa_ata_exclude_page_menu_bar);

$page_menu_bar .= '
<li><a href="link">Link 1</a></li>
<li><a href="link">Link 2</a></li>
<li><a href="link">Link 3</a></li>
<li><a href="link">Link 4</a></li>
';
$page_menu_bar .= '</ul></div></div>' . "\n";
// END of Page Menu Bar 


Do only the changes in this post and NOT the other changes in this thread. Now you can use, position and style the page menu bar %pages at the menu tabs "Page Menu Bar" and "Header" -> "Configure Header Area"

To do the same for the category menu bar instead, in bfa_header_config.php, find:

PHP Code:

// Category Menu Bar 
$cat_menu_bar = '<div id="menu2"><ul id="rmenu" class="clearfix rMenu-hor rMenu">' . "\n";
if ($bfa_ata_home_cat_menu_bar != '') {
    $cat_menu_bar .= '<li class="cat-item';
    if (function_exists('is_front_page')) {
        if (is_front_page() OR is_home()) { $cat_menu_bar .= ' current-cat';
        }} elseif (is_home()) { $cat_menu_bar .= ' current-cat';    }
$cat_menu_bar .= '"><a href="' . get_option('home') . '/" title="' . get_option('blogname') . '">' . 
$bfa_ata_home_cat_menu_bar . '</a></li>' . "\n";    
}    
if ($bfa_ata_levels_cat_menu_bar == "") {$bfa_ata_levels_cat_menu_bar = 0; }    
$cat_menu_bar .= bfa_hor_cats($bfa_ata_sorting_cat_menu_bar, $bfa_ata_levels_cat_menu_bar, $bfa_ata_titles_cat_menu_bar, $bfa_ata_exclude_cat_menu_bar);
$cat_menu_bar .= '</ul></div>' . "\n";
// END of Category Menu Bar 


and change to:

PHP Code:

// Category Menu Bar 
$cat_menu_bar = '<div id="menu2"><ul id="rmenu" class="clearfix rMenu-hor rMenu">' . "\n";
#if ($bfa_ata_home_cat_menu_bar != '') {
#    $cat_menu_bar .= '<li class="cat-item';
#    if (function_exists('is_front_page')) {
#        if (is_front_page() OR is_home()) { $cat_menu_bar .= ' current-cat';
#        }} elseif (is_home()) { $cat_menu_bar .= ' current-cat';    }
#$cat_menu_bar .= '"><a href="' . get_option('home') . '/" title="' . get_option('blogname') . '">' . 
#$bfa_ata_home_cat_menu_bar . '</a></li>' . "\n";    
#}    
#if ($bfa_ata_levels_cat_menu_bar == "") {$bfa_ata_levels_cat_menu_bar = 0; }    
#$cat_menu_bar .= bfa_hor_cats($bfa_ata_sorting_cat_menu_bar, $bfa_ata_levels_cat_menu_bar, $bfa_ata_titles_cat_menu_bar, $bfa_ata_exclude_cat_menu_bar);

$cat_menu_bar .= '
<li><a href="link">Link 1</a></li>
<li><a href="link">Link 2</a></li>
<li><a href="link">Link 3</a></li>
<li><a href="link">Link 4</a></li>
 ';
$cat_menu_bar .= '</ul></div>' . "\n";
// END of Category Menu Bar 


Originally Posted by Masselyn

I'm sending a small donation, cause you have been a great help!

Thank you, Masselyn.

I have used your code for the category menu bar. Everything works fine. However when i click on certain links & that page is displayed, the hover effect does not stay selected to show the current page we are on.

For example for my normal state of "menu link" colour is blue. If i hover over the links it it goes red.
If i click on the link that page should displayed, and link should stay red to show you are reading the current page.

This is how the original menu works. I tried for hours but cant get it to work.

Can you please help me.

So you're using this for internal pages, not for links to outside pages (on external websites)? Because then you could just use the page and category menu as they are?

Just to go sure that you know this: There is a whole fully functional "Category Menu Bar" that you can enable by putting %cats into Configure Header Area at Atahualpa Site Admin -> Header

If you still need it, the category li items get the following additional classes when they are current or parent of current

For the current cat

.current-cat

For the parent of the current cat

.current-cat-parent

So you would add these classes to i.e. the hover class to give it the same background color:

ul#rmenu li.current-cat a:link, 
ul#rmenu li.current-cat a:active, 
ul#rmenu li.current-cat a:hover, 
ul#rmenu li.current-cat a:visited, 
ul#rmenu li a:hover
    {
    background-color: #123456;
    color: #123456;
    }

Ha! Genius! Thanks again. Gee, I'm feeling a little sheepish at throwing another question at you...but with this method of creating a custom nav bar with links (which is working fabulously)...is there a way to make the category links work the same as they would if I went the "normal" nav bar route? Does that make sense? Basically, I would love to have a Category choice on my new nav bar, which automatically drops down the categories that are built into the WP blog. I was playing around with some code, but I am primarily an HTML designer...and though I usually can manipulate PHP pretty well...most of it still escapes me.

Originally Posted by Flynn

So you're using this for internal pages, not for links to outside pages (on external websites)?

Thanks for the reply.

I am using external links. I have tried your suggestion by creating additional class. But It does not work.
It seems like it is over ridden by the settings in Site Admin -> Header.

Basicly i am using the category menu as it is but want external links. I want the hover & active link to work like the original. In my case the hover works perfectly but the active link does not work (it goes back to default state).

Hmmm - this thread has got confusing

I'm using 3.1.9 and I want to create external links in the page menu

do I take it that I add the code in post #10 and then use the other stuff from post #2 ??

Originally Posted by Steve_T

Hmmm - this thread has got confusing

I'm using 3.1.9 and I want to create external links in the page menu

do I take it that I add the code in post #10 and then use the other stuff from post #2 ??

For Atahualpa version 3.1.8 and newer use post #2 and post #10.

I updated post #5 to make that clear.

Originally Posted by Masselyn

Ha! Genius! Thanks again. Gee, I'm feeling a little sheepish at throwing another question at you...but with this method of creating a custom nav bar with links (which is working fabulously)...is there a way to make the category links work the same as they would if I went the "normal" nav bar route? Does that make sense? Basically, I would love to have a Category choice on my new nav bar, which automatically drops down the categories that are built into the WP blog. I was playing around with some code, but I am primarily an HTML designer...and though I usually can manipulate PHP pretty well...most of it still escapes me.

Try this... not tested:

PHP Code:

 <div id="menu1"><ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li class="rMenu-expand"><a href="#">Categories</a>
 <ul class="rMenu-ver">
    <?php echo bfa_hor_cats($bfa_ata_sorting_cat_menu_bar, $bfa_ata_levels_cat_menu_bar, $bfa_ata_titles_cat_menu_bar, $bfa_ata_exclude_cat_menu_bar); ?>
</ul>
</li>
<li><a href="link">Link Text</a></li>
</ul></div>

In this example the "Categories" link would link nowhere ("#") if clicked but should drop down when hovered. Instead of "#" you could also put a hard coded link to i.e. the archives page there, if you created one.

Originally Posted by sagatr

Thanks for the reply.

I am using external links. I have tried your suggestion by creating additional class. But It does not work.
It seems like it is over ridden by the settings in Site Admin -> Header.

Basicly i am using the category menu as it is but want external links. I want the hover & active link to work like the original. In my case the hover works perfectly but the active link does not work (it goes back to default state).

Just to be sure about the difference between "active" and "current".

"Current" would not be possible with external links. Web site A would not know that you're on page X of web site B. That would require Javascript and tricky cookie settings, probably with a third domain/subdomain to handle the cookies for both domains.

"Active" should work, but I am not sure how persistent that "active" highlighting is:

 ul#rmenu li.current-cat a:link, 
ul#rmenu li.current-cat a:active, 
ul#rmenu li.current-cat a:hover, 
ul#rmenu li.current-cat a:visited, 
ul#rmenu li a:hover,
ul#rmenu li a:active
    {
    background-color: #123456;
    color: #123456;
}

I've added ul#rmenu li a:active to the earlier example from this thread.

unfortunately the above code does not work. Where are you placing the code in : themes/atahualpa/style.css

Originally Posted by sagatr

unfortunately the above code does not work. Where are you placing the code in : themes/atahualpa/style.css

You would put that into HTML/CSS Inserts -> CSS Inserts

The order CSS is being processed is style.css -> Theme Options (header.php) -> CSS Inserts (header.php bottom)

Originally Posted by Flynn

Try this... not tested:

PHP Code:

 <div id="menu1"><ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li><a href="link">Link Text</a></li>
<li class="rMenu-expand"><a href="#">Categories</a>
 <ul class="rMenu-ver">
    <?php echo bfa_hor_cats($bfa_ata_sorting_cat_menu_bar, $bfa_ata_levels_cat_menu_bar, $bfa_ata_titles_cat_menu_bar, $bfa_ata_exclude_cat_menu_bar); ?>
</ul>
</li>
<li><a href="link">Link Text</a></li>
</ul></div>

In this example the "Categories" link would link nowhere ("#") if clicked but should drop down when hovered. Instead of "#" you could also put a hard coded link to i.e. the archives page there, if you created one.

Thanks for the quick reply, but the categories are no longer dropping. Or, rather the menu is no longer dropping. I have the arrows, showing that it "thinks" it should be showing me sub-menus...but nothing happens. Any other thoughts?

Originally Posted by Masselyn

Thanks for the quick reply, but the categories are no longer dropping. Or, rather the menu is no longer dropping. I have the arrows, showing that it "thinks" it should be showing me sub-menus...but nothing happens. Any other thoughts?

Can you post or PM a URL, that'll make it much easier for me

Originally Posted by Flynn

Can you post or PM a URL, that'll make it much easier for me

Sure...the temp location for this blog, as I work on it, is www.masselyn.com/mikifoto Right now I had just copied/pasted the code you gave me...so the links are generic at the moment. Hope that helps, and if you need more information or for me to change something...just let me know.



Thanks SO much!