Linkpulse click positions allows you to track exactly which sections of your pages receives clicks. Linkpulse can utilise this information to analyse the traffic live or in historical context.
Implementing Linkpulse positions requires some pre-work to be done. You will need to break down your sites design/layout into logical components that suits your tracking needs. We will of course assist you with this preparation.
Linkpulse position names can be chosen at will, however we recommend you to keep them short and logically connected to the sites design .ie. main, footer and header. Positions can be nested into several levels (currently max 3 levels), allowing you choose different levels during the analysing phase.
If the HTML code is well structured and each component can be identified logically as an ie. article position by classnames, then our automatic positions algorithm can be configured to automatically tag each click with a valid position name. Combine this with manual position names will give you super powers when analysing the traffic.
Linkpulse positions utilises the class attribute in the DOM structure to identify the click. Per default the script will look for all classnames which is prefixed with lp_ ie. "lp_main' and "lp_header". The algorithm looks from the clicked element and loop back up the DOM structure until it reaches the BODY tag or has collected three position level names.
Lets start with a basic example. Many sites has a structure with a header, footer and a main section. Look at the example underneath for how a possible Linkpulse position structure can be. (Note: DOCTYPE,html,body and etc. is omitted).
Basic HTML position example
...
<div class="header lp_header"> ... clicks on any A tag inside here will get position 'header' ... </div>
<div class="main lp_main"> ... clicks on any A tag inside here will get position 'main' ... </div>
<div class="footer lp_footer"> ... clicks on any A tag inside here will get position 'footer' ... </div>
...
Lets add some position levels to get higher "resolution" on the click tracking.
HTML position levels example
...
<div class="header lp_header">
<div class="lp_topmenu">
... clicks on any A tag inside here will get position 'header_topmenu' ...
</div>
<div class="lp_submenu">
<div class="lp_sponsored"">
... clicks on any A tag inside here will get position 'header_submenu_sponsored' ...
</div>
</div>
</div>
...
Although the examples over used div's, so can any DOM element that can have the class attribute be used to as container for the lp_ positions. Also the A tag can contain the lp_ prefix definition. In most cases the existing DOM structure can be used as it is by just adding the lp_ definitions to the class attribute.
Most of our customers use a content management system that generates a well structured DOM structure with appropriate classnames for each logical components (ie. article slots). In these cases, we can turn on logic for automatic positions (for now this configuration has to be done by us). Then we recommend to combine this with manual lp_ prefixes to get the wanted position resolution within the Linkpulse data.
lp_ prefix combined with automatic positions
...
<div class="header lp_header">
<div class="lp_topmenu">
... clicks on any A tag inside here will get position 'header_topmenu' ...
</div>
<div class="lp_submenu">
<div class="lp_sponsored">
... clicks on any A tag inside here will get position 'header_submenu_sponsored' ...
</div>
</div>
</div>
<div id="content" class="main lp_main">
<div class="row"">
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row1_pos1' ...
</div>
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row1_pos2' ...
</div>
</div>
<div class="row"">
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row2_pos1' ...
</div>
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row2_pos2' ...
</div>
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row2_pos3' ...
</div>
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row2_pos4' ...
</div>
</div>
<div class="row"">
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row3_pos1' ...
</div>
<div class="articleSlot"">
... clicks on any A tag inside here will get position 'main_row3_pos2' ...
</div>
</div>
</div>
...
The above example is one of many possible DOM structures that the Linkpulse automatic position can be used on. The DOM element does not need to be sequential and CSS definition on position and location in the page are respected when counting rows and positions. The row and position name can be chosen to own preferance. Ie. main_1x2 is also a good position name.