Sunday, September 24, 2006

Adding HaloScan TrackBacks … But Not Comments

Last week, we talked about taking HaloScan comments off your blog and replacing them with Blogger's standard commenting system. A reason for doing that would be if the Blogger features such as moderation, word verification, "members-only" option, and integrated exporting work better for you than HaloScan's moderation and IP address banning (exporting is possible, but not integrated into your blog posts).

Blogger comments work better than they used to, but still aren't for everyone. But, if you want to remove HaloScan and convert to Blogger comments on your Blogger blog, see last week's post.

But I got an email asking about putting HaloScan TrackBacks only on a blog.

Here's the scenario:

You have a Blogger blog. You're using Blogger's commenting system. Perhaps you're using Backlinks, perhaps not. But you want to add TrackBacks to your blog. But keep your Blogger comments.

What do you do?

You do this:

Backup Your Template

Always, always, always back up your template before making any changes. If something goes wrong, you can put it back. First time you have a problem and don't have a backup, you'll understand just how important this step is.

Add HaloScan Code To The Header

The first piece of code you must install is the HaloScan JavaScript functions. You see, HaloScan uses JavaScript to do its interface magic. And they already have the code you need. You just have to tell your template to use the code.

Look for the closing HEAD tag. It looks like this:
</HEAD>
Insert this line right before that line:
<script type="text/javascript" src="http://www.haloscan.com/load/YourID"></script>
That goes on a single line. And nothing else goes on that line but the SCRIPT tag. And don't forget to replace the YourID with your actual HaloScan ID!

There's More Code, Isn't There?

Now, you need to insert another piece of code in the body of the template.

Where you insert it is important. So, let's divert for a moment and cover the possibilities. It involves Blogger tags.

Oh, no! Not tags!

There are four special Blogger tags of interest:
  • <MainPage>
  • <ArchivePage>
  • <ItemPage>
  • <MainOrArchivePage>
You see, on Blogger, any content on the template between the <MainPage> and </MainPage> tags will appear only on the Main page (the "Home Page").

Likewise, anything between the <ArchivePage> and </ArchivePage> tags will appear only on the Archive page (the week or month grouping of posts).

All content between the <ItemPage> and </ItemPage> tags appears only on the Item page (the page that shows one particular post, accessed via the Permalink).

The <MainOrArchivePage> and </MainOrArchivePage> tags, as you might figure, shows the content between the tags on both the Archive page and the Main page.

There's more, isn't there?

If you want your content to appear on ALL pages, don't put it between any of those four tags.

Oh, and you can have as many of these tags as you want. That is, you can have as many  <MainPage> tags as you want anywhere you want.

So, what's all this mean?

You now need to decide how you where you want the TrackBack link to appear. Let me tell you what I think:
  • You want the TrackBack link to appear on the home page. When people get to your home page, it would be convenient to check out TrackBacks from there.
  • You want the TrackBack link to appear on the individual post page. The page your readers get to when they click the Permalink.
  • You want the TrackBack link to appear on the archives page.
So, inside which tags? None of them. Why did I mention them? Because there are many blogs out there with TrackBacks appearing only on the home page but not on the other pages. There are many blogs that have TrackBacks only on the individual post page, but not on the home page.

I'm not sure if that was intentional. So I want you to understand what will happen if you put the code inside one of those tags.

Get To It Already!

Now that we know where we want the links to appear, let's locate that area in the template.

Scroll down in you template until you find this line:
<p class="post-footer">
Got it? Good. Now look for the very next:
</p>
Got it? Good. Now, that's the general area we want. Look for this between those two tags:
<$BlogItemControl$>
If you see it, immediately before <$BlogItemControl$> is where the next piece of code goes. It may be on a line with other stuff, so watch out for that.

If you don't see it, then this piece of code goes right before the </p>:
<a class="comment-link" href="javascript:HaloScanTB('<$BlogItemNumber$>');" target="_self"><script type="text/javascript">postCountTB('<$BlogItemNumber$>'); </script></a>
Remember, that goes on a single line. That will insert a link that opens the HaloScan TrackBack window for your readers. The link also shows how many TrackBacks are already on this post.

Note: If you decide you want to use HaloScan for comments as well as TrackBacks, use this code instead:
<a class="comment-link" href="javascript:HaloScan('<$BlogItemNumber$>');" target="_self"><script type="text/javascript">postCount('<$BlogItemNumber$>'); </script></a>
<a class="comment-link" href="javascript:HaloScanTB('<$BlogItemNumber$>');" target="_self"><script type="text/javascript">postCountTB('<$BlogItemNumber$>'); </script></a>
Remember, that goes on a single line. Of course, if you want to use both comments and TrackBacks, it may be easier to use the HaloScan automatic installation wizard. But that's not nearly as much fun, is it?

That's Complicated! Why Does It Have To Go There?

The reason we want it there as opposed to somewhere else? That's where many (but not all) Blogger templates have a separate formatting look for links to the post.

That's where the Permalink is and where the Comments link is. And it will look best there. Or I think it will.

What Next?

Save your template. Then publish your blog.

Now, we need to verify your changes work like you expect.

How Do We Verify We Got It Right?

Open another browser window/tab and navigate to your blog's home page. Look for the TrackBack link.

Now, open a post. Any post will do. Look for the TrackBack link.

Now, open an archive page (probably a week or month). Look for the TrackBack link.

If it's on all three pages, you're done.

If it's on none of them, go back through the instructions and check each step. Don't try any shortcuts or make other changes "because you understand the code so well."

If you do want to tweak these instructions to your particular tastes, first save/publish according to these instructions. Once you're sure about the functionality, then go make the changes you want to make.

What If There Are Problems?

The most common problem is the link not appearing. It usually means you forgot to replace the YourID with your actual HaloScan ID. So double-check that.

Other common problems include it showing up in a really odd place or with a really odd look. That usually means the link code is in the wrong place or between the wrong tags.

Are We Done Yet?

Almost done. One last thing.

If you're using the HaloScan for free ... that is, you haven't paid for a premium account ... understand that it would be a common courtesy to put a link to HaloScan on your site.

HaloScan, in fact, asks you to do just that. So, let's be nice and do that.

Look for <p id="powered-by"> in the code. That's the Blogger button. To me, that would be a good place to put the HaloScan button.

Right before the:
</p>
put:
<a href="http://www.haloscan.com/"><img width="88" height="31" src="http://photos1.blogger.com/blogger/4378/697/320/haloscan_tb.gif" border="0" alt="Weblog TrackBacks by HaloScan.com" /></a>
Remember, that goes on a single line. Note: This is not the graphic HaloScan normally provides. The HaloScan provided graphic is in this code:
<a href="http://www.haloscan.com/"><img width="88" height="31" src="http://www.haloscan.com/halolink.gif" border="0" alt="Weblog Commenting and Trackback by HaloScan.com" /></a>
Now check it out. If everything looks good, we're done!

That's A Lot Of Stuff

It might seem like a lot of stuff to do, but all we really had to do was insert two pieces of code. One had to go in the HEAD, and the other had to go in the BODY. But your blog is important, and we want it to look right. So, we took the time and effort to make sure our links went where we wanted them to go.

Are We Finally Done?

Yes. And if you want to see it in action, go to my My Other TrackBack Demo blog.

3 comments:

  1. Phew. Finally got it to work. I had to remove stuff I put in before... Good thing I make comments or I would never have found it!!! What you posted works like a charm. (Did it for my sis at Tink's Tribulations)

    ReplyDelete
  2. Wonderful! I'm glad it worked for you.

    ReplyDelete

Please choose a Profile in "Comment as" or sign your name to Anonymous comments. Comment policy