Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   Page Specific Logos (http://forum.bytesforall.com/showthread.php?t=1158)

drewpasmith Apr 8, 2009 01:50 AM
Page Specific Logos
 
After Flynn's fabulous help with page specific header images and titles, I have one last page specific question:

Is there any way I can use a CSS insert to have a different logo on one page?

Cheers,

Drew

Flynn Apr 8, 2009 05:50 PM
You could turn the logo off altogether (At A. Theme Options -> Header -> Show Logo Image?) and work with background images

HTML Code:
td.logoarea-logo {
width: 80px;  /* setting a global width for that cell on all pages */
background: url(/wp-content/themes/atahualpa/images/defaultlogo.gif);
}
body#body-page-XXX td.logoarea-logo {
background: url(/wp-content/themes/atahualpa/images/otherlogo.gif);
}
XXX = ID of that page

The logo wouldn't be clickable though, also no ALT tag

drewpasmith Apr 9, 2009 06:16 AM
Hi Flynn,

Thanks for this.

Where would I insert the code? In the HTML Inserts: Header section or in the CSS Inserts?

Cheers,

Drew

drewpasmith Apr 9, 2009 06:30 AM
Just to clarify,

I've tried it in the HTML box and I get the problem you see at the site: http://wordpress.carmenview.com/

The HTML is read as text and inserted at the top of the page.

Cheers,

Drew

Flynn Apr 9, 2009 01:57 PM
You'd insert it at HTML/CSS Inserts -> CSS Insert

drewpasmith Apr 15, 2009 02:47 AM
Hi Flynn,

Did as you suggested.

I left the logo field blank and inserted the following code in the CSS insert field:

Code:
td.logoarea-logo {
width: 300px;
background: url(/wp-content/themes/atahualpa332/images/CARMEN_Logo_Band_final.png) no-repeat left;
}
body#body-page-5 td.logoarea-logo {
width: 300px;
background: url(/wp-content/themes/atahualpa332/images/CARMENU_Logo_Band_final.png) no-repeat left;
}
The Logo area is now blank on all pages with no background.

If I leave a logo activated, obviously it appears on all pages but it also appears on page 5 sitting above the background shown in the CSS code above.

Any idea what gives?

Drew

P.S Just clearing a donation with the bosses ;)

drewpasmith May 4, 2009 01:01 AM
Hi All,

Just wanted to let you know that I have partially solved the issue of separate logos for each page using the following code:

Code:
table#logoarea {
background: url(/wp-content/themes/atahualpa332/images/XXXXXXX.jpg) no-repeat left;
}

body#body-page-5 table#logoarea {
background: url(/wp-content/themes/atahualpa332/images/XXXXXXX.jpg) no-repeat left;
}
The only problem I now have is that in Mac Firefox and IE 8, the background/logo doesn't show. In all other browsers it does.

Any ideas?

Cheers,

Drew

Flynn May 11, 2009 05:59 AM
The table cells <TD>...</TD> get removed once their content (logo, blog title) gets disabled, I had not thought about that. Since you disabled the search box and the RSS button as well, you could just put

PHP Code:
<a id="mylogo" href="<?php echo get_option('siteurl'); ?>/">&nbsp;</a>
into header.php, right above
PHP Code:
<?php bfa_header_config($bfa_ata['configure_header']); ?>
And then use a CSS Insert

HTML Code:
a#mylogo {
display: block;
border: 0;
width: XXX; /* width of logo */
height: YYY; /* height of logo */
background: url(/wp-content/themes/atahualpa334/images/mylogo.gif);
}

body#body-page-5 a#mylogo {
background: url(/wp-content/themes/atahualpa334/images/mylogo-5.gif);
}

body#body-page-29 a#mylogo {
 background: url(/wp-content/themes/atahualpa334/images/mylogo-29.gif);
 }

drewpasmith May 11, 2009 06:23 AM
Hey Flynn,

Not wanting to sound idiotic, but where should I be inserting this? In the CSS Inserts box?

Cheers,

Drew

mcphoto May 11, 2009 07:50 AM
For your images not showing, you can always try absolute links (IE, the full image URL starting with "http://yousite.com/"

That seems to be a necessity with background images.

I noticed when I upgraded to the latest version of the theme, it did re-write all my image URLS to the new directory - very nice, Flynn!! I was dreading all the hand-coding I thought I'd be doing....

drewpasmith May 11, 2009 08:31 AM
Hey mcphoto,

Thanks for the input. I changed the links to absolute but no luck.

I did, however, have luck using a validation plug-in for firefox that confirms what Flynn has mentioned about the <td> tag not being present.

When the plugin simulates the fix, the logos appear. So now I just need to work out how to insert this line of HTML into the site...

Drew

Flynn May 11, 2009 01:45 PM
I updated post #8

drewpasmith May 12, 2009 01:28 AM
Hi Flynn,

I updated header.php as follows based on your suggestion in number 8:

PHP Code:
</colgroup> 
    <tr>

        <!-- Header -->
        <td id="header" colspan="<?php echo $bfa_ata['cols']; ?>">
        <a*id="mylogo"*href="<?php*echo*get_option('siteurl');*?>/">&nbsp;</a>
        <?php bfa_header_config($bfa_ata['configure_header']); ?>

        </td>
        <!-- / Header -->

    </tr>
and now I get this error when I try to load the page:

Fatal error: Call to undefined function php echo get_option() in /home/httpd/carmen/wordpress.carmenview.com/wordpress/wp-content/themes/atahualpa333/header.php on line 859

I have no idea what I'm doing wrong here...

I also updated the CSS insert, but the PHP problem is the more serious :P

Drew

drewpasmith May 12, 2009 02:50 AM
Hi Flynn,

Scrap that last post, I managed to get the PHP edit and the CSS inserts to work in everything but Internet Explorer. Any ideas why IE is being so difficult here? (I have direct links to the image files I think)

I also have a problem with the styling of the header area now: there's a lot of white space under the logo and not enough on top. Where should I be looking to edit this?

Cheers,

Drew

drewpasmith May 12, 2009 03:04 AM
Answering my own questions faster than you poor fellows can respond.

The trick for removing the space was to take out the %logo code in the header configuration page. Styling was simply a case of styling the CSS insert.

Still got the IE problem tho...

Flynn May 12, 2009 06:45 AM
Try putting a space after the closing bracket of the image url, in your CSS Insert

ARMEN-Logo-Band-final.jpg)no-repeat left


All times are GMT -6. The time now is 12:05 PM.

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