Monday, March 31, 2014

Picture in the blog title, blog description, post title

Want to have a logo or other picture next to the blog title? No problem. I have tested putting the HTML img tag <img> in the blog title and have found that it is possible to put HTML code in the blog title but subject to a maximum of 100 characters.

Here is How (If you want to control the size, click here)
To put a logo or picture next to your blog title, first thing you need to do is to upload your picture to the Internet. You can do that with a free account in Photo Bucket. After uploading to Photobucket, you will see to the right of the picture a section LINK TO THIS PHOTO. Take the URL listed as DIRECT.

Sign into www.blogger.com (Dashboard > Settings > Basic > click EDIT in the BLOG TITLE section

Then add the code below to your blog title:

<img src="photo url" /"> and save.

Picture next to blog title

You can do the same for the blog description but in this case it will be much easier because the maximum no. of characters in the blog description is 500. In the case of the post title, there seem to be no limit to the number of characters?

How to resize


If you are not happy regarding the size, there are 2 ways to resize it:

1. Just resize the original picture before uploading. For this purpose you can use the MS Paint. Open the picture file with Paint, then click the RESIZE tab. If you don't want your picture to be distorted, make sure you tick [ ]Maintain aspect ratio and just type in either the horizontal or the vertical size (as you type in 1, the other will change automatically). Otherwise don't tick it and you are free to type in whatever value for horizontal or vertical. Once you have resize to your satisfaction, save it to your computer, then just follow the instruction above

A good alternative to MS Paint is Irfanview

2. You may also upload the picture as it is, then add in an attribute to the <img> tag. If you are lazy, just rewrite it as <img src="picture url" width="x" /</img>. Alternatively you can use MS Paint or Irfanview to determine a suitable value for the height (vertical) for a give width (horzintal).

You may refer to Resizing Youtube video to fit main column or sidebar using calculation for an idea how to do it.

2 comments:

  1. This is my direct link of logo http://i62.tinypic.com/3090yub.jpg. Can you what will be my complete link for logo.
    And please tell me where I will have to post it. I am using simple template

    ReplyDelete
  2. Great tip Peter! Used it today! Thanks so much!

    ReplyDelete

Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics