Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

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

[SOLVED] Page Menu Bar Padding


  #1  
Old Jan 28, 2009, 04:21 AM
mactony
 
67 posts · Jan 2009
Hello again, Flynn. I am working on recreating my menu bar from an old html design. The new page menu bar seems to have more padding around the links than the remainder of the bar, so that the section with the links is thicker and taller than the rest of the bar. I would like them to be of equal height and match seamlessly. I have combed through the stylesheets but can't find out how to do this.

Here is the site:
http://www.midriffrecords.com/midriff_TEST/

Ideally I would like the black menu bar to appear "under" the yellow bg at the top and blue line at the bottom, before the main page begins.Right now it seems to be overlapping both.

Sorry to bother you with this one, after the last tip you gave me I was really going strong! Thanks so much!

Tony
  #2  
Old Jan 28, 2009, 04:50 AM
Flynn's Avatar
Flynn
 
3,768 posts · Oct 2008
Munich, Germany
Change Atahualpa Theme Options -> Page Menu Bar -> Border around all menu items

from currently
HTML Code:
#000000
to

HTML Code:
solid 1px #000000
The theme is expecting a combined ("shorthand") style for the border there and will generate:

border: [option value];

Since you didn't provide border type and width, the browsers are putting their default values there.




Last edited by Flynn; Jan 28, 2009 at 07:44 AM. Reason: Removed the semicolon from the second code.
  #3  
Old Jan 28, 2009, 07:13 AM
mactony
 
67 posts · Jan 2009
Holy fast response. Thank you so much! Worked like a charm.
  #4  
Old Feb 1, 2009, 03:29 AM
Eric Bobrow
 
70 posts · Jan 2009
I made the Page Menu text height larger, and wanted to make the Page Menu Bar taller, but couldn't see any setting for its height.

Is setting a border thickness the only way to control the height?

It's rather unintuitive, although by setting it to a matching color and 4px I was able to get it to look OK.

On a related note, I wanted to highlight (decorate) the current page in the Page Menu by making the font Bold, however I didn't see anywhere that could be chosen. I already have it change color, but to draw the eye better, I'd like to see how it would look in bold-face. Is there any way to do this?
  #5  
Old Feb 1, 2009, 05:15 AM
Flynn's Avatar
Flynn
 
3,768 posts · Oct 2008
Munich, Germany
You can change the size of the menu tabs by adding this via HTMl/CSS Inserts -> CSS Inserts

HTML Code:
ul.rMenu li a:link, 
ul.rMenu li a:hover, 
ul.rMenu li a:visited, 
ul.rMenu li a:active
    {
    padding: 8px 5px;    
    }
"padding: 8px 5px" means 8 pixels inners space top and bottom, and 5 pixels left and right. Default is "4px 5px"

Also as a CSS Inserts, to make the current tab bold

HTML Code:
ul.rMenu li.current_page_item a:link, 
ul.rMenu li.current_page_item a:active, 
ul.rMenu li.current_page_item a:hover, 
ul.rMenu li.current_page_item a:visited
    {
    font-weight: bold;
    }
I have not added the bold option because both "hover" and "current" are getting the same style, and for "hover" bold text would make the menu "jump" a little because the bold text consumes more horizontal space. Using it only for the "current" state should look o.k. though.

The same as above, but for the Category Menu Bar:

HTML Code:
ul#rmenu li a:link, 
ul#rmenu li a:hover, 
ul#rmenu li a:visited, 
ul#rmenu li a:active
    {
    padding: 8px 5px;    
    }
and bold for "current"

HTML Code:
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
    {
    font-weight: bold;
    }
  #6  
Old Feb 22, 2009, 07:51 AM
markus
 
6 posts · Feb 2009
sadly this display of bold and changing the padding does not work if you combine the page and the category bar into one. like done here (http://forum.bytesforall.com/showthread.php?t=139)
any idea?
markus
  #7  
Old Mar 1, 2009, 07:44 AM
markus
 
6 posts · Feb 2009
Hello.
I still have the problem with the combined page-categorybar as described in http://forum.bytesforall.com/showthread.php?t=139.
I have made a layout with the combined page-categorybar and the pagebar in the header.



when i activate on category it highlights the category with the css insert as above.



but when i activate a page it does only highlight the page in the pagebar, but not in the combined bar.



Any idea what i could do.
the combined bar is very nice, but i like the visitor to see instantly where he/she is.

(the address for the testing i do is: http://www.zieglermarkus.de/testblog)

markus
  #8  
Old Mar 17, 2009, 09:12 AM
ciolo
 
12 posts · Mar 2009
i'm trying to make only the category bar bold, what is the css insert for that ? thanks.
  #9  
Old Jul 22, 2009, 08:29 AM
dread
 
3 posts · Jul 2009
Has anybody resolved this? I am trying to do the same thing.

Quote:
Originally Posted by markus
sadly this display of bold and changing the padding does not work if you combine the page and the category bar into one. like done here (http://forum.bytesforall.com/showthread.php?t=139)
any idea?
markus
  #10  
Old Jul 25, 2009, 06:58 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
try this for the page menubar - the 35 is the horizontal padding, the 8 is the vertical
HTML Code:
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
    {
    padding: 8px 35px;    
    }
for the category menubar use
HTML Code:
div#menu2 ul.rMenu li a:link, 
div#menu2 ul.rMenu li a:hover, 
div#menu2 ul.rMenu li a:visited, 
div#menu2 ul.rMenu li a:active
    {
    padding: 8px 35px;    
    }
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #11  
Old Apr 21, 2010, 05:32 PM
seleniumgirl
 
11 posts · Dec 2009
This works well. Thank you JuggleDad!

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Atahualpa Page Menu Bar -> BFA Page Menu Bar? bhannemann Page & Category Menu Bars 16 Feb 21, 2011 04:49 AM
[SOLVED] Page tab height issue: page link tabs higher than page menu bar Fux Page & Category Menu Bars 13 Oct 30, 2010 03:42 AM
[SOLVED] Page Menu Bar - Strange Space Occurring Between Menu Items NealSchaffer Page & Category Menu Bars 2 Jun 20, 2009 10:18 AM
How do I add an icon to a page menu link in page menu bar? bcorrigan Page & Category Menu Bars 9 Apr 6, 2009 02:35 PM
Trying to convert my page menu bar to the format on my simple machines forum page.. Joelb53 Page & Category Menu Bars 1 Apr 5, 2009 03:01 PM


All times are GMT -6. The time now is 06:15 AM.


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