How do I post a photo on my blog title bar?

Question: ” how do i post a photo on my blog title bar where my blogs name is written?”

Well, first you must get your photo hosted on the web with perhaps the free Photobucket. If you don’t want to do that, and you want Blogger to host your photo. To see how it can be done, have a look at this post: Getting Blogger to host your photo for the profile, Header, etc. Then sign into Dashboard, select the relevant blog, click TEMPLATE tab, and look for the block of codes that start with and ends with and refer to the block of codes below:

<div id="header">

<h1 id="blog-title">

<img src="http://photos1.blogger.com/b...colo.gif">

</h1>
<p id="description">A blog about my brush with organic farming in my little backyard garden.</p>

</div>

A blog about my brush with organic farming in my little backyard garden.

Replace “http://photos1.blogger.com….colo.gif” with the url for your photo and replace the description “A blog about….backyard garden” with your description.

If you want the graphic together with the text title, then do this:

Just replace the http://imageurl.jpg with the actual url of your photo. To make the graphic in the Header clickable to go back to the home (main/index) page

A reader of this blog asked how to make the image clickable to go to the home page, so what I have done is to do some experimenting on a rarely used blog to put in the clickable image: Sheryl’s template (close new window to get back to this page). Try clicking on the graphic in the header and see where it takes you.

For that blog, I am using the Minima Black template. If you use other templates, the codes might be slightly different. Here is the original code for the header:

<div id="header">

<h1 id="blog-title">
<ItemPage><a href="<$BlogURL$>"></ItemPage>
<$BlogTitle$>
<ItemPage></a></ItemPage>
</h1>
<p id="description"><$BlogDescription$></p>

</div>

What you have to do is to delete <$BlogTitle$> and replace it with
<div id="header"> <h1 id="blog-title"> <ItemPage><a href="<$BlogURL$>"></ItemPage> <a href="<$BlogURL$>"><img src="http://img.photobucket.com/albums/v336/cikgu/backyardorganicfarming.jpg"></a> <ItemPage></a></ItemPage> </h1> <p id="description"><$BlogDescription$></p> </div>

Note: If you don’t want to scroll throught the scroll box to see the codes, you can click on the inside of the scroll box, press ctrl+A, right-click on the mouse and select copy, then paste it into Notepad. Then you will be able to see the whole text. I am forced to put the codes into scroll boxes, otherwise the long codes will send my sidebar sliding to the bottom of the page.