BootStrap In Pentaho CDE

Hello Guys

First of All I really thanx for Harris Ward (@hazamonzo) of Ivy Information Systems to provide a great webinar and It’s really help full to use of Bootstrap in Pentaho CDE for making responsive dashboard.

Also i would like thanx to Pedro Alves and Diethard Steiner.  to provide such information.

In this blog you will Learn how to create a simple but stunning and mobile compatible dashboard using the CDE and Bootstrap framework. 

Why Bootstrap:

The most popular front-end framework for developing responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases.

CDE Version:

You must install the latest trunk version  in pentaho CE  5.

In the marketplace, click to open "Community Dashboard Editor" (click over the app name, don't click the install /uninstall button) and go to version button (down-left) and choose Trunk-snapshot.

Step:

1) Click on the setting icon in the main menu and change the dashboard type to Bootstrap.

2)    Layout Structure:

With Bootstrap, the total span size of the page is 12 columns (as opposed to Blueprint, which has 24 columns).

Span Size=12/No. of columns

3) Adding Table Component

4) SQL Query:

 

 After that Save the Dashboard and check the preview

OutPut:

Hope this post helps someone and feel free to give comments and suggestion

Sumit Bansal