WordPress.org

Support

Support » Themes and Templates » Making the header image a link to the home page

Making the header image a link to the home page

  • geekosupremo
    Member

    @geekosupremo

    I’ve tried the solutions in this post, and neither of them is accomplishing what I’m trying to do, which is just turn to whole banner image into a clickable link back to the home page. What am I missing?

    Line 45 of my header.php looks like this
    <a>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="path" alt="<?php bloginfo( 'name' ); ?>" /></a>

Viewing 3 replies - 1 through 3 (of 3 total)
  • Jesin A
    Participant

    @jesin

    Post your site’s link for us to see.

    geekosupremo
    Member

    @geekosupremo

    Right, sorry, forgot that.

    The site is: http://www.beeskneescaramels.com/

    Currently there is a menu up in the header image, but it doesn’t really fit the look we’re going for, thus we were wanting to make the banner image the “home” link.

    Thanks for looking.

    Jesin A
    Participant

    @jesin

    You’re using a background image, so the solution mentioned in that post won’t work as the theme places line 45 a class named “remove”.

    There are two ways of doing it. First revert the changes you’ve made.

    http://themes.svn.wordpress.org/tonic/1.0.8.1/header.php

    JavaScript:
    Edit header.php and change line 31 from

    <div id="header-wrap" class="grid wfull">

    to

    <div id="header-wrap" class="grid wfull" onclick="location.href='<?php echo esc_url( home_url() ); ?>'" style="cursor:pointer">

    Pros:
    The entire banner becomes clickable just as you wanted.
    Cons:
    Needs JavaScript enabled to work

    CSS:
    Edit header.php and place the following on line 62

    <a class="click-div" href="<?php echo esc_url( home_url() ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"></a>

    Then use the following CSS

    a.click-div {
      height: 100%;
      position: absolute;
      text-decoration: none;
      width: 100%;
    }

    Pros:
    Uses only CSS
    Cons:
    The region above and next to the menu aren’t clickable.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Making the header image a link to the home page’ is closed to new replies.