Blog Mr. Bob sieck "2": Launching Comment Box

Launching Comment Box - Widget for blogger

Selasa, 18 Maret 2008 by bob sieck Tutorial Blog

A neat widget for blogger which show the comments and leave your comment form in the same page as blog when you click the 1 Comments link. Check out the screen shot of the Comment Box.

Instead of being taken to default blogger comment page this widget displays the comments in a neat box with a loading gif.

If you are looking for Recent Comment Box then click Here

Sites Running on Comment Box :

iamseriouslyjoking.blogspot.com
riena80.blogspot.com

Before you install:-
This is a Beta Version only for blogger platform. We assume you have the template layout feature in your blogger and not classic version. If not you can upgrade to template by doing this.

Backup your Template before any change. You can restore if things don't workout.
To do this Go to Template > Edit Html

Then click on Download Full Template to backup.A xml file will be downloaded This is your template.
To restore upload the same xml by browsing for the file and then clicking Upload

By installing you agree to Terms and condition

Requirements
This widget is tested in Firefox 2.0, Internet Explorer 6.0, Safari 3.0, Opera 9.22 and works fine in all version. This widget uses javascript and iframe and should be enabled in the end user browser.

You can be a beta tester and let us know your findings in the comments, be sure to include the Operating system and Browser

Installation
Here are the steps to install Comment Box on your blogger web log !

1) Click on the bellow button to install the widget.

<script src="http://technojuice10.googlepages.com/compop.js" type="text/javascript"></script>

2) You will be taken to add widget page in this page leave the Title blank and then click Add Widget

3) You will be taken to the Layout page now click Edit HTML as shown below

4) In the Edit Html page click on Expand Widget Templates check box

5) Search for the portion by Ctrl + F in the HTML for this string

span class='post-comment-link'

Here is the screenshot

6) Once found the text select the whole block as shown below :-

7) Copy the code from the link below and Paste it such that it REPLACES the above code. To do that you can delete the above code and paste immediately without changing the position.

Click to get the Code

8) Press Save template.

You are Done now check it out !

Uninstallation

To uninstall the widget First go to Template > Edit html in your blogger dashboard

Then click on Revert widget templates to default link.

Go to page elements then click edit then remove the comment box element.

Trouble Shooting

Now for all those people who screwed up. Most likely you will get this message

We were unable to preview your template

Please correct the error below, and submit your template again. Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.

Check out what the message states and act accordingly. Most likely you might have missed a tag or deleted something.
You can always copy the original template which you had saved and start all over again.

Copy the code from the code page exactly ! Do not paste on any App such as Word etc which will autoformat the code. Do not edit the code or change it any way.