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

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

h1.vcard{
   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

h1.vcard{
  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:

h1.vcard{
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

https://heartonmysleeve.com/wp-content/themes/yourthemename/images/red-heart.png

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:

h1.vcard{
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! )

THANK YOU!

<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

h1.vcard{
   background-image: url('https://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… ??

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