Hi there!

I'm trying to get rid of the standard text for the page links and I'm sort of half way...
I succeeded to add my own images but I'm bumping into several issues:
- i cant get the "Home" button to appear...
- I cant remove the standard text yet
- I would like to get rid 100% of the hover standard fx and repalce it by a fx of my own (iif not too complicated).

I know there are some threads about the various issues I encounter but I cant seem to find them...

Info:
WP 2.9.1
Atahualpa 3.4.5
temp url to see my issues in real time http://burn.phpnet.org/soundandbandservices2010

my CSS insert at the moment (it's late and I feel things are redundant)

/* START MENU */
div#menu1 {
background: url(http://burn.phpnet.org/soundandbandservices2010/wp-content/themes/atahualpa/images/menu-bg.jpg) no-repeat center;
border: none;
}

div#menu1 ul.rMenu li {
background-color: transparent important!;
padding: 5px;
margin: 0px 1px;
border: 0px;
width: 140px;
}

div#menu1 ul.rMenu li a:link,div#menu1 ul.rMenu li a:hover,div#menu1 ul.rMenu li a:visited,div#menu1 ul.rMenu li a:active {
background-color: transparent important!;
background: transparent important!;
text-decoration:none;
margin:0;
padding:2px 5px;
}


div#menu1 ul.rMenu li.current_page_item a:link,
div#menu1 ul.rMenu li.current_page_item a:active,
div#menu1 ul.rMenu li.current_page_item a:hover,
div#menu1 ul.rMenu li.current_page_item a:visited,
div#menu1 ul.rMenu li.current_page_item > a:link,
div#menu1 ul.rMenu li.current_page_item > a:active,
div#menu1 ul.rMenu li.current_page_item > a:hover,
div#menu1 ul.rMenu li.current_page_item > a:visited,
div#menu1 ul.rMenu li a:hover {
background-color: none !important;
background-color: transparent !important;
} 


li.page-item-2 {
background: url(http://burn.phpnet.org/soundandbandservices2010/wp-content/themes/atahualpa/images/button-about.png) no-repeat scroll center center;
}

li.page-item-17 {
background: url(http://burn.phpnet.org/soundandbandservices2010/wp-content/themes/atahualpa/images/button-contact.png) no-repeat scroll center center;
}

li.page-item-26 {
background: url(http://burn.phpnet.org/soundandbandservices2010/wp-content/themes/atahualpa/images/button-prod.png) no-repeat scroll center center;
}


/* END MENU STYLE */

Thanks a lot for your support!

Ok I solved the higlighted background by going into the database and repalce the default colors scheme by transparent.
I know it's not a good tweek but I find it such a pity that this fantastic theme is getting a burden when it comes to customizing the menus...

If someone can offer me a better solution, I will take it for sure

I also solved the standar text issue by putting the font size to 1px... I wish I could simply remove it
again a better solution is appreciated!


NOw only remains the "Home" button issue than doesnt pop up...
for each page I made this

li.page-item-xxx {
background: url(image) no-repeat scroll center center;
}

Where the xxx is the page id...
But how can I make this works for home? As far as I know there is no page id and if I leave it like this

li.page-item {
background: url(image) no-repeat scroll center center;
}

the home button doesnt show up...

Please help!

edit bfa_header_config.php and locate lines 27-30 (version 3.4.5) which should be

				$page_menu_bar .= ' current_page_item';
			}
		} elseif ( is_home() ) { 
			$page_menu_bar .= ' current_page_item';

and change them to

				$page_menu_bar .= ' current_page_item page_home';
			}
		} elseif ( is_home() ) { 
			$page_menu_bar .= ' current_page_item page_home';

This will now give you a class 'page_home' you can use in your CSS.

To get rid of the actual page names, you will need to change line 33 from

		$bfa_ata['home_page_menu_bar'] . '</a></li>' . "\n";	

to

		 '</a></li>' . "\n";	

Thanks a lot for this answer!
I was hoping I wouldnt have to edit some php files.. but well... here we go!

After I did the modifications you advised, I get my Home button visible.. only when I'm on the "home" page.. I guess it comes from the "current_page_item" bit but I have no idea how to fix that :S

Sorry, I missed one spot edit bfa_header_config.php and locate lines 24 (version 3.4.5) which should be

		$page_menu_bar .= '<li class="page_item';

and change it to

		$page_menu_bar .= '<li class="page_item page_home';

This is top support juggledad!!
thanks to this I could set the beta version online

Just realised that my default text of the pages menu bar are back
I wonder if it's plugin wise or not... any way I could get rid of those by editing a php file?

add this to CSS Inserts

li.page_item a {color: transparent !important;}

Cheers!! (did you receive my donation?)

Hello all,
I had the same problem than Burn and I've founded another solution than I want to share here
I've added a new widget area in header area (but you can add it in center column if you want) and I've made my menu with images in a widget text in this area, here's a example code to do this :
<a href="/link1><img src="/url/of/the/button/button1.png></a>
<a href="/link2><img src="/url/of/the/button/button2.png></a>
<a href="/link3><img src="/url/of/the/button/button3.png></a>
etc...
You can see the result in the attachment

This is not a bad idea at all
Only 'problem' is that you will need to edit your widget each time you had a page/category, and your fix needs a bit more coding if you have submenu link in drop-downs... But without submenu, it's a great idea!

Yes, this solution have some limitations (no sub-pages, etc...) but the good thing is that you not need to edit bfa_header_config.php and you can upgrading atahualpa with no problem

very true!! I might switch to your solution after all... But I dont have time to work on the layout of the site now... and it's working aswell at the moment

About this,

I'm working on something new which NEEDS to have the current_page in the same style than hovering style.


At the moment my CSS insert is

li.page-item-xx {
background: url(/wp-content/themes/atahualpa/images/button-xx.png) no-repeat scroll center center;
}
li:hover.page-item-xx {
background: url(/wp-content/themes/atahualpa/images/button-xx-hover.png) no-repeat scroll center center;
}

I thought I would simply need to add "li.page-item-xx current_page" after "li:hover.page-item-xx"
but that doesnt do the trick.. as anyone some tip to solve that problem?
Cheers

try

li:hover.page-item-xx,
li.page-item-xx.current_page {
background: url(/wp-content/themes/atahualpa/images/button-xx-hover.png) no-repeat scroll center center;
}

li:hover.page-item-xx,
li.page-item-xx.current_page_ITEM {
background: url(/wp-content/themes/atahualpa/images/button-xx-hover.png) no-repeat scroll center center;
}

this did it... Thanks to leading me to the right class
only not for the 'home' page... I tried several things without success...

what do you mean by 'only not for the 'home' page... '?

I mean that using the same class and replacing "page-item-xx" by "page_home" doesnt work.
The home button changes style when hovering but not when current page...

the site is now online you can see it at www.psychonautrecords.com

you have a dash where you need an underscore
li:hover.page_home, li.page-home.current_page {
background: url(/wp-content/themes/atahualpa/images/button-home-hover.png) no-repeat scroll center center;
}