New Script Add Images And Colored Text To Blogger Comments




| 20 comments

images in blogger commentsIn this post Macro Raman shares a fantastic script he created that allows people for the first time to add images, different color text and scrolling text to comments on Blogger.Here on Spice Up Your Blog we have made great strides in improving the Blogger comments with tricks like Adding Replies To Blogger Comments and Adding Smileys and Emoticons to Blogger Comments.This script will bring the comments on your blog to another level allowing readers to use different colors, share images and just for fun use Marquee scrolling text when they comment.

Live Demo - Click To See The Demo : Blogger Comment Images And Colors

Macro writes his blog in Tamil but has done a great job in Writing this post in English to share his new script with Spice Up Your Blog Readers.I will summarise the steps and show you how to add a message above the comment form to let readers know of the options below Macro's post.

Note - This post and script can not be republished on other blogs by request of Author, if you want to share this you may link to this post.

New Blogger Scrip Display Images And Colors In Comments


Guest Post - By Macro Raman

We do see many of them chats with shorten words, symbols, smileys and more to tell in short form. Now its a time of zero typing where image speaks a lot more than words. Let us imagine there is a colorful animated new year greeting post where you like to greet the author the same way.You know greeting pictures speak Louder than words,so you too created a splendor greeting picture for the blog author but the blog restrict you to post images. Then?

Of course, Blogger.com restrict the readers to post images in their comments column.We know It is possible to posts picture comment in wordpress blogs by adding just <img> tags. then what is the solution for the blogger's blogspot? Here I introduce new javascript which try to minimize the maximum extend of this restriction. and be aware of it that it doesn't work in script disabled browsers.

How to add image?

This is just simple, you need to start with [im] and end with [/im] place your image address in between of it.Like This :

[im]http://domain.com/folder/sample.jpg[/im]


How to install?

This is the code

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

which you need to paste it before </body> in the source code of blogspot or any blogger's website.

That's it The Script take care of it, and don't forget to tell to your readers about picture comments.

What more ?

Do you need more colorful comments? then use :

[ma]....your text...[/ma]
for marquee effect i.e. running letters.

[co="red"]...your text...[/co]
for red colored text. you can change the color as your wish.You can try this code and add what you feel, if you agree.

Summary And Message Above Comments



Add The Script To Your Blog

Step 1. Click Design > Edit Html





Step 2. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - More Info)

</body>

Step 3. Copy And Paste The Following Code Directly Below / Under </body>

<script src='http://hosting.gmodules.com/ig/gadgets/file/105066904960012479556/nccode.js' type='text/javascript'/><a href="http://www.spiceupyourblog.com">Best Blogger Tips</a>

-To add an image to a comment wrap it in [im][/im] like this :

[im]Image URL Here[/im]

-To Change Color Of Text In Comment Wrap It In [co="color"][/co] Like This :

[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.

-To Add Marquee Text Wrap It In [ma][/ma] Like This :

[ma]Comment Text[/ma]

Add Message Above Comment Form


You will want to let your readers know the options so below i will show you how to add a message above the comment form.You can see the message we are adding on the demo.

Step 1. In your Blogger Dashboard click > Design > Edit Html > Expand Widget Templates :







Step 2. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - More Info)

<p><data:blogCommentMessage/></p>

Step 3. Copy And Paste The Code Below Directly After <p><data:blogCommentMessage/></p>

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><b>Comment Options -</b> You Can Add Images, Colored Text And Marquee Text To Your Comment.<br/><br/><b>Image -</b> [im]Image URL Here[/im]<br/><b>Colors - </b>[co="red"]Comment Text Here[/co] - Change Red To The Color You Want.<br/><b>Marquee -</b> [ma]Comment Text[/ma]<br/><b>Get This -</b> <a href="http://www.spiceupyourblog.com/2010/12/images-colored-text-blogger-comments.html" target="_blank">Blogger Comment Script</a><br/>

Save Your Template and your readers will now know all the options they have.


Join over 5000 Subscribers! Please sign up to receive Updates.

SUYB has its Focus on Quality. If we post Crap, you can unsubscribe.

No Spam and No Garbage! - Use RSS, Twitter & Facebook as an Alternative


If You Enjoyed This Post Please Take 5 Seconds To Share It.

20 comments:

  1. Awesome awesome awesome this blog rocks !!

    ReplyDelete
  2. Love This script what a great idea thanks.

    ReplyDelete
  3. This blog post has great ideas to impart. Thanks for sharing this information.

    ReplyDelete
  4. Yay! We added that two!! Thank you! I noticed it doesn't show up in 'Preview comment' but it appears after you click 'Post comment,' by the way.

    Merry Christmas!!

    ReplyDelete
  5. Amazing script thanks.

    ReplyDelete
  6. Hi. First of all I would like to say what a great site you have. I have been using it for a month or so now and really seeing the results. I am half an inch longer already and a good bit thicker. Thanx again.”

    ReplyDelete
  7. Superb blog post, I have book marked this internet site so ideally I’ll see much more on this subject in the foreseeable future!

    ReplyDelete
  8. I have been trying to get such a blog for a long time.I think it is the blog which i needed....
    Thanks for so good effort.

    ReplyDelete
  9. Hey i want comment format as like you in my blog please tell me how i able to get it...

    ReplyDelete
  10. This is awesome. Thank you so much to the writer of the code and SUYB for this. It works great. Also you can put these bracket codes inside of other bracket codes so you can have a scrolling image if you want or scrolling colored text. I tried that and it works too. COOL BEANS!!!!!!!!!!!!!!!!!

    ReplyDelete
  11. Exited to see. Really a wonder. To implement it in my blog. Thanking You both for such a lovers of innovation. With Regards.

    ReplyDelete
  12. Thank You very much. Added the code and started using delighting Spice. Spice working in 'Post Page Comments only' but not in 'Comment Page Comments (Pop up). Any wrong insertion by me? Guide Please?

    ReplyDelete
  13. Will you please announce the Additional CODE to be added so that the Spice work at ' Comments Page (pop up)' Comments as well as at 'Recent Comments'. Kindly Help, Please?

    ReplyDelete
  14. Does anyone know what needs to be added to the code (and where) so that images that are added to a comment are automatically resized to fit the blog?

    ReplyDelete
    Replies
    1. @Paul. Sorry to interfere. Me learning a lot here and very much like this blog.
      @David. Please try and see, if your are using this Script for added images : [im#]. . . [/im#]

      Delete
  15. This is something I have always wanted. Thank you so much. Brilliantly described, but also thank you to The Angulo's comments as I kept looking on Preview and thinking it wasn't working, but on publishing there was my animated gif in my comment :)

    Success!

    ReplyDelete
  16. Love it, the resize tip with [im#]. . . [/im#] works too! simple and great!

    ReplyDelete
  17. Simply wonderful blog..Its helpful for those, who are walking on blogging sites and put their comment there..

    ReplyDelete



Important - If you ask a question make sure you tick the "Notify Me" box below the comment form to be notified of follow up comments and replies.


Hire Us