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)
-   -   Add Logo image within the header image (http://forum.bytesforall.com/showthread.php?t=17080)

jkfly4 Mar 21, 2012 07:56 AM

Add Logo image within the header image
 
Hi

Is it easy to add my clickable logo image into my header image ?

Thanks

juggledad Mar 21, 2012 08:04 AM

depends onhow you define easy. see the 'Overlay Header Image' option

jkfly4 Mar 21, 2012 08:15 AM

Hi

Found that option, thanks.

Is ther a way to have it at the left of the header image, or do I just leave a blank gap to where it is located.

Thanks for your time.

jkfly4 Mar 21, 2012 08:40 AM

Is your thread still revent on the latest:

http://forum.bytesforall.com/showthread.php?t=2729

In the ATO - do I add the code to the HTML inserts: header section and is this the code for a clickable logo.

<div id="mylogoimage">
<ul>
<li><a href="http://www.mysite">
<img src="<?php echo site_url(); ?>/wp-content/images/mylogoimage/></a></li>
</ul>
</div>

Any help again would be most appreciated.

Many thanks

juggledad Mar 21, 2012 09:20 AM

you can't use the php - just put in the fully qualified path to the image

jkfly4 Mar 21, 2012 09:50 AM

Thanks

Unsure what it should look like ?

<div id="mylogoimage">
<ul>
<a href="http://www.mysite">
</ul>
</div>

juggledad Mar 21, 2012 10:48 AM

well that would give you half of a link but no image. Look at the example that is given next to the option

jkfly4 Mar 21, 2012 02:57 PM

Sorry to waste your time, is it this ?


<a href="http://www.mysite.com/"><img alt="mysite" src="http://www.mysite.com/wp-content/themes/atahualpa/images/radlogo.jpg" class="logo"></a>

Then do I add it to the HTML inserts: header section

Cheers

juggledad Mar 21, 2012 03:53 PM

The documentation for the Overlay Header Image shows the example
HTML Code:

<div id="header_image_sociable">
  <ul>
    <li><a href="http://www.facebook.com/myid">
      <img src="<?php echo site_url(); ?>/wp-content/images/facebook.jpg" alt="Facebook" /></a></li>
    <li><a href="http://www.twitter.com/myid">
      <img src="<?php echo site_url(); ?>/wp-content/images/twitter.jpg" alt="Twitter" /></a></li>
  </ul>
 </div>

since you only have one item and you can't use the php it would look like this
HTML Code:

<div id="header_image_sociable">
<a href="http://yourdomain.com">
      <img src="http://yourdomain.com/wp-content/images/facebook.jpg" alt="Facebook" /></a> </div>

and then you would use the css
HTML Code:

#header_image_sociable {position: absolute; right:40px; top: 20px;}
you can change the class name to suit your needs and the positions to adjust the logo where you want it.

jkfly4 Mar 23, 2012 05:26 AM

Hi

Thanks for you patients,

I tried placing it in the Header inserts:image section, not sure its meant to go there as it doesn't work.

And the CSS code in the Overlay Header Image box. Any more simple instruction you could give me.



Sorry

juggledad Mar 23, 2012 05:54 AM

The CSS goes in ato->add HTML/CSS inserts-> CSS inserts
The HTML goes in the 'Overlay Header Image' option

jkfly4 Mar 23, 2012 06:34 AM

Many thanks

Sorry to drag it out for you.


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

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