Web Analytics

Use templr.pro to create beautiful Looker Studio Dashboards

What is templr.pro?

Templr.pro describes their tool as the following:

“Templr is a community component that loads within Google Data Studio and allows anyone to create custom visualizations using HTML, CSS, JavaScript, and simple templating syntax.

It’s incredibly easier and faster to use templr.pro than Google Cloud SDK, and you don’t need to know advanced programming concepts or follow complex workflows” (quote: https://www.templr.pro/).

At Advance Metrics we use templr.pro as a free tool when we reach the limits of Looker Studio (previously Google Data Studio) features. This allows us to build more creative, complex and client-oriented dashboards.

How to add tempr.pro to Looker Studio?

To add templr.pro to your Looker Studio dashboard you need only your name and your email address. Through sending a simple email to templr.pro which can be found on the front of their website, you will receive a response with a link to the manifest path. This path is entered in the section for community visualizations, “Build your own visualization” in Looker Studio. Then you will be able to access templr.pro from the top bar.

How to add templr.pro to Looker Studio

How can you use temple.pro?

The following paragraphs outline a few use cases on how templr.pro can be a valuable addition to your dashboards.

Use case 1: Wider variety of Google fonts

Looker Studio’s range of Google fonts is quite broad already but in some cases you may need a font which is not yet available. In this case, templr.pro can come in handy and provide you with more fonts to choose from.

In the screenshot below you can see that the title “Google Analytics Overview” is written in the font “Fuzzy Bubbles”.

 

How to add templr.pro to Looker Studio

Use case 2: Create a show/hide toggle

Often you need to explain metrics or KPIs to stakeholders and it is not convenient to write a piece of text next to the metric or a glossary slide. In this case a show/hide toggle can be highly useful to provide definitions or supplementary information.

 

Show:hide toggle templr.pro

Use case 3: Create dynamic metrics within text

In cases where you need to write out the metrics in text form, it is useful for the metrics to change dynamically based on the parameters of the report. Templr.pro allows for this dynamic adaptation of metrics within a written sentence.

 

Data within text templr.pro

Use case 4: Use unique Bullet points

You might remember that Looker Studio does not offer bullet points. In the following screenshot you can see example text in the form of a list with bullet points.

 

Unique Bullet Points templr.pro

Use case 5: Create list of pages as text sorted by pageviews

List and sort your top pages dynamically using any metric, such as pageviews as seen in the example below.

 

List with pageviews templr.pro

Conclusion

These are just 5 simple use cases but there are a plethora of possibilities with templr.pro; conditional formatting, custom tables, responsive card grid and transposed tables, just to name a few. With a little bit of googling and some basic knowledge of HTML, CSS and Javascript, you are good to go! If you find you have questions or need more in-depth assistance, drop us an email at Advance Metrics and we will be happy to help.

Read more about Web Analytics.

Can we support you in Digital Analytics?