Search The Web

Today's Headlines

Monday, November 23, 2009

How To Create A Hidden FlagCounter Widget To Keep Your Traffic Stats Private

In this earlier post, I talked about a potentially very useful widget for your blog created by FlagCounter. The widget enables you to showcase the geographic reach of your blog by showing the countries from which you have had visitors.

My only problem with the widget was that there was no option to hide the actual visit counts or change them to percentages. Your traffic stats were revealed to the whole world for everyone to see. If you don't mind that, then I think the FlagCounter widget is an excellent addition to your blog as is.

But, if you are like me, you want some privacy with respect to the traffic stats for your blog or other website. There is really no option on the FlagCounter website to hide the traffic stats or convert them to percentages. The way the widget works is by creating an image that is hosted on the FlagCounter website. Every time your blog or other site with the widget on it is loaded, the image is updated if necessary (with new country flags added, visit counts incremented, etc.), and then it is displayed on your website. Because the widget is actually visible on your website or blog as a single image, you can't change any aspects of the display once the image has been generated on FlagCounter's side.

But FlagCounter does provide you some options that can be used to modify the visual aspects of the widget so that your traffic stats can be hidden from view. In this post, I will explain the procedure for getting a partially hidden flag counter or partially invisible flag counter. This will enable you to leave the flags visible on your site, but hide the actual traffic stats associated with each country. The result of applying the procedure I am going to describe is visible in the left sidebar of this blog page just below the visitor map provided by Revolver Maps (which is another of the recommended gadgets I talk about in the earlier post).

To get a FlagCounter where the visit stats are not visible, go to the FlagCounter website and start the process of creating your own flag counter. Set the number of flags and columns first. For the label on top of the counters, you can choose any option because it is going to be one of those elements that will be hidden as part of the procedure outlined here.

Uncheck the boxes next to "Show Country Codes" and "Show PageView Count". Removing the country codes makes the columns narrower, so you can fit more columns of flags in the same sidebar width. This is an element that will become invisible, so including it only increases the amount of seemingly unused space between columns of flags in the final widget. That is why I prefer leaving it off as part of this procedure.

The pageview count usually adds an extra row to the height of the widget, but since it is also going to become invisible, there is no point in adding empty space to the widget. So, I leave out that element also.

In the middle you will find three boxes to choose the colors to be used in your flag counter. In this area, choose the same color for background and text colors. This is one of the most important steps, and is the step primarily responsible for making the visitor counts invisible. This step also makes the country codes and pageview counts invisible, which is why I advised leaving them out of the widget.

For my blog, I set the background, text and border colors to all white (FFFFFF). You can choose any colors you want, but if you want the stats to be invisible, you need to choose the exact same color for the text and background. If you have performed the steps above correctly, you will see a preview that looks like the image below (I have chosen 4 columns of flags and selected "All" under "Maximum Flags to Show"):

If this looks like the kind of display you would want on your blog or website, hit the button that says "Get your FlagCounter". But you have completed only one of the two steps required to keep the traffic stats secret. Continue reading on for the next step.

When you hit the button to generate your codes, you will be taken to a page with two boxes of codes. For blogs and other websites, choose what is in the top box. It may look something like what is below (this is sample code that I am using to illustrate a procedure. DO NOT use this sample code in your blog or website. Use only the code you have generated for yourself directly at the FlagCounter website):

<a href="">
<img src="
alt="free counters" border="0" /></a>

Now, log into blogger, and go through the procedure for adding a HTML/Javascript page element to your layout (the procedure for is explained in my earlier post if you need the steps to do this). Give this widget a title (such as "Visitor Countries" or something similar). Paste the code you copied from the FlagCounter website into the Content box.

But don't save it as is. Here is where the second part of the procedure to make your stats secret comes in. If you look at the sample code I have posted above, you will find a URL in the first line of the code next to "href =". When visitors to your website click on your flag counter widget, this is the URL they will be taken to.

This URL then allows your visitor to see how many hits you have gotten from which countries, what your total pageviews are, what the history of pageviews over the past week has been and so on. So, if you leave that href as is, your visitors will be able to click on your widget and get all the stats about your site that you have worked hard to keep secret! That is probably not what you want.

But, you yourself probably want to be able to view such statistics whenever you want to. So, that URL is very important to you. Do not lose it. If you do, you will have to generate a new flag counter widget to be able to see these stats (and the new counter will start from scratch, so you will have no record of any of the visitors to your site from before the new counter was generated). So, copy that URL and add it as a bookmark in your browser. You may also want to note the URL down on paper somewhere so that you will have it even if your computer crashes and burns one fine day.

Now that you have squirreled away the original URL, replace it with something else! Since FlagCounter is free because it is advertiser-supported, they rely on traffic that arrives at their site by clicking on their widget. So, change the URL to so that you do not rob them of the traffic that provides you with the free widget in the first place. The modified code now looks as below:

<a href="">
<img src="
alt="free counters" border="0" /></a>

Note that modifying the code in any way is a violation of the terms under which the flag counter service is provided to you. So, if you get greedy and try to steal the traffic that FlagCounter relies on, by pointing the href to some other URL, FlagCounter would be well within its rights to terminate your counter. So, please be considerate, and modify it only to keep your traffic stats private, not to take away the traffic that would reach FlagCounter by clicking on their widget.

Hope you find this "hacked" widget useful. I have been using it for the past couple of days on my blog. In the first 24 hours, I accumulated 24 flags, but progress after that has been significantly slower. Given the content of my blog, it has the potential for several dozen more flags, but I don't think I will ever hit the kinds of numbers some people boast about on the FlagCounter forum.

And that is where the forum may come in handy: it actually has a section that allows members to request flags from other forum members so that you can build up an impressive flag collection on your widget! When you get stuck with your widget missing flags from a few obscure countries, you know where to go to beg for someone from those countries to give your blog or website a visit just for the sake of your widget! Good luck with the widget and your flag collection!!

Visitors Country Map

Free counters!

Content From

In the News

Article of the Day

This Day in History

Today's Birthday

Quote of the Day

Word of the Day

Match Up
Match each word in the left column with its synonym on the right. When finished, click Answer to see the results. Good luck!



Spelling Bee
difficulty level:
score: -
please wait...
spell the word:

Search The Web