Skip to Content

First I used the Learning Hub with Design Studio 1.2 but I still struggled, mostly with Internet Explorer 9.  Then I upgraded to IE 11 and it became a lot easier to navigate the DOM and find the CSS classes in my application.  For reference, see http://msdn.microsoft.com/en-us/library/ie/dn255008(v=vs.85)

Step 1: See simple crosstab below in runtime

/wp-content/uploads/2014/05/1crosstab_450205.gif

Step 2: Click F12 with IE11

2clickF12.gif

IE11 has a nice DOM Explorer (easy for newbies to CSS/DOM to follow)

Step 3: Select desired element to analyze CSS class using the arrow/box icon (or Ctrl-B):

/wp-content/uploads/2014/05/3selectdesiredelement_450243.gif

Step 4: On the right of the Styles, you can navigate to the desired class to select.

/wp-content/uploads/2014/05/4elementselected_450244.gif

Step 5: After finding desired CSS class, right click and Copy to the clipboard.

/wp-content/uploads/2014/05/5selectdesiredclass_450245.gif

Step 6: Open a text editor like Notepad.  In my example, I am changing the totals row to orange.  Save it as a .css file in the Repository folder.  If you are launching this on the BI launchpad you will need to upload the .CSS to the platform.

/wp-content/uploads/2014/05/6customcssfile_450246.gif

Step 7: Place the custom.css in the Properties of the Crosstab.

/wp-content/uploads/2014/05/7customnoworange_450247.gif

Notice now the totals row is now in orange.

See video below:

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:


Session ID Title Date
1 Hands-on: SAP BusinessObjects BI 4.1, SAP BW and SAP BW on HANA – All in one day 6/2/2014
207 Latest News on SAP BusinessObjects Design Studio 6/4/2014
208 Influence SAP at the ASUG SAP BusinessObjects Design Studio Influence Council 6/4/2014
305 SAP BusinessObjects Analysis Roadmap to SAP BusinessObjects Analysis & Design Studio Roadmap 6/4/2014
1308 ASUG Influence Council: Business Intelligence with SAP BusinessObjects Mobile 6/4/2014
To report this post you need to login first.

3 Comments

You must be Logged on to comment or reply to a post.

  1. Robert Shoemake

    Hi Tammy. Great write up!

     

    What if I wanted to apply some CSS rules to one checkbox group, and not another?

     

    For example, I have placed in the application Custom CSS formats that I want to apply to make the checkbox group 2 columns.

    However, for another checkbox group, I’d like to make them just 1 column, which is the default.

    The CSS applies to all instances of the class. How can I differentiate the one checkbox group? I tried putting the class only on the checkbox group in the Display – CSS Class

    (0) 
    1. Tammy Powlas Post author

      Hi Robert –

      Thank you for reading and replying.

       

      I don’t have the answer to your question; I recommend creating a new discussion and see if others can assist.  This space has some great CSS contributors.

       

      Tammy

      (0) 

Leave a Reply