I'm a graphic designer and writer in Northern Ireland. Welcome to my blog.

How to insert an image into blog comments

Blog comment

Adding an image to a blog comment is straightforward. Here’s the piece of code you need.

[img src=" "]

Simply insert the http:// address of your uploaded image between the quote marks above, then replace the square brackets [ ] with < > and you’re done.

Update: 21 April 2009
When logged in, I can insert images into my own comments, but there are issues with visitors doing likewise. I’m unsure what’s missing, but that’ll be why your test won’t work here.

If the image you’re inserting is larger than the width of the comment box use the following code with the width addition (again inserting the URL and changing the brackets:

[img src=" " width=400]

You’ll see below how I’ve inserted an image into the comments. Perhaps you have a business card that you can show off like others have on this post.

My second book on Amazon

Related posts

32 comments about “How to insert an image into blog comments”

  1. Cassette tape

    Above is an example of how the comments can be given more impact with the use of imagery.

    The actual size of the image is 460px in width. I used the resize code to bump it down to 390px so it might look a little distorted (the downside of resizing).

  2. Very cool idea!

  3. Here’s an additional tip to view resized images quickly at their natural size. This only applies to people using Firefox though!

    Simply click on the image, and then ‘drag’ it to a space on your tab bar. I find this quicker than right-clicking and choosing ‘View Image’ – which is another option!

  4. Paul, I didn’t know about the drag and drop for Firefox, so thanks for adding that!

  5. Some blogs strip out image tags in the comment code. No errors are generated – and other HTML code is accepted & applied – but the image simply isn’t there. Noticed this over on Chris Lodge’s excellent Blog-Op site earlier this morning.

  6. Awsum! I really want to try this on my blog.. but does it work with Blogger blogs?

    It’s not a plug-in is it? If it is..

  7. hmmm.. maybe it doesn’t work?

    PS. This was the picture: http://img183.imageshack.us/img183/2606/4697610526f055c51e9pr2.jpg

  8. Also, I seem to remember when going through the pain of building my design, resized images don’t always get resized properly in older browsers. I always photoshop my images down to the right size now, just to be sure.

  9. Funny.. I was sure to have this picture embedded:

  10. This is an excellent post David, I had no idea.

    (BTW…it looks like I’m going to have to work on a new design for my blog. I received another complaint about a sidebar issue. So that on top of it not working in Safari, is not good.)

  11. Well here goes,
    My company Logo should appear after this text:

    Hope it works.
    Best wishes to all.

  12. Hey David its not working!!

  13. Another great tip, thanks David!

  14. Anyway to make it an auto resize to fit, cos it seems more tailored to fit your blog width, and my own blog may be differet?

  15. David: I hope this is ok to ask, it’s somewhat related to posting a picture.

    How do I force words to be below a photo? For example, you can see my link here: http://www.beyondbehaviors.com/2007/05/26/whispering-palms-vietnam-trip-party/

    How do I make the “Photo: Halong Bay Sunset” fall underneath the photo?

    Thanks.

  16. Rob O., I’m a regular at Chris’s blog, but never tried inserting an image into the comments.

    Pinksy, I’m also sure to resize image files.

    Ilker, it’s not a plugin, and unfortunately I’m unfamiliar with the ins and outs of Blogger. Using the code I typed in the article, your image should be below, resized to 390px in width:

    I’m unsure why it wasn’t working for you. There should be no spaces between the speech marks.

    Armen, I noticed that comment about your sidebar. Hmmmm. Good luck with the redesign.

    David, thanks for giving it a shot. What’s the URL you were trying to show?

    DT, I’d love to know the code for auto-resizing. I think perhaps it has to do with the comment box, and not allowing anything to be pasted out-with its confines. For example, you see the URL that Ilker pasted? It overlaps the white text area into the grey slightly. I know there’s a way to keep everything confined, but I’m just not sure how.

  17. Steve,

    Any questions are very welcome. I’m always glad to be of any help I can.

    I’m not exactly sure what CSS you need to edit. I reckon it has something to with an ‘inline dispay’ but I know some of my readers have the right answer. Can anyone help Steve out here?

    Your website is based on the same theme as mine. To get around your issue I create all images as 460 pixels in width. This covers the entire width of the text area and also adds more visual interest.

    Nice photos by the way! I loved my time in Vietnam and you can see some of my Vietnam photos here.

  18. Hi David,
    The image I was trying to show is http://www.davidbeardmusic.com/David_Beard_Music_Productio.gif
    I have however managed to attach it to a message I left for someone on MySpace with success.
    I think here though you’re the only one that can submit images as the posts from the others aren’t showing either.
    Best wishes,
    David Beard.

  19. That’s awesome! I never really thought about doing that, but it’s good to know I can just in case ;).

  20. David, my apologies if there’s some issue at my end. I’m going to look later today, thanks for letting me know. That’s great you got it working on MySpace. I’ve posted a fair few images on a couple of MySpace forums (photography, design etc.).

    Sean, cheers for stopping by. I hope things have been good with you lately.



  21. Hi David – I don’t think this image will load but I’ve taken your tip further and embedded alt text and a hyper link to my website within the image. Its working a treat on MySpace. Won’t work on MyBlogLog though.
    Best wishes,
    David Beard.

  22. This is a great post, David. I actually didn’t know this. Is it only WordPress? Does it require a plugin?

  23. David, thanks for letting me know. I’m glad you were able to sort it elsewhere.

    Dawud, there’s no plugin necessary, although it seems that some others can’t insert their own images into my article comments. I can do it, so perhaps you could give it a go on one of your own articles?

  24. I wonder if it has to do with you being ‘logged in?’ You could test it being logged out. And also you could create a new user in WordPress, login as that user and see if you can post a comment photo then.

    Or, we could just ask Lorelle.

  25. it doesnt work in friendster blogs…i think HTML codes and img codes are just for forum posts….
    is there another way to post an image int he comments of friendster blogs?

  26. Danielle,

    I’m not familiar with Friendster blogs, so can’t help unfortunately.

  27. Thank you for the short tutorial, I have always wondered how to to that, but never got round to actually finding out how to. Thanks!!

  28. Hopefully this works for me. I’ve been looking for this answer for a while now.

  29. Hi Melissa,

    You’ve reminded me to add an update to the post. I published this quick tutorial a couple of years back, and never quite got it working for visitors. I’ve seen it work on other blogs, though, so it’s certainly possible. I guess I’m just missing a little required code somewhere.

  30. David, nice thoughts, however you didn’t mention a very important aspect about images, optimization. Some people may not be aware of the impact a large image has on usability and bandwidth.

    Thanks.

  31. Thank you, David Airey!

    My name is Kristina Cummins and I just started blogging for a Digital Civilization’s class I am taking at Brigham Young University. We are responsible for shared learning and everyone in my class is required to blog and share insights.
    Well, I haven’t blogged very much before and my blog was very texty/boring. I decided to Google “how to insert a picture into blog ” and your blog was the first hit to come up.
    I followed your coding pattern and there is now an image of Martain Luther on my blog!
    Thank you very much! You saved my grade and expanded my horizons. I dedicated a post to you on my blog, “americanbeautybykristinacummins.blogspot.com. Have a great day!
    If you have an suggestions about blogging or making things more interesting…please let me know! I am open to learning. Thanks again.

  32. You’re very welcome, Kristina. Glad to be of some help. Thanks for the mention on your blog, and good luck with the studies.

    Update:
    Comments closed. Thanks for stopping in, though.