Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

Question regarding pixel menu bar


  #1  
Old Dec 10, 2009, 04:40 AM
calipso
 
7 posts · Dec 2009
Hello
I would like to modify the menu bar of the Atahualpa Theme by using only jpeg or bmp files (because of the special font I want to display).
So i have created 2 images for BLOG, HOME, ABOUT, CONTACT (2 because i want hover).
Till now figured out where to modify in Add CSS inserts...

div#menu1 ul.item-page-X (X=BLOG number) (HOME, ABOUT etc)
background: url(http:// my_site/folder/theme/images/blog.jpeg) center no-repeat !
}

div#menu1 ul.item-page-X, Y, Z a:link,
----------||------------------------- a:active,
----------||------------------------- a:visited {
visibility: hidden;
}

But the ul.item-page is not acting like a link... I have no ideea how to transform that element in a link element...
Or, same problem, solution 2 would be leaving "div#menu1 ul.item-page-X a:..." visible... and adding a "<SPAN>text</SPAN>" insede the <a>....</a> line of code, meaning I want this:
"<a href="http://www.XXX...." >Blog</a>"
to become:
<a href="http://www.XXX...." ><span>Home</span></a>
Can this be made only by Add CSS inserts? Or should I mess-up the PHP? Also here have no clue to solve the problem.
Searched the forum for a week and found no similar question...
If some of you guys could help me, I would appreciate!
10X!!!
  #2  
Old Dec 10, 2009, 08:02 AM
juggledad's Avatar
juggledad
 
23,667 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Try this - putting in your own page ID's
HTML Code:
/* ================================================ */
/* CSS to change a single menu item                 */
/* ================================================ */
ul.rMenu li.page-item-211 a:link, 
ul.rMenu li.page-item-211 a:active, 
ul.rMenu li.page-item-211 a:hover, 
ul.rMenu li.page-item-211 a:visited, 
ul.rMenu li.page-item-211 {
	background: #red !important;
	} 
ul.rMenu li.page-item-213 a:link, 
ul.rMenu li.page-item-213 a:active, 
ul.rMenu li.page-item-213 a:hover, 
ul.rMenu li.page-item-213 a:visited, 
ul.rMenu li.page-item-213 {
	background: #black !important;
	} 
/* ++++++++++++++++++++++++++++++++++++++++++++++++++ */
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Dec 10, 2009, 09:05 AM
calipso
 
7 posts · Dec 2009
Hi Jugledad and 10x for taking attention to my problem, but i'm affraid it wont help, because text in <a> is still visible in your solution.

Here is the code I use in Add CSS Inserts:

/*Image MENU PAGES*/

ul.rmenu2 {
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}

ul.rMenu li {
float:left;
}

ul.rMenu a {
display:block;
width:130px;
height: 10px;
}


div#menu1 li.page-item-43 {
background: url(http://www....home1.png) no-repeat center !important;
}
div#menu1 li.page-item-43:hover {
background: url(http://www.....home2.png) no-repeat center !important;
}


div#menu1 li.page-item-2 {
background: url(http://www.....picA1.png) no-repeat center !important;
}
div#menu1 li.page-item-2:hover {
background: url(http://www.......picA2.png) no-repeat center !important;
}


div#menu1 li.page-item-31 {
background: url(http://www......picB1.png) no-repeat center !important;
}
div#menu1 li.page-item-31:hover {
background: url(http://www......picB2.png) no-repeat center !important;
}


div#menu1 li.page-item-43 a:link,
div#menu1 li.page-item-43 a:active,
div#menu1 li.page-item-43 a:visited {
visibility:hidden;
}

div#menu1 li.page-item-2 a:link,
div#menu1 li.page-item-2 a:active,
div#menu1 li.page-item-2 a:visited {
visibility:hidden;
}

div#menu1 li.page-item-31 a:link,
div#menu1 li.page-item-31 a:active,
div#menu1 li.page-item-31 a:visited {
visibility:hidden;
}

Also Button BLOG needs the same treatment ... but i am a little confused by it's "li.page-item identifier" his value being li class="page_item current_page_item" but changing when navigate to another page.
BTW: Ata and WP are up-to-date!

Many 10X!!!
  #4  
Old Dec 11, 2009, 07:02 AM
calipso
 
7 posts · Dec 2009
Any ideea???
  #5  
Old Dec 13, 2009, 04:05 AM
juggledad's Avatar
juggledad
 
23,667 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
What version of Atahualpa and WP?
What is the url showing the issue?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #6  
Old Jan 8, 2010, 12:29 AM
calipso
 
7 posts · Dec 2009
Sorry for the huge delay... Happy new year to all Atahualpa coders, supporters and users!!!
I am using Atahualpa version 3.4.4 and WP: 2.9.1
I can't provide a link to the site since is o a local server... when it is finished i'll seek some hosting...
Cheers!
  #7  
Old Jan 11, 2010, 05:29 AM
calipso
 
7 posts · Dec 2009
Hmmm... no sugesstions?

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
And the final menu question... ariels Page & Category Menu Bars 6 Sep 11, 2009 07:54 PM
Hopefully Simple Question: Having a Category as Page in Page Menu Bar Gisele Page & Category Menu Bars 4 Aug 17, 2009 11:47 AM
Question about page menu hilighting Croyd Page & Category Menu Bars 4 Jul 16, 2009 01:30 PM
Menu Bar Question mgofootball Page & Category Menu Bars 2 Jul 16, 2009 10:00 AM
Splash/Front Page and Menu question ryguy Page & Category Menu Bars 1 Mar 25, 2009 06:00 PM


All times are GMT -6. The time now is 07:40 AM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.