Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Forum How-To (http://forum.bytesforall.com/forumdisplay.php?f=9)
-   -   How do I create a transparent "Pages" menu bar over the bottom of the header image? (http://forum.bytesforall.com/showthread.php?t=10761)

Espresso Oct 27, 2010 12:52 PM

How do I create a transparent "Pages" menu bar over the bottom of the header image?
:( Hi,

So far, after searching for a week, I've not been able to successfully found information on how to create a transparent "Pages" menu bar over the bottom of my header image. Basically, so that if you were to look at the header, you'd see the menu bar in the bottom of the header image, no color, just transparent, so that the image is seen through and the pages bar only appears to be floated over the existing picture, maybe like it was pasted in. I hope I'm making sense.

Anyway, I have searched this forum, and tried out existing advice, and it hasn't worked. I've searched G*ogle, and have come up with nothing to solve the issue. I don't know what else to do. I can't solve this issue on my own, and would appreciate help. I've been working on the website since September, and need help in the fix.

It's good to know there are helpful people here. It makes a newbie at templates and code not feel so alone and intimidated, hahaha!


Espresso Oct 27, 2010 03:53 PM


Thank you for your reply, and I didn't even realize that the pages menu bar wasn't activated. I corrected this so that the problem can be seen better.

I pasted the code in that you suggested, at the bottom, so now it reads:


td#header {
padding-bottom: 0px;
/* removing the padding here and putting them on the sidebars instead. That way the middle column aligns nicely with the header when there are no sidebars */
td#middle {
padding: 0;
div.searchbox-form {
margin: 5px 0 15px 5px;
div#menu1 ul.rMenu {
background: transparent;

border: none;
div#imagecontainer {
border-top: solid 1px #AFBB75;
border-bottom: solid 0px #ffffff;
div.widget ul li {
padding: 1px 5px 1px 12px !important;
background: url('<?php bloginfo('template_directory'); ?>/images/bullets/round-gray.gif') no-repeat 0 7px;
/* Adjustments for the menu bars, which in their default
state have 1px borders plus -1px margins to avoid 1+1=2px
borders between neighbor items. */
ul.rMenu-hor ul, ul.rMenu-hRight ul { margin-top: 0px; }
ul.rMenu-hor li { margin-bottom: 0px; margin-top: 0px; margin-left: 0px; }
ul.rMenu-hor { padding-left: 0px; }
ul.rMenu-ver li { margin-top: 0xp; }

div#menu1 ul.rMenu li a, div#menu2 ul.rMenu li a {
padding: 6px 10px;       
/* Space between items of page menu bar */
div#menu1 ul.rMenu li {
margin-right: 2px;
/* Reset margin for 2nd+ level items */
div#menu1 ul.rMenu li li {
margin-right: 0;
/* round corners for page menu bar items */
div#menu1 ul.rMenu li, div#menu1 ul.rMenu li a {
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
/* reset 2nd+ level */
div#menu1 ul.rMenu li li, div#menu1 ul.rMenu li li a {
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius: 0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
h3#comments {
font-weight: normal;
color: #660505;
font-size: 1.0em;
h3.reply {
font-weight: normal;
color: #660505;
font-size: 1.1em;
ul#rmenu1 > li, ul#rmenu2 > li, li.current_page_item, li.current-cat, li.current-menu-item {
background: ;

Things remain unchanged, with the exception that my sidebar with has moved. I'm missing something, I just know it.

Espresso Oct 27, 2010 04:10 PM

I can see it, directly underneath the header, page bar tabs, gray. I wonder if I can see it because I am currently logged in. I'll log out and see if my view changes. Be right back.

Espresso Oct 27, 2010 04:12 PM

Logged out, and the pages bar wasn't there. I must've been able to see it because I was logged in. I logged out, and it's not there. Wierd. I just checked the page menu bar setting, and it's currently, under Configure Header Area:


%image %pages

Espresso Oct 27, 2010 04:13 PM

I can't see a page menu bar at all. I wonder what I did. Ugh!

Espresso Oct 27, 2010 04:20 PM

I'll do that right now.

Espresso Oct 27, 2010 04:23 PM

WOW. I didn't even know to disable it, that makes a difference in what I'm seeing, hahaha! I got my dashboard in one tab, the home page in the next, and was seeing things totally different in both! Hahaha! Wow. Thanks. Hope you can see the pages menu bar under the header now, I can.

Espresso Oct 27, 2010 06:01 PM

I am SO sorry. I need some hand holding, here. Hahaha. I'm embarassed, I have no idea. I don't understand the instruction you just gave me. Newbies. Gotta love 'em, right? Oh, wait. I'm a newbie. [Insert humor smile here, and a wink and a giggle. I don't crack a joke here at this point, I'll just cry. Hahaha.]

Espresso Oct 27, 2010 06:02 PM

I just managed to remove the code you gave me earlier, trying to understand the rest of your instructions. Feeling overwhelmed.

Espresso Oct 27, 2010 06:05 PM

Ok, I tried pasting in that code. The result is up. Hahaha. Ugh. Hmmm.

All times are GMT -6. The time now is 11:08 PM.

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