WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Image replacement for h1 not allowing link to stay (3 posts)

  1. BenMoseley
    Member
    Posted 3 years ago #

    Hi,

    So what I'm trying to do is replace the <h1> text which is my blog name with a logo image instead. The image is replacing the text perfectly but the link is not applying itself to the image.

    I'm using the Phark Method. Here's the relevant code:

    CSS:

    h1{
    	height: 64px;
    	background: transparent url(logo.png) no-repeat;
    	text-indent: -9999px;
    }

    HTML:
    <h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name');?></a></h1>

    Again, the image is replacing the text perfectly. Only the image is no longer linked to the home page. Any suggestions?

  2. esmi
    Theme Diva & Forum Moderator
    Posted 3 years ago #

    You can't use that approach. Moving the block level H1 off the page also moves the link. You'd be better off applying your image to the enclosing <div></div> and adding the link to the enclosing div using this method.

  3. BenMoseley
    Member
    Posted 3 years ago #

    I got it to work with the Phark Method with some help.

    Changing the selector to h1 a did the trick. Also for anyone else that stumbles upon this, add display: block; width: XXXpx and you'll be good to go.

    Thanks for the link anyways, esmi. I'm sure I'll need to use that method someday.

Topic Closed

This topic has been closed to new replies.

About this Topic