1. New Backlinks Hack

    body

    My previous backlinks hack was a quick fix to allow backlinks on the main page, since I wanted to do that. It was, however, kind of ugly, complicated, and like the 'normal' backlinks code broke XML well-formedness. I have, therefore, come up with a new hack that does the exact same thing, but is faster, easier, and XHTML valid. The new steps are below :

    1. Enable backlinks on your blog — an obvious, but necessary, step
    2. Put this code in the <head> section of your blog template:
      <script type="text/javascript">
      //<![CDATA[

      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;
         }
      }

      //]]>
      </script>

    3. Find the section in your template that starts with <BlogItemBacklinksEnabled> and ends with </BlogItemBacklinksEnabled> and replace the entire thing (these tags included) with this code:
      <BlogItemBacklinksEnabled>
      <ItemPage><div style="display:block;" id="backlinks"></ItemPage>
      <MainOrArchivePage><div style="display:none;" id="backlinks<$BlogItemNumber$>"></MainOrArchivePage>
      <h4>Backlinks:</h4>
      <script type="text/javascript">backlink = new Array();BL_Backlinks = new Array();</script>
      <script type="text/javascript" src="http://www.blogger.com/dyn-js/backlink.js?blogID=<$BlogID$>&amp;postID=<$BlogItemNumber$>"></script>
      <script type="text/javascript">
      //<![CDATA[
         for(var i = 0; i < BL_Backlinks.length; i++) {
            document.write('<dt class="comment-title">');
            document.write('<span class="comment-toggler">&nbsp;</span>');
            document.write('<a href="'+BL_Backlinks[i]["BlogBacklinkURL"]+'">'+BL_Backlinks[i]["BlogBacklinkTitle"]+'</a>');
            document.write('</dt>');
            document.write('<dd class="comment-body">'+BL_Backlinks[i]["BlogBacklinkSnippet"]);
            document.write('<br />');
            document.write('<span class="comment-poster">');
            document.write('<em>posted by '+BL_Backlinks[i]["BlogBacklinkAuthor"]+' @ '+BL_Backlinks[i]["BlogBacklinkDateTime"]+'</em>');
            document.write('</span>');
            document.write('</dd>');
         }//end for
      //]]>
      </script>
      <p class="comment-timestamp"><a class="comment-link" href="javascript:BlogThis();">Create a Link</a></p>
      </div>
      </BlogItemBacklinksEnabled>
    4. Find the code for the 'links to this post' link in your post footer template code and replace it with '<a href="<$BlogItemPermalinkUrl$>#; onclick="toggleitem('backlinks<MainOrArchivePage><$BlogItemNumber$></MainOrArchivePage>');return false;">links to this post</a>'
    5. Save your template and republish your blog!
    Tags:
    Tags:
    Creative Commons Licence © 2006-2008 Stephen Paul Weber. Some Rights Reserved.
    Stephen Weber at 2006-01-19 03:03 | 55 Comments / Trackbacks