This page is a gallery of the Tallyopia widgets that you can embed into your site using shortcodes. It shows you what the widgets look like along with shortcode examples of how to embed them into your web page. These are the actual widgets that you will see on your site – these ones reflect the traffic of this website, but the ones on your site will show your traffic.
A comprehensive list of all the widgets we support can be found on The Big List.
The Basics
Let’s first start with a traffic overview. We’ll use the last24_hits chart to show the activity over the last 24 hrs. To do this, we’ll use the following code:
[tallyopia widget='last24_hits' width='600' height='300']
Some quick tips for using shortcodes:
- It’s best to put the values inside single quotation marks.
- Shortcodes should be entered on one line, newlines inside shortcodes are not allowed (though it’s ok if the shortcode wraps in your editor)
- Make sure to put a space between each parameter/value pair; this helps with readability and allows WordPress to better parse your commands.
Ok, back to the examples. Let’s talk about the back attribute.
The Back Attribute
Each widget analyzes a specific time period. For example, the last24_* series of widgets analyze the events that occurred during the last 24 hours. You can modify that by using the back attribute to only go back a certain number of hours. For example, here’s the same widget as before, but only going back 1 hour.
[tallyopia widget='last24_hits' width='600' height='300' back='1']
The units of back are in the units of the widget in which it’s being used. For the last24_* widgets, these units are in hours. The value of back can be as low a 0; the upperbound will depend on the widget (last24_* widgets can go back between 0 and 24).
View and Table Tabs
Let’s also get an overview of the what types of events occurred on the site. For this, I’ll use the last24_event widget. I’ll display it twice, once with all the data and once only showing the “view” tab. The code I’ll use is:
[tallyopia widget='last24_event' showtable='0' width='280' height='250']
[tallyopia widget='last24_title' width='280' height='250']
|
|
|
Floating Left and Right
In the above example, I positioned the divs inside a table. But you can also use floats to position the widgets. All widgets support a float value of left, right, or none (empty string). For example:
[tallyopia widget='last24_gauges' float='left' width='150' height='150' items='avg'] [tallyopia widget='last24_gauges' float='right' width='150' height='150' items='current']
Here we are displaying the hits per hour gauges. The “avg” gauge shows the average number of hits per hour as observed through the time period (in this case, over the last 24 hours). The “current” gauge shows the projects number of hits for the current hour. It’s based on what has happened in the current hour so far weighted with what happened in the previous hour. The float=’left’ and float=’right’ flags allow the gauges to line up to the sides of the text that we’re writing here.
Items Tag
The previous example also introduces the “items” tag. In general, if a widget can list more than one thing, we’ll use “items” to enumerate what we want to show. If you don’t include the items tag, you’ll get everything. To show more than one item, use a comma separated list. For example:
[tallyopia widget='last24_gauges' width='300' height='150' items='avg,current']
Let’s talk about Treemaps.
TreeMaps – Search and Event
When viewing a treemap, it’s important to realize that you are seeing two pieces of data. The size of each node in the tree represents one variable. The color of each node represents another. For example, take a look at the eventmap widget:
[tallyopia widget='last24_eventmap' width='600' height='300']
The size of each node tells you how many hits that event type received. The color of each node tells you the average duration spent viewing all entries of that event type. As with other widgets, the showview, showtable, and showdetails flags give you control over what tabs to display.
There is also a searchmap that shows you successful and unsuccessful searches, along with the number of results they give. The size of each node indicates the number of times that search was done, and the color of each node indicates how many results that search returned.
[tallyopia widget='last24_searchmap' width='600' height='300']
If you don’t see anything, it means there weren’t any searches performed.
Did We Miss Anything?
If you think we should add another example, either here or elsewhere, let us know.