Search This Blog

Wednesday, February 08, 2006

How to put an image in the sidebar

UPDATE: For another better version of this post, go to Blogger Tips and Tricks - How to put images in the sidebar

If you want to load an image in the sidebar, you can't upload it the same way as if you are putting it in the content column using Blogger upload facility. You will first have to host the photo on the web, perhaps using the popular photobucket and get the url for the photo. Alternatively you can use a workaround to get Blogger to host for you. If you do, first, post an empty post with the photo uploaded in the normal way. You may click on the photo to highlight it, then click on the corner and drag it to the size you want in the COMPOSE mode (wysiwyg window). Open the post, and click on the photo. You will be taken to a page with only the photo. As an example, I will upload an image in this post. If you click on the image (try it) you will see that the url of the image is
http://photos1.blogger.com/bl....2.jpg
. Copy the url of the (your) photo. Click the TEMPLATE tab to open the template editor. Then in the sidebar, where you want the photo, type in this code:

<p><img src="http://photos1.blogger.com/bl....2.jpg" alt="photo title" /></p>.

You should substitute the url with your photo url, photo title with your photo title in alt="photo title".

Where in your template you paste the code will depend on where you want the photo. Say, if you want it, for example, just after the profile, you should paste it after

<!-- Begin #sidebar -->
<div id="sidebar"><div id="sidebar2">

<!-- Begin #profile-container -->
<$BlogMemberProfile$>
<!-- End #profile -->

For other positions, refer to this post as a guide: Blogger template tutorial - adding content via the template

UPDATE: For another better version of this post, go to Blogger Tips and Tricks - How to put images in the sidebar

7 comments:

  1. The code line is missing.

    ReplyDelete
  2. Thanks for pointing this out.

    ReplyDelete
  3. I didn't get anything with that code. But I am going to assume it is my problem.

    This would put the photo on the right hand sidebar, right.

    Where would it show up..above adsense, or after, all the way at the bottom?

    Can I put thumbnail photos on the left side that has nothing in it. I'd like to add photos of all my dogs with their names and such under them. That dead space on the side would be good. And if that is not possible, how do I link to a photo album type page?

    ReplyDelete
  4. Hi, I'm using 3 column Minima Dark for Blogger Beta and I cannot find begin sidebar anywhere in my template, with or without expanding the widget templates. Can someone please help?

    ReplyDelete
  5. Hi crg,

    This post is for old classic Blogger template. For New Blogger template, refer to

    Add picture in sidebar for New Bloggr

    Easy way to add picture to sidebar for New Blogger.

    Peter (Blog*Star)
    Dummies Guide to Google Blogger
    "online book" in progress

    ReplyDelete
  6. How do I center an Image in the sidebar? They are all left justification! I want them center

    ReplyDelete

Related Posts Plugin for WordPress, Blogger...

Find topics by using the Google custom search box above which can search multiple blogs, or the SEARCH BLOG in the left corner of navbar. You can also find topics in the Label List and Categrories in the right sidebar.

For more information and special deals related to any of the issues on this page, place your cursor over the double-underlined links. All information supplied by Kontera.com.

Disclaimer: This blog has no relation with Wiley Publications