Skip to content

Instantly share code, notes, and snippets.

@philipdowner
Created December 29, 2011 17:16
Show Gist options
  • Save philipdowner/1535047 to your computer and use it in GitHub Desktop.
Save philipdowner/1535047 to your computer and use it in GitHub Desktop.
Hidden text with background image
<style type="text/css">
body.about h1 { /*Let's presume your banner title is an h1 element */
width: 150px; /* Set this to the width of your image */
height: 75px; /* Set this to the height of your image */
background: transparent url('my-image.png') no-repeat top left; /* Change the URL to point to your image */
text-indent: -9999em; /* This ensures that the text itself will not show. */
}
</style>
<html>
<body class="about">
<!-- The title below will be text and shown to search engines.
Normal visitors will see the image you've specified in the CSS -->
<h1><?php the_title(); ?></h1>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment