Using HitBox traffic analysis with Blogger

There are many reasons for analyzing traffic to your website: among them, finding out which sites are sending you traffic, which pages visitors have viewed and in what order, and where they've gone on to. This can be done by analyzing server logs, but if a site is spread across multiple servers, or has some of its pages provided by third-party services, it's more realistic to use a hosted service. Loosely Coupled uses HitBox Professional, which starts at $24.95 a month for up to 25,000 monthly pageviews, and scales up to enterprise levels. Here are a few tips when setting up HitBox with a weblog publishing tool like Blogger.

The way HitBox works is it supplies some JavaScript code that you embed in each of your web pages. The JavaScript then takes care of forwarding all the relevant information to the HitBox servers every time a visitor lands on a page. All you have to do is paste the code into your pages or page templates. The trick is choosing where and how to do that. That will depend on how you want to analyze the information about which parts of your site people have been visiting.

HitBox allows you to track traffic to individual page names, and also to group them into content categories. The categories option is useful if your site has several separate sections — for instance, articles as well as a weblog — and you want to be able to track how the traffic splits between the two without having to total up figures for all the individual pages. The only trouble I find with categories is that once you've chosen a category name, you have to stay with it, as HitBox doesn't have a facility to rename them retrospectively (ie for pageviews already stored in its database). So if you change your category name from, say "/weblog" to "/blog", you can't consolidate the two categories together to analyse historic trends across the two periods. This affects your page traffic history statistics as well, since HitBox treats pages with a different category name as separate pages. On the other hand, that's a good thing if you've got pages with the same filenames in different parts of your site, as using categories is how HitBox distinguishes between the two.

For the page name itself, you can either allocate a specific name to each page within the JavaScript, or you can leave it defined as "PUT+PAGE+NAME+HERE" in which case it will automatically use the actual filename of the page. The latter is what you have to do for Blogger, since Blogger will use the same HitBox code in your template to create every page, so reading the filename is the only way to get separate counts for each of your individual archive pages. Note that, if your main weblog page happens to be the default page for the site or the directory (eg it's the index.html page), then HitBox also needs you to change the 'default page name' field in the JavaScript from "title" to "index.html" (or whatever your default page is called).

All of this means you can't rely on the downloadable wizard that HitBox supplies to generate the JavaScript for your pages. But it's easy to make these changes to the standard script supplied. Do remember to edit the category and page name fields in the 'noscript' section at the end of the code, as well as in the variable definitions at the beginning.

The other thing to bear in mind is that HitBox's authors update their JavaScript code from time to time, so to make sure you can take advantage of the latest features, you will need to update your page templates with the new code every so often. The 'Edit Account' option under 'Site Tools and Reporting' contains ready-made JavaScript for your account that is always up-to-date. I prefer to get my JavaScript from here anyway, so that I can use the reduced-size code that omits support for JavaScript 1.0.

The need to occasionally upgrade your JavaScript is another good reason why it's better to name pages by filename rather than naming them manually, since you can then make use of templates and includes to add the code to groups of pages in a single pass. However this means you need to make a habit of placing the code in an include that falls within the content area of your page layout, and not in an area that is part of the site-wide include skins. For Loosely Coupled, I put it in the right-hand sidebar. Another possibility would be to put it right at the beginning of the body, after the head information for each page.

If you're using JavaScript in your Blogger template, you'll find you can't edit the template in Blogger, because it has a habit of choking on the "&" characters in the JavaScript. Instead, you have to keep a separate copy of the template somewhere else, and edit the copy whenever you need to make changes. Then just delete the existing template in Blogger and paste in the edited copy when you're ready to go live with the changes.

One thing that HitBox doesn't do, but which would be very useful, is to make referrer information for individual pages available as an RSS or JavaScript feed, which could then be automatically republished on the site. By not doing so, HitBox hands an important advantage to non-hosted alternatives. It's a shortcoming that ought to be addressed.

posted by Phil 7:29 AM (GMT) | comments | link

Giving visitors a choice

Some visitors may want to comment in private, rather than having their remarks instantly published online, as shown in the previous step in this series. You can give them the choice by adding a simple checkbox to your comments form. Adding new fields to your form and database is a simple process using Xara Modules. Then all that's required is a small change to the query module to make sure comments marked as private won't be published to the site.

The first step is to add the new field to your form, and then copy the changes to your database:

1. In your modules store, click on the icon for your comments form. This takes you to the form editor.
2. Go down to the bottom row of the form, and click on the edit button for the single cell on that line, which contains the submit button.
3. In the popup editing window, click on the cell content tool to 'Split merged cells'. This splits the row into three cells.
4. The new checkbox will go in the first two cells, in place of the submit button:
   1. Click on the edit button for the first cell, which you'll find sitting just above the submit button.
   2. In the popup window, select the cell tool to 'merge with cell on right', which will take you back to the form editor.
   3. Find the edit button for the newly merged cell. Click on it to bring up the popup editor again.
   4. In the popup editor, click on the top button labelled 'Change Cell Type'.
   5. A new popup window shows you a list of cell type options, as pictured right (click thumbnail for larger version). Click on the option labelled 'Single checkbox', and click OK.
   6. In the checkbox editor, enter some suitable text in the 'Label:' window, for example "Leave blank to publish your comment, check box to send it to us in private". To break it into two lines, put a return after the comma.
   7. On the line underneath, click on 'change fieldname', and set a convenient fieldname, such as "private_"
   8. Using the pulldown menus for horizontal and vertical alignment, set to 'Left align' and 'Middle align'.
   9. Click OK to finish editing the cell.


5. Now create a new submit button in the final cell:
   1. Click on the edit button for the third cell at the end of the row. Because this is an empty cell, the popup window automatically includes the same list of cell type options that you saw when editing the previous cell. Go down to the end of the list, select 'Submit button' and click OK.
   2. Change the button text to "Submit your comment".
   3. Set the alignment to 'Center align' and 'Middle align'.
   4. Click OK to finish editing the cell.


6. Go to the top right-hand corner of the form editing screen and click the 'save and publish' button.

Now go straight on to add the new field to your database:

1. Back in your modules store, click on the icon for the comments database. Then click on the 'connections' tab in the database editor.
2. At the bottom of the connections screen, you'll find an option to 'select new module'. Click on it, and click OK on the alert popup.
3. You'll see a screen showing all the suitable modules in your module store. Click on the icon for the form you just changed.
4. If you go back to the 'connections' screen, you'll now see that the "private_" field you just added to the form has been added to the database, and is connected to the form.
5. Go to the top right-hand corner and click the 'save and publish' button.

Your form will now write the contents of the new field to the database whenever anybody adds a comment. Note that it's important to change the database straight after altering the form, as until you've updated the database, the form will encounter an error if it tries to write to the new field.

Now you need to change the query module so that it filters out any private comments before sending them to the reporter module for publication (remember that, until you make this change, comments marked as private will still be published):

1. In your modules store, click on the icon for the database query that connects to the reporter module.
2. You'll see that Xara has already added the new field, with a pulldown menu that's currently set to 'ignore'. Change this setting to 'no'.
3. Now go to the top right-hand corner and click 'save and publish' to finish

If your comments database already has some comments in it, the new field will be blank for all those records. Unfortunately, the query won't recognize those blanks as a 'no' (nor for that matter as a 'yes'). So if you still want them to be published, the final step is to edit those records in the database:

1. In your modules store, click on the icon for the database.
2. Click on the button to 'view all records'. This takes you to a screen showing each record in turn, with an 'edit' and 'delete' option to the far left of each one.
3. To modify any record, select 'edit'. This takes you to an 'Edit Record' screen:
   1. Click on the "private_" checkbox once to set this field to "yes".
   2. Click on it again to remove the check. This sets it to "no".
   3. Click on the 'update record' button to save the change
   
   Repeat for any other records you need to modify.
4. Changes you make in the database editor are written directly to the database, so once you've finished, click on the 'cancel' button at the top of the screen to return to the modules store.

If you already have a lot of public comments in the database, or if the comments function is already being heavily used, you may find it preferable to add the new field to the database first, update the database records next, and finish by changing the form and the query.

When doing a lot of database changes, it's also a good idea to temporarily switch off the option in the query module to execute every time the data changes, and turn it back on when you've finished your editing. Alternatively, you could create a form and query combination to globally update the records in the database — but that's a more advanced step that we'll save for a later date.

posted by Phil 9:57 AM (GMT) | comments | link