How to use Image Replacement Code

• 

  anarresti · Member · Jul 28, 2010 at 5:30 pm

  • Copy link
  • Add topic to favorites

  Hi,

  I want to replace the title of my blog with an image.
  This is my blog: http://opapeldasnoticias.org/

  http://css-tricks.com/css-image-replacement/
  This post shows different codes for Image Replacement.
  Because I am not good with HTML and CSS, I cannot figure out how and where to use the code.

  Also, my wordpress template code seems to be using a different sintax.
  If I were to use the following code, where should I put it?

  ————————————-
  <h1 class=”technique-four”>
  
  <img src=”images/header-image.jpg” alt=”CSS-Tricks” />
  
  </h1>

  h1.technique-four {
  width: 350px; height: 75px;
  background: url(“images/header-image.jpg”);
  text-indent: -9999px;
  }
  ————————————

  Thank you for your time.

  The blog I need help with is: (visible only to logged in users)

• 

  anarresti · Member · Jul 28, 2010 at 7:44 pm

  • Copy link

  can anyone please help?

• 

  hallluke · Member · Jul 28, 2010 at 9:41 pm

  • Copy link

  Here’s some code to try. Copy in your image URL and change the height as appropriate. If you want the image to be the size of the main content area it should be 720px wide, if you want it to extend over the sidebar as well then it should be 930px.

  #container h1 a {text-indent:-999em; display:block; height:100px; background:url("http://www.riveroakstx.com/images/subgallery.jpg");}
  #container h1 a:hover {border:none!important;}

• 

  anarresti · Member · Jul 29, 2010 at 8:00 am

  • Copy link

  Thank you so much, hallluke.
  It’s perfect, now. Thank you for your help.

  Best wisehs,
  Nuno.