The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

Clickable Header without Header Text (2 posts)

  1. leslie555
    Posted 7 years ago #

    Hi. On this blog: http://blog.naturalkidz.com/ I'm trying to link the header image and hide the Header Text. When I use the code suggested on this page: http://codex.wordpress.org/Designing_Headers (see below) the Header Text still shows and the image is clickable. If I try to make the display "none" then the Header Text disappears but then the image is not cickable. I appreciate any help possible. Thanks, leslie555

    "The CSS would then be styled something like this to enlarge the clickable link area and hide the header text (optional), customized to your own design needs."

    #header h1 a {
    	width: 400px;
    	height: 100px;
    	display: block;
    	background: url(images/headerimage.gif) no-repeat top left;
    #header h1 a span { display: none; }
  2. RoseCitySister
    Posted 7 years ago #

    It's not the image that is clickable, it's the text. When you hide the text, then you hide the link.

    You should go into header.php and replace the heading text with your image inside the link instead of text - then it will be clickable. You won't want a border around the image so put this in style.css:

    #header h1 a img {
       border: none;

    Hope this help! :)

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.