How to show status icons for BEx Exceptions in Design Studio

I started this journey here How to Find and Change the CSS Class – Design Studio

It is easier to do this using the conditional formatting from Analysis Office (seeChecking out Features from Analysis Office to Design Studio ) but maybe you want to read the exceptions from the BEx Query.

Some of this is described in the Design Studio Learning Hub material, but I struggled with it.  Finally I got it working today.

Step 1: Set up Exceptions in the BEx Query:

Step 2: In Design Studio, set up the custom.css for the Crosstab property as follows:

Code is also shown here for readability:

.sapzencrosstab-DataCellDefault.sapzencrosstab-DataCellAlternating{

background-color:#FFFFFF !important;

}

.sapzencrosstab-DataCellDefault{

background-color:#F9F9F9 !important;

}

.sapzencrosstab-DataCellAlert1Background, .sapzencrosstab-HeaderCellAlert1Background

{

color:rgba(0,0,0,0.0);

background-image: url(‘/aad/resources/~1399838692937~/sap/zen/crosstab/themes/sap_platinum/img/exceptions/trend_asc_9.gif’) !important;

background-repeat:no-repeat !important;

background-position:center top !important;

}

.sapzencrosstab-DataCellAlert9Background, .sapzencrosstab-HeaderCellAlert9Background

{

color:rgba(0,0,0,0.0);

background-image: url(‘/aad/resources/~1399838692937~/sap/zen/crosstab/themes/sap_platinum/img/exceptions/trend_asc_1.gif’) !important;

background-repeat:no-repeat !important;

background-position:center top !important;

}

Step 3: Place the custom.css in the Properties of the crosstab and set Conditional Formatting to true:

Step 4: At run time review the cross tab:

Step 5: Turn Exceptions off:

I need to change the color of the arrows but that is for another day.  I found the .GIF files by searching the DOM in IE11.

Here is a recording in action:

Related:

Design Studio 1.1 Full List of CSS classes (?)

HANA, BI, BW on HANA Hands-on Sessions with SAP Mentors at ASUG Annual Conference / SAPPHIRENOW

ASUG Annual Conference – Add Dashboarding/Design Studio to Your Agenda

Dashboarding/Design Studio Sessions at Conference

Find all the Design Studio-related sessions here for ASUG Annual Conference and below: