Taken from: https://sites.google.com/site/mori79/html-gadgets/how-tos/comment-form-board

Comment Form & Board

posted May 11, 2011 8:39 AM by Morteza Mirmojarabian   [ updated Aug 29, 2012 10:11 AM ] The comment system at the bottom of this page is a live example of my approach to viewers comments in Google Sites.

Comment Form

A form to receive comments

Insert

Click Edit page ► Insert ► More gadgets ► Public ► Search Templates: "Comment Form" by Mori ► Select.

Some settings

• Google form key
  Go to your Google Docs ► click Create ► From template ► search Public Templates: "Comment Form & Board" ► Use this template ► copy the form key, which is at the bottom of the page. For example: dEZzbmM1V21IdWcwYm9RWFNFeTJ1SVE6MA (For me: dEtyemhJaDlCZDZkdWpxOGpzWkI2RlE6MA )

• Speech bubble border color
  You can pick any HTML color and its darker/lighter shades.

• Form elements background image
  The default is a 1×50px gradient image. Feel free to use it or create yours.

• On submit
  As an alternative to displaying the confirmation message, you can redirect users to a custom 'thank you' page, to the same page where the form is, or anywhere else you wish.

• Width
  800px, i.e. multi-line text field width:492px + single-line text fields width:244px + margins and borders:64px

• Include a border around gadget
  Uncheck it.

• Display title on gadget
  Uncheck it.
  
  
  

Comment Board

A guestbook to display comments

Insert

Click Edit page ► Insert ► More gadgets ► Public ► Search Templates: "Comment Board" by Mori ► Select.

Some settings

• Google spreadsheet URL
  Get back to your Google Docs ► open the template copy ► click File ► Publish to the web ► select Comments under Sheets to publish ► uncheck Automatically republish when changes are made if you're going to moderate comments before they appear on the board and then manually republish them ► click Start publishing ► copy the generated link. For example:
  https://docs.google.com/spreadsheet/pub?key=0Aliqp0kGPjWsdEZzbmM1V21IdWcwYm9RWFNFeTJ1SVE&single=true&gid=1&output=html (For me: https://docs.google.com/spreadsheet/pub?key=0At1jNP0rWU-EdEtyemhJaDlCZDZkdWpxOGpzWkI2RlE&single=true&gid=1&output=html)

• Feed URL
  Select ATOM under Get a link to the published data ► copy the generated link and click Close. (DL's note, there is an issue with that. The spreadsheet has to be shared with another user. Once that user receives the email notification that a file has been shared, simply click on the link provided and once in the spreadsheet, click File, Publish to the Web and select ATOM from the selection box that is defaulted to "Web Page". For me: https://spreadsheets.google.com/feeds/list/0At1jNP0rWU-EdEtyemhJaDlCZDZkdWpxOGpzWkI2RlE/od7/public/basic) For example:
  https://spreadsheets.google.com/feeds/list/0Aliqp0kGPjWsdEZzbmM1V21IdWcwYm9RWFNFeTJ1SVE/od7/public/basic

  Option: Activate your feed at Google FeedBurner to get more subscription options and keep track of your statistics.
  Go to FeedBurner ► change https to http on your ATOM link and paste it ► click Next ► click Next ► copy the feed URL.
  For example: http://feeds.feedburner.com/google/fWTL  (For me: http://feeds.feedburner.com/google/jQtv )
  Click Skip directly to feed management ► Publicize ► Email Subscriptions ► Activate.
  You're done although there are still many other things to customize on FeedBurner.

• Dynamic height

  • Yes: Your gadget grows as users add comments.

  • No: Specify a static height. The default value is 86px.

• Feed icon
  All your icons should be 16×16px.

• Include a border around gadget
  Uncheck it.

• Display title on gadget
  Uncheck it.

Hide Comments sheet

It makes your spreadsheet interface cleaner. But before that there are two things you might want to do:

• Customize the timestamps format
  Click on the Comments sheet tab ► click the Timestamp column letter to highlight the entire column ► click Format ► Number.

• Rename the sheet
  Select Rename from the same sheet tab menu.

Now select Hide sheet from the same menu.

Note: To unhide it at any time, click View ► Hidden sheets.

Format Source sheet

It improves the spreadsheet usability.

• Resize columns
  There are two ways to change column width:

  • Place your mouse pointer on the columns dividing border ► click and drag the arrow in the direction you'd like your column to expand or contract.

  • Click on the column letter menu ► select Resize column ► enter a new value ► click OK.

• Highlight admin's comments
  Click on the Name column letter menu ► select Conditional formatting ► select Text is exactly from the drop-down menu ► enter the admin display name ► set a text color and/or cell background color ► click Save rules.

• Define the correct TimeZone: File, Spreadsheet Settings, select GMT-5

Get notifications

Here are a couple of options:

• Click Subscribe to comments to get updates in your feed reader or via email.

• Define a notification rule on the spreadsheet
  Click the Tools drop-down menu ► Notification rules ► check A user submits a form and Email - right away ► click Save ► Done.

Answer comments

Simply type in your answer on the row below the viewer's comment. If the row below is already filled, right-click the comment row number to highlight the entire row ► select Insert 1 below from the drop-down menu ► enter your comment.

Remove spam

Right-click the spam comment row number to highlight the entire row ► select Delete row from the drop-down menu.

Republish comments

After you've done moderating comments, click the File drop-down menu ► Publish to the web ► Republish now.