As promised, here is the revised version of my Feed Links Widget. Just click the button and follow the wizard!

Some Notes
Due to circumstances beyond my control, if Blogger changes the URL format for feeds this hack will break (and I will, of course, speed to fix it 😉 ).

If you want to make it easier for others to add this hack, clicking the button below will add the button above to your sidebar.

If there is one hack I get requests for more than any other it is this. My inline comments form on Blogger BETA. It was my first ever hack (before I had even fully moved to Blogger), and probably still my favourite as the most useful. I recently blogged somewhat optimistically about my progress, which only increased the demands. I regret to inform you that I have hit a wall. Perhaps not unsurmountable, but a huge one.

The security token scraping did not work.

I’m not entirely surprised. After all, Blogger added the security token code to prevent people from doing just what I am attempting. I cannot say that I fully understand how the whole technology works, or why my attempts to circumvent it have failed, I only know that they have. It may take help from Blogger themselves (bah!) to get this working.

For the community : to those who wish to put their heads with mine on this problem. The code for this hack on BETA, such as it is for as far as I’ve got, can be found at the following URLs:

http://jscripts.ning.com/get.php?xn_auth=no&id=1338954
http://singpolymaplay.ning.com/blogger/blogger_beta_comment_form.txt
http://www.ning.com/view-source.html?view=app&op=viewFile&appUrl=singpolymaplay&fileName=commentFormData.php¤tDir=%2fblogger

As a side note : installing this hack as is actually does sort of work. But it errors every time and requires that the user push the button on the inline form, and then on the other form. (Similar to what is happening here since I was forced by mega-spammers to turn on word verification…)

Blogger (and Google in general) have been getting some bad press lately. They decided to make a counterpost on Buzz, not a bad idea. Some people are cynical about the entire post, but it has good and bad points.

They’re right, Google is only a company and its employees are only human. Mistakes are made and they’re very good at fixing (at least the big ones). The do eat their own dogfood and that is why bugs like this can be spotted faster.

It’s also what causes the press.

If a single Blogger blog malfunctions, no one cares. Unless that single blog is the Google blog. They can’t expect bloggers not to notice this. This isn’t the old-style press where we wait until it’s a proven, serious, do-or-die issue before printing. Bloggers write while the news is hot. If in two hours it’s all fixed, that’s not the point.

Are our expectations of Google and Blogger too high? Undoubtedly. We all know that as consumers, especially geeky consumers, we demand more than is possible. That’s just the way things are. Users of my hacks expect far more than I can deliver, and I expect far more than Blogger can deliver. The mark of greatness is handling this well.

Their post makes some good points, and I won’t disagree with them completely. We can give them some slack. However, they try to get out of responsability a little too much. EAT your dogfood, FIX the service, and BE RESPONSIBLE for what happened, even if it’s no big deal. They’ve done their PR bit, but actions speak louder than words. It is far more powerful to say ‘we did’ than ‘we do’. So while I sympathise with them, I must side with the great penguin:

Don’t give me excuses – give me results!

I have run up into a wall in translating my inline comment form hacks to Blogger BETA code. The translation is done, but the forms don’t really work. Why not? The submission always produces an error. A quick analysis shows that Blogger BETA comment pages generate auth keys now to prevent non-Blogger forms from spoofing info (just what this hack tries to do). While this is a security feature, it makes this hack (as it currently is) pretty useless.

So what am I going to do? I am going to attempt the creation of an offsite PHP script to scrape the auth key out of the form code (surprised?). Based on how these systems usually work, it should fix the problem if this is then included (via JavaScript) into the comment form code. What this does mean is that the comment form will require JavaScript to fuction, and so I will probably just translate the more popular asynchronous version which does already anyway (since the purpose of keeping the other version alive was to have one that didn’t require JavaScript).

If this approach is successful I will create a similar partner script to enable the inline comment forms to work with word verification, something many people have asked for in the past.

So I’m not giving up just yet, but the process may take longer than I had anticipated. To see the literally-translated hack with error messages see my BETA test blog.

There was a typo in this post! I finally found it. Your templates should be able to save after applying this hack now 😉

I have released an asynchronous version of this hack.

So now that people have stopped asking me for this feature (because I said I couldn’t do it) I’ve done it! Screen-scraping to the rescue! If you re-install this hack you’ll get more manageable code in your template, bug fixes for timezone logic, and comment author links. Finally! Yay! This also improves compatibility between this hack and my comment photos hack.

You can not link to author’s blogs or profiles from the main page because that data is not available in the feed Blogger provides. Some day I may dream up a way to do this — or Blogger may start providing the information. For now, it’s not happening.

Updated 2006-11-27 to work with new Native JSONP, should be faster now.

As I said back when I first released my BETA template, displaying comment data anywhere but on item pages in Blogger BETA is ‘impossible’. That is what this hack overcomes. Both just plain displaying comments on main and also peek-a-boo comments are now possible (revised template coming soon 😉 ).

1. Go to the layout on your BETA blog and select ‘Edit HTML’.
2. Check the ‘Expand Widget Templates’ box.
3. Paste the following code into the <head> section of the template:
   
   <script type="text/javascript">
   //<![CDATA[
   var comment_form_template = '<div class="commentelem"><div class="comment-poster">[[AUTHOR]]</div>\n'
   + '<div class="comment-body"><div class="innerCmntBody">[[BODY]]</div></div>\n'
   + '<div class="comment-timestamp"><a href="[[PERMALINK]]" title="comment permalink">[[DATE]]</a></div></div>\n';
   //]]>
   </script>

   <script src='http://jscripts.ning.com/get.php?xn_auth=no&amp;id=2706908' type='text/javascript'></script>

   Advanced users will note that the first <script> section is taken from the asynchronous comment form code, and that if that is installed (presuming I get a version working for Blogger BETA) that the code only needs to be in here once. It can be changed to fit the code of the blog itself to improve appearance, etc. Kudos to Johan Sundström for his help with the date code.

4. If you want peek-a-boo functionality, you will need this code in your <head> section somewhere as well:
   <script type=”text/javascript”>
   function toggleitem(postid,linkid,newtxt,displaytype) {
   if(!displaytype) {displaytype = ‘block’;}
   var whichpost = document.getElementById(postid);
   if (whichpost.style.display != “none”) {
   whichpost.style.display = “none”;
   } else {
   whichpost.style.display = displaytype;
   }
   if(linkid) {
   var lnk = document.getElementById(linkid);
   lnk.href = “javascript:toggleitem(‘”+postid+”‘,'”+linkid+”‘,'”+lnk.innerHTML+”‘);”;
   lnk.innerHTML = newtxt;
   }
   }//end function toggleitem
   </script>
5. Find the place in your template where the comments are generated on item pages, it will probably look something like this:
   <b:loop values=’data:post.comments’ var=’comment’>
   <dt class=’comment-author’ expr:id='”comment-” + data:comment.id’>

   And directly before that, insert this code:

   <b:loop values=’data:post.feedLinks’ var=’f’>
   <b:if cond=’data:blog.pageType != “item”‘>
   <script expr:src=’data:f.url + “?alt=json-in-script&amp;amp;callback=peekaboo_comments_display”‘ type=’text/javascript’/>
   </b:if>
   </b:loop>
6. If you want to use peek-a-boo functionality put, find the code a little bit before that which you just inserted that looks something like:
   <b:includable id=’comments’ var=’post’>
   <div class=’comments’ id=’comments’>

   And replace that second line with:

   <div class=’comments’ expr:id='”comments” + data:post.id’>
   <b:if cond=’data:blog.pageType != “item”‘>
   <script type=’text/javascript’>
   document.getElementById(‘comments<data:post.id = ‘none’;
   </script>
   </b:if>
7. Next, find the post-generating code. It will look start something like this:
   <b:includable id=’main’ var=’top’>
   <!– posts –>
8. In this section there will be a block of code that looks something like:
   <b:if cond=’data:blog.pageType == “item”‘>
   <b:if cond=’data:post.allowComments’>
   <b:include data=’post’ name=’comments’/>
   </b:if>
   </b:if>

   Replace it with this:

   <b:if cond=’data:post.allowComments’>
   <b:include data=’post’ name=’comments’/>
   </b:if>
9. If you want to use peek-a-boo functionality you need to find the post template section, which starts something like this:
   <b:includable id=’post’ var=’post’>

   And then find the link to the comments area, which looks something like:

   <b:if cond=’data:post.allowComments’>
   <a class=’comment-link’ expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><b:if cond=’data:post.numComments == 1′>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
   </b:if>

   And replace it with:

   <b:if cond=’data:post.allowComments’>
   <a class=’comment-link’ expr:href=’data:post.url + “#comments”‘ expr:onclick='”toggleitem(&amp;quot;comments” + data:post.id + “&amp;quot;);return false;”‘><b:if cond=’data:post.numComments == 1’>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
   </b:if>
10. Click ‘Save Template’ and, if it appears, ‘Confirm & Save’, then view your blog.