Adding templr.pro to your Data Studio report
To use templr.pro, you first need to add templr.pro community visualization to your Data Studio report:
To do this, while editing your report, click community visualizations and components icon in the toolbar:
Then click + Explore more to open the Community Gallery, and click Build your own visualization.
Then enter the Manifest Path and then click Submit.
To access the manifest path for templr.pro you need to sign up on the home page. It’s free.
Finally click on templr visualization to add it to your report.
You can access the configurations of templr.pro under the DATA and STYLE tabs on the sidebar, just like any other component in Data Studio.
Viewing the data model
Once you add an instance of templr.pro community visualization to your report, you can access its settings and configurations in the STYLES tab.
There you can:
Click to view the data model: This is the exact data model that Google Data Studio passes to templr.pro to be visualized.
You can use Handlebars templating syntax to access, loop through, and displays values within the data model within your HTML tags, and style them using CSS.
Template Edit Box: You can write your template code here using HTML and Handlebars syntax.
Due to data studio security limitations, full JS is not supported at the moment. But we are working hard to bring a reasonable support for dynamic scripting to templr.pro in the near future.
CSS Styles Box: You can add CSS styles to be applied to your visualization here
Visualizing your data using CSS & HTML
You can create your visualization using HTML and style is with CSS. You can use Handlebars to access values within the data model and display them within your HTML tags.
To see some examples, check demos.
Templr core syntax
templr.pro is compatible with Handlebar.js templating syntax. To learn more about Handlebars and its core syntax, click here.
Helpers
In addition to the core Handlebar.js syntax, we have also added support for some special functions called helpers to assist in visualization and manipulation of data.
You can find a list of all supported helpers and their functionalities in the documentation page.
Security & Privacy
Templr.pro doesn't track usage.
When you use templr.pro, it runs within your Data Studio report. All data processing and visualization is performed within Google Data Studio.
Templr.pro neither stores data nor communicates with any external server or resource.
Known Limitations
Just like any other community visualization, for templr.pro to work, access to Community Visualizations should be turned ON at the data source.
Due to Data Studio limitations, it's not possible to load external resources such as images or scripts from an external URL via templr.pro (or any community component).