Installing ClickHeat (Open Source Heat Map Tool) on IIS

Posted: Mon 5 Apr, 2010

Labs Media offer an Open Source piece of software called ClickHeat, which shows visual heat maps of user activity (specifically clicks), laid over the top of your website. It is built using PHP & GD, however, no-one to our knoweldge has offered instructions for getting it running on IIS (Windows Server)

1. Download ClickHeat from here.

2. Unzip and transfer the 'clickheat' directory by FTP to the root directory of your website (Note: If you need FTP software, search Google for FileZilla), or if you've got remote access, log onto the remote server desktop and unzip it into the directory of yourr choice.

3. Open Internet Information Services (IIS) on the server, navigate to your website, and right-click on the 'clickheat' directory.

4. Click 'Create'. Under 'Execute permissions', change 'None' to 'Scripts only'.

5. Under the 'Documents' tab, remove all other index pages (default documents) and add index.php.

6. Browse to http://yoursite.com/clickheat/. If PHP is installed, your site should pass all preliminary checks. Click the blue 'right' arrow.

Helpful Hint: Leave Security fields blank - these are used for explicit whitelisting. If left blank, all clicks will be logged. Remember that www.domain.com and domain.com are seperate for these purposes.

7. Enter an admin name and password, log in.

8. At this point, ClickHeat will appear blank, with the question: "Did you correctly installed Javascript code on your webpages?". The answer is no, so click on the question and enter your website name (eg. yourname.com) and a group name - at this point you'll probably want to call it 'home'.

9. Paste the code given into your website, removing the line: <p><a ... >Surfer navigation analysis</a></p>. It's not that we're not grateful to LabsMedia, but the notice isn't part of the GPL agreement and ruins the overall feel.

10. Important: Do not skip this step. Click the blue 'split panes' icon to the right of 'Groups' (left of the 'Refresh' icon), choose the layout that best matches your screen width. If you're not sure how to check this, download Firefox and either the MeasureIt* or Firebug plugin. The width of each column on a website should be entered (in pixels) to improve the accuracy of ClickHeat.

11. Go to your website and visit http://yourdomain.com/?debugclickheat and check that it's all working. Then visit normally and click around a bit.

12. Come back the next day and enjoy your heatmap.

* MeasureIt has a box drawing bug for some users of Firefox 3.6 as of April 4th, 2010.