WordPress.org

Ready to get started?Download WordPress

Forums

Scrappy
Adding image to header (5 posts)

  1. mariamic
    Member
    Posted 2 years ago #

    I love the Scrappy theme! Thank you so much for creating it. I would like to add an image on either side of the header/title of my blog:

    http://thebargaincafe.com/

    Can you please tell me how to do that? Thank you!

  2. Caroline Moore
    Member
    Theme Author

    Posted 2 years ago #

    Thanks!

    Yes, you can use CSS in a child theme or a CSS plugin (like Jetpack) to do this. I recommend using a browser add-onFirebug for CSS work--makes it much easier.

    I haven't tested this, you'll probably need to play around with it a little to get it to work:

    .site-title:before,
    .site-title:after {
      background:url('/path/to/your/image.png') no-repeat;
      content: "";
      display: inline;
      width: 100px; /* Change to the width/height of your images */
      height: 100px;
    }
  3. mariamic
    Member
    Posted 2 years ago #

    Thank you for your response. But I can't get that to work at all, even playing around with it for over an hour. ugh. any other suggestions would be appreciated.

  4. while copying the suggested css, you made several mistakes;

    also, use display: inline-block;

    try:

    .site-title:before,
    .site-title:after {
      background-image:url('http://thebargaincafe.com/wp-content/uploads/2012/12/tinycoffee.jpg'); background-repeat:no-repeat;
      content: "";
      display: inline-block;
      width: 50px;
      height: 50px;
    }
  5. mariamic
    Member
    Posted 2 years ago #

    I cannot thank you enough alchymyth!!! It works :)

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic