2005-06-30

HTML coding with jEdit and the XML plugin

I like to code HTML in stead of using a WYSIWYG tool. After using UltraEdit for years I tried jEdit. It is free and (even for a Java program) fast, but what I like most are the plugins.

Big time saver is the XML plugin. I just love the tag completion, close tag insertion and the option to validate your HTML against the DTD.

2005-06-24

What's with the clear: both, Blogger.com?

Since a few days Blogger.com has added a div at the beginning and the end of each <$BlogItemBody$>. Prefix:

<div style="clear:both;"></div>

Suffix:

<div style="clear:both; padding-bottom: 0.25em;"></div>

Thanks for messing my blogs up, Blogger.com. There is a way to fix quirks because of this. My <$BlogItemBody$> is inside a <div class="body"> (which is standard I think). The fix is a simple CSS rule:

div.body div {
  display: none;
}

Update 2005-06-30: You can prevent the extra styled div's by setting the 'Enable float alignment' option to 'No' in your settings. Thanks to Pogenwurst for pointing this out.

2005-06-17

Non Javascript friendly way of hiding empty comments in Blogger

This is a simple non Javascript friendly way, or hack if you like, to hide empty comments in Blogger. I know that you can find other ways to do this. I found some that use a CSS rule to hide the comments and then use Javascript to detect and display them. In my version, when Javascript is turned off, comments will be visible.

The trick is to put your comments in any tag with an id attribute, in my case with the value comments. Then, directly after you've opened that tag, you have to insert some Javascript to hide it:

var comments = document.getElementById('comments');
comments.style.display = 'none';

Then you have to insert your comments, in my case a (semantic) definition list. After the comments you'll need to insert some Javascript to detect and show the comments. In my case by finding out if there were any dd tags.

if (comments.getElementsByTagName('dd').length) {
  comments.style.display = 'block';
}

Update: stupid me. There is a better way to check comments... just use <$BlogItemCommentCount$>.

if (<$BlogItemCommentCount$> > 0) {
  comments.style.display = 'block';
}

2005-06-14

New style sheet

The old look this site had was a bit boring. I experimented a bit with large text sizes and this is the result for now. You might like it or you might not. I'm not sure for how long I'm going to keep this design.. but I like it for the moment.

There was no reason for using XHTML, so I also changed the doctype to HTML 4.01 strict.

2005-06-12

Link to standard blogger.com form user script

If you are using my custom Blogger comments form on your blog you might want to have a link to the standard Blogger comments form in case you want to delete a comment. Time for another Greasemonkey user script: Blogger link standard comments form. It adds the link to the bottom of the custom form.

You might also be interested in the Blogger edit comments user script.

2005-06-10

Google open all user script v0.2

I've made some additions to the Google open all user script. You can now make settings which are stored in a cookie. Settings are: maximum number of results to open, option to skip indented results and an option to reverse the open order (bottom up in stead of top down).

Screendump

2005-06-08

Blogger large template editor user script

The Blogger template editor really is too small. I wrote a Blogger large template editor user script for Greasemonkey. It hides the navbar setting and doubles the editor's height.

Update 2005-07-19: You might also be interested in the Blogger large post editor.

Custom Blogger comments form (3)

Update 2005-09-18: Please see Custom Blogger comments form (4): spam protection. The article below is old.

This is the comments form I'm currently using. Like I wrote two days ago, this version doesn't show the Blogger screen after you post a comment. In this version I've added a 'remember me' function which uses cookies to store the data. When Javascript is disabled posting the form still works. You'll get the Blogger screen in that case though (duh!).

For those who like to copy and paste:

<form id="cFrm" action="http://www.blogger.com/login-comment.do" method="post">
<div>
  <input type="hidden" name="blogID" value="<$BlogID$>"/>
  <input type="hidden" name="postID" value="<$BlogItemNumber$>"/>
  <input type="hidden" name="isPopup" value="false"/>
  <input type="hidden" name="iden" value="Other"/>
</div>
<dl>
  <dt><label for="uname">Name</label></dt>
  <dd><input type="text" id="uname" name="anonName" maxlength="100"/></dd>
  <dt><label for="url">Homepage</label></dt>
  <dd><input type="text" id="url" name="anonURL" maxlength="100"/></dd>
  <dt><label for="comment-body">Comment</label></dt>
  <dd><textarea id="comment-body" name="postBody" cols="60" rows="10"></textarea></dd>
<script type="text/javascript">
//<![CDATA[
  document.write('<dd><input type="checkbox" id="remember"> <label for="remember">Remember me</label></dd>');
//]]>
</script>
</dl>
<script type="text/javascript">
//<![CDATA[
  var bgPosted = false;
  var cFrm = document.getElementById('cFrm');
  cFrm.target = 'bgpost';
  cFrm.onsubmit = function(){return cFrmPost()};
  if (document.cookie != '') {
    cFrm.anonName.value = unescape(document.cookie.replace(/^.*anonName=?([^;]*);?.*$/, '$1'));
    cFrm.anonURL.value = unescape(document.cookie.replace(/^.*anonURL=?([^;]*);?.*$/, '$1'));
  }
  cFrm.postBody.value = '';
  function cFrmPost() {
    with (cFrm) {
      anonName.value = anonName.value.replace(/^\s+|\s+$/g, '');
      anonURL.value = anonURL.value.replace(/^\s+|\s+$/g, '');
      postBody.value = postBody.value.replace(/^\s+|\s+$/g, '');
      if (anonName.value == '') {
        alert('Please enter your name');
        anonName.focus();
        return false;
      }
      if (postBody.value == '') {
        alert('Please enter a comment');
        postBody.focus();
        return false;
      }
      anonURL.value = anonURL.value.replace(/^http:\/\//g, '');
    }
    bgPosted = true;
    return true;
  } 
  function bgpostLoad() {
    if (bgPosted == true) {
      if (cFrm.remember.checked) {
        var expires = new Date();
        expires.setFullYear(expires.getFullYear()+1);
        document.cookie = "anonName=" + escape(cFrm.anonName.value) + "; expires=" + expires.toGMTString();
        document.cookie = "anonURL=" + escape(cFrm.anonURL.value) + "; expires=" + expires.toGMTString();
      }
      window.location.reload();
    }
  }
  document.write('<iframe style="position:absolute;left:-9999px;top:0" name="bgpost" onload="bgpostLoad()"></iframe>');
//]]>
</script>
<div class="buttons">
  <input type="submit" name="post" value="Post"/>
</div>
</form>

Update: You might want to have a link to the standard blogger.com form when you use this.

Update 2005-07-03: Changed a few things: unescaped the data read from cookie, stripped http:// from the URL (Blogger simply adds http:// to the URL regardless if there already was a protocol) and removed mailto: (because it did't work).

Update 2005-07-13: Changed the submit listener. addEventListener did't return the cFrmPost() return value.

Update 2005-07-16: How to use this code on your blog? It's simple. Search your template for </BlogItemComments>. After it you should paste the code. Now change the link to the comments. Your don't want it to point to the standard form.

<a href="<$BlogItemPermalinkUrl$>#comments">Comments (<$BlogItemCommentCount$>)</a>

Update 2005-07-19: how to embed it in Douglas Bowman's Minima template.

Update 2005-09-18: See Custom Blogger comments form (4): spam protection

2005-06-06

Custom Blogger comments form (2)

There is a way to get rid of the different looking Blogger screen after the post has been processed. The trick is an iframe with an onload.

<form name="commForm" action="http://www.blogger.com/login-comment.do" method="post" onsubmit="bgposted=true">
<div>
  <input type="hidden" name="blogID" value="<$BlogID$>"/>
  <input type="hidden" name="postID" value="<$BlogItemNumber$>"/>
  <input type="hidden" name="isPopup" value="false"/>
  <input type="hidden" name="iden" value="Other"/>
  <label for="uname">Name</label>
  <input type="text" id="uname" name="anonName" maxlength="100"/><br/>
  <label for="url">http: mailto:</label>
  <input type="text" id="url" name="anonURL" maxlength="100"/><br />
  <label for="comment-body">Comment</label>
  <textarea id="comment-body" name="postBody" cols="60" rows="10"></textarea><br />
  <input type="submit" name="post" value="Post"/>
</div>
</form>
<script type="text/javascript">
var bgposted = false;
document.write('<iframe style="position:absolute;left:-9999px;top:0" name="bgpost" onload="if(window.bgposted==true){window.location.reload()}"></iframe>');
document.forms.commForm.target = 'bgpost';
</script>

Update 2005-06-08: See Custom Blogger comments form (3)

2005-06-05

Google open all user script

When I'm doing a Google search most of the times I just open all the links on the first page in new tabs. The Google open all user script for Greasemonkey was born. It adds a link at the top of the search results to open all (or some) results in a new window.

Screendump Google open all

0.6.1

Fix for new HTML structure at Google.

0.6

Added the quick language switch. Configure this feature by changing or adding the locales on the following line:

var searchLangs = "nl|en|de";

0.5

fixed it to work with Google's restyled HTML output.

0.4

  • Option to open HTML version of PDF, DOC etc.
  • No longer based on the first div on the page which made it interfere with others scripts.

0.3.2

Updated to work under Greasemonkey 0.6.4.

0.3.1

Replaced cookies to store data with the GM_setValue and GM_getValue functions.

0.3

Now uses the GM_openInTab function. You no longer need to change any settings using about:config.

0.2.2

Fixed it to work with Greasemonkey 0.5.1.

0.2.1

Works in combination with Google suggest.

0.2

You can now make settings which are stored in a cookie. Settings are: maximum number of results to open, option to skip indented results and an option to reverse the open order (bottom up in stead of top down).

0.1

Initial version.

2005-06-02

Hotmail rich composer user script

I don't use Hotmail a lot. But when I do, I use Firefox most of the time. I think Microsoft did a bad job on the Mozilla version of the composer. Yesterday I've had it and decided to write a Hotmail rich composer (0.1.2) user script for Greasemonkey which replaces the plain textarea.

0.1.2

This version now works with Firefox 1.5 and Greasemonkey 0.6.4.

0.1.1

  • Fixed: Send message by clicking icon left of 'Send' now works.
  • Fixed: Safe draft now works.

0.1

Initial version.