Saturday 29 April 2017

Building Custom Analytics Report – Part5 – Experience Analytics custom Filter

In previous posts in this series we discussed the business needs for custom analytics report, I explained how to collect data, how to save them and how to aggregate the data into reporting databases and how you can display them as a SPEAK report, in this part I will show you how you can create new filter in other words how you can extend the current existing filters.




If you missed the first two posts you can check them from here:

  1. -          Building Custom Analytics Report – Part1 – Introduction
  2. -          Build Custom Analytics Report - Part 2 – Storing and Retrieving Data
  3. -          Building Custom Analytics Report – Part3 – SPEAK Report
  4. -          Building Custom Analytics Report – Part 4 – Experience Analytics New Menu.

What are the default experience analytics filters components?

We already know that the default experience analytics filter come with date and subsite filters, to be able to extend the experience analytics filters we need to identify the related files for each component,  
Mainly there are three main components, the filters container view and its logic, the filters logic and the filter view and logic, following are the default paths:

·         Filters Container and its logic

This view  name is “ExperienceAnalyticsFilterscshtml” and will be located in the following path:
\Website\sitecore\shell\client\Applications\ExperienceAnalytics\Common\Layouts\Renderings\ExperienceAnalyticsFilters.cshtml

Following is the content of this file, and as you can see it include the default rendering “filters”, 


The JS logic file name is “ExperienceAnalyticsFilters.js” and will be located in the following path:
\Website\sitecore\shell\client\Applications\ExperienceAnalytics\Common\Layouts\Renderings\ExperienceAnalyticsFilters.js

Following is the content of this file:


·         All filters logic

In this component you will find all the JS code that handle the different type of operations, like selecting subsite, picking date, setting values of filters and clearing them.
The file name is “ExperienceAnalytics.js” and can be found in the following path:
Website\sitecore\shell\client\Applications\ExperienceAnalytics\Common\Layouts\Renderings\Shared\ExperienceAnalytics.js

Following is the content of this file:



·         Filter view and logic

For each filter we will find a view and JS file that handle the different operation, as example if we want to take the subsite filter as example, following are files related:

View file name is “SubsiteFilter.cshtml” and can be found in the following path:

Website\sitecore\shell\client\Applications\ExperienceAnalytics\Common\Layouts\Renderings\SubsiteFilter.cshtml

Log JS file name is “SubsiteFilter.js” and can be found in the following path:
Website\sitecore\shell\client\Applications\ExperienceAnalytics\Common\Layouts\Renderings\SubsiteFilter.js

This filter is actually a rendering that can be found in sitecore as an item, this can be found in the core database in the following path:
/sitecore/client/Applications/ExperienceAnalytics/Common/Layouts/Renderings/SubsiteFilter

There you can find all the rendering used in experience analytics.

Did you figure it out yet? J 

I believe you should have a clear idea of what I will explain next to extend experience analytics to add a new filter.

Custom Experience Analytics filters extending Steps?
  • Create new rendering component for the new filter.
  • Create the following files as a copy from the original:
    •  ExperienceAnalyticsFiltersExtended.js
    • ExperienceAnalyticsFiltersExtended.cshtml
    • ExperienceAnalyticsExtended.js
  • Update the above to include your new rendering “filter”

Example?

I want to add a new dropdown filter called “Event Type”, see the updates in the files below, I highlighted most of the files that I updated:

Event type filter files:

Event Type view




Event type JS file


Container view and logic

Container view file:




Container JS File:




All filters logic




Hope the above gave a clear idea of how you can extend sitecore experience analytics filters.

3 comments:

Sasha said...

Thank you, it was helpful! One piece of information that is not clear to me - when the filter is set in place, where does the application respond to update the graph to make use of the new filter?

Unknown said...

I have implemented this in my current project, however, it is not working(Filter is not getting appeared on Sitecore Analytics Reports Dashboard page). I have followed all above mentioned steps, but no luck. Can you please explain it more with actual screen shot of Sitecore Analytics Reports Dashboard.

sri said...

Thanks for sharing this.,
Leanpitch provides online training in CSPO during this lockdown period everyone can use it wisely.
Join Leanpitch 2 Days CSPO Certification Workshop in different cities.

Product owner certification

Post a Comment