How to insert an image or photo into your blog comment
This is something that’s incredibly easy, and can increase the visual impact of your comments. I recently mentioned how I’d post this little tip after some of you had a few issues when showing off your business card designs (see the latter comments).
I’ve previously written a little about the importance of images in your articles, but not touched on images in comments. What better way to get yourself noticed when someone is scrolling through a long list of comments?
Inserting an image file into a blog comment is very straight-forward, once you know how. Here’s the tiny 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.
One extra tip, my comment box can hold an image width of around 400px maximum.
If the image you’re inserting is larger than 400px in width simply 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 comment box. Feel free to give it a go yourself. Perhaps you have a business card that you can show off like others have on this post: Cool business card designs.
If there are any other things you think I can help out with, please ask. If I’m able to assist I’m more than happy to.
Related posts on this site
28 spot-on reader comments to “How to insert an image or photo into your blog comment”
What are your thoughts?
Simply fill in the form below. All comments are moderated so you may experience a short delay before your comment appears. Comments should be respectful of other voices in the discussion. I reserve the right to edit or delete comments at my discretion.
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. That’s why it looks a little distorted (the downside of resizing).
Very cool idea!
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!
I didn’t know about the drag and drop for Firefox, so thanks for adding that!
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.
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..
[...] How to insert an image or photo into your blog comment: When you leave a comment on a blog post, usually, depending on the number of comments that post gets, your words probably won’t stand out a lot. David tells us how to insert an image in a comment! [...]
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.
Funny.. I was sure to have this picture embedded:
hmmm.. maybe it doesn’t work?
PS. This was the picture: http://img183.imageshack.us/img183/2606/4697610526f055c51e9pr2.jpg
even though i already know how to do this you made it fun to relearn about it. this is a great site.
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.)
Well here goes,
My company Logo should appear after this text:
Hope it works.
Best wishes to all.
Hey David its not working!!
Another great tip, thanks David!
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?
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.
Sorry for not getting back sooner. I was making my way back to Scotland.
Rob O.,
Chris does have a very nice blog at Blog-Op. I read it regularly, but never tried inserting an image into the comments.
Pinksy,
I too be sure to resize image files before inclusion. It’s the best way.
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.
musicmixingguru,
Thanks a lot for the kind words. It’s always nice to know I’m writing something of interest.
Armen,
I noticed that comment about your sidebar. Hmmmm. Good luck with the redesign. Knowing you, I’m sure it’ll be an improvement.
David,
Thanks for giving it a shot. What’s the URL of the image 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 above? 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… yet.
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.
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.
That’s awesome! I never really thought about doing that, but it’s good to know I can just in case ;).
Please accept my apologies if there’s some issue at my end. I’m going to look into it later today, so thanks for letting me know.
That’s great you got it working on MySpace however. In the past 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.
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.
THis is a great post, David. I actually didn’t know this. Is it only WordPress? Does it require a plugin?
Thanks for letting me know about the issue. I’m glad you were able to sort it out elsewhere. For now however I’m not sure on the solution.
Dawud,
Sorry for taking a while to reply. 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 fine, so perhaps you could give it a go on one of your own articles when an image will speak louder than words? It’d be great to know if it works for you.
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.
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?
I’m not familiar with Friendster blogs, so can’t help unfortunately.