Executive Pro: how to make the header logo area "clickale"?

[adriano]

Hi,

I'm customizing the Executive Pro theme (http://my.studiopress.com/themes/executive/) -- and I set the header area to be an image (sized 1140x100).

The logo is on the left of the image, within the first 200 pixels.

Is there a way to place an hyperlink within that 200x100 pixels area so that clicking on it would send to the website's home page?

Thanks,

- Adriano

[nutsandbolts]

Hi Adriano,

Look in the theme's stylesheet for the #title a CSS rules - that's what you would need to alter. If you want to post a link to your site I'd be glad to try to help in more detail.

---

Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+

[adriano]

Hi Andrea,

You can have a look at the website here http://www.vervaishr.com -- it seems like the link is actually there, but since I'm using a an image rather than text for the logo, the clickable area only extends within a few pixels before the actual header image starts. In the resulting HTML is at:

<div id="title-area">
<p id="title">
<a title="&quot;&quot;Vervais&quot;" href="&quot;//www.vervaishr.com/&quot;&quot;">Vervais &amp; Associates</a>
&lt;/p&gt;
&lt;/div&gt;

If you have some suggestion as of how to extend that area underneath / above the header image to cover where the logo is that would be great. Otherwise I've seen that in the executive-pro v3 things changed in regards to the logo image, and that might solve my problem (although I'd have to transfer over my modifications to the updated version).

[nutsandbolts]

It may be worth it to switch to Pro - I see a number of differences in the stylesheet for your site versus the Executive Pro stylesheet, and they would make a big difference as far as the logo being clickable.

---

Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+

[adriano]

Actually I do already have the Pro version -- it's just that the one I have on the site mentioned above is version 2.0, and I've seen that there's a new (3.0) available which I might upgrade to in order to see if addresses what I'm trying to do out of the box.

[losterhout]

Was there ever any resolution to this issue? I'm having the same problem and have tried various methods recommended in the forums with no success. I'm a CSS novice, so I'm sure there's something I'm missing. Here is my site:
http://rrlc.info

I just want to make the header image link to the home page. I can't believe it's all so complicated.

[nutsandbolts]

Hi losterhout,

In your stylesheet, find this:

#title-area, .header-image #title, .header-image #title a {
display: block;
float: left;
height: 100px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 25%;
}

and change it to this:

#title-area, .header-image #title, .header-image #title a {
display: block;
float: left;
height: 100px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 250px;
}

That should make your logo clickable.

---

Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+

[adriano]

As far as myself, I upgraded from ExecutivePro 2.0 to ExecutivePro 3.0 -- version 3 handles the header area differently from V2, and the header image / logo gets hyperlinked with the site's url taking care of my problem / question above.

- Adriano

[losterhout]

Thank you both for your replies! nutsandbolts, that totally worked! I don't know why I couldn't figure that out on my own, but thank you! And adriano - I will consider upgrading as well - I'm sure there are other things that Pro 3.0 will help me with. Have a great day!

[Author]

Posts