Support » Themes and Templates » want to add small image to the left of my "site title". Theme: Manifest 1.01

want to add small image to the left of my "site title". Theme: Manifest 1.01

  • I want to add a small loveheart, ( I already have the image, it will be just like the favicon i have added to my site already… ) to the left of my “site title”… I am very new at this and need step by step help please! but i learn fast and have some htlm and css experience…

    the website we are talking about is http://www.heartonmysleeve.com and i want to add a red loveheart exactly to the left of the title…

    I hope i am being clear, thank you so much in advance for your help…

    Warm Wishes,


Viewing 15 replies - 1 through 15 (of 27 total)
  • right next to the website name at the top of the page? if so you’d be best off creating a logo image with the site name and the love heart image all in one.

    Or you could use a heart image as a background to your H1 tag

       background-image: url('path/to/your/little/heart/image') no-repeat top left;

    to save having title as an image. You may have to add some padding-left to get it to suit

    theotherlebowski, thank you for your reply, you are perhaps right and i may have to do that indeed but i was hoping for a simpler solution perhaps…

    lockettpots, thank you, are you saying i should add that code to the .css file? It also doesn’t have a h1.vcard value already but i guess you are saying i can just add that… I will try and let you know…. I am wondering what the chances are that it will line up correctly… I hope it will work…

    thank you both for your help so far…

    Yes just add the h1.card rule to your stylesheet. You can tweak the position by using something like

      background-image: url('path/to/your/image') no-repeat 2px 2px;// Try different values here
      padding-left: 5px; //adding some breathing space between the heart and the tex

    Hey Lockettpots, i did add that to my style sheet and uploaded the image to the “images” folder of the theme but it is not showing up at all…

    When you say ‘path/to/my/image’ , I am not sure if i have put the path in correctly…

    This is what i added to my style sheet:

    background-image: url(‘/images/red-heart.png’) no-repeat top left;

    and as said, the .png image is uploaded to the “images” folder of my theme…

    Thank you!

    try getting rid of the 1st / from the image path…

    also, this text in in my header.php:

    <h1 class=”vcard author”>/” title=”Home” class=”fn”><?php bloginfo(‘name’);?></h1>

    Do i need to do something with this as well or leave it as is?

    thank you!

    it seems to be missing something… can you copy and past the whole line and paste into backticks?

    You may need the full path to the image something like


    depending on your directory structure

    thank you, did that, it is still not working…

    Could you kind people please check the css, it is exactly this:

    background-image: url(‘images/red-heart.png’) no-repeat top left;

    should it be “h1.vcard author{” etc….. ? and do i need commas or something between all these elements?

    The header php code is exactly

    <h1 class=”vcard author”>/” title=”Home” class=”fn”><?php bloginfo(‘name’);?></h1>

    ( don’t know why it didn’t paste fully above! )


    <h1 class="vcard author"><a href="<?php echo get_option('home'); ?>/" title="Home" class="fn"><?php bloginfo('name');?></a></h1>

    now, i get what backticks are!

    get rid of the / after

    <?php echo get_option('home'); ?>

    and before “title

    and see if that helps…

    i just did this

       background-image: url('http://www.heartonmysleeve.com/wp-content/themes/manifest_v1.1/images/red-heart.png') no-repeat top left;

    and done nothing with the header.php and it is still not working… 🙁

    Can you leave it with me for a little while while I eat and I’ll get back to you.

Viewing 15 replies - 1 through 15 (of 27 total)
  • The topic ‘want to add small image to the left of my "site title". Theme: Manifest 1.01’ is closed to new replies.