KB44567: How to Replace the MicroStrategy Web Button Image in MicroStrategy Web SDK

The example provided in this document is provided “as-is” to the user and assumes that the user:

• Can program, compile (e.g. javac, jikes, etc.), and execute Java programs
• Can configure environment variables (e.g. JAR files, property files, etc.)
• Have all the necessary tools to create Java applications (JDK, IDE, etc.)
• Has access to the Strategy SDK documentation.
• Has read the customization warning at the bottom of this document

PREREQUISITES:
 
For the sample to work, the Strategy Web JAR files must be accessible by the Java Runtime
Environment. The Strategy Web JAR files can be found under:

• Strategy Web Universal (JSP): {web_root}/WEB-INF/lib directory.
• Strategy Web (.NET): Program Files\Common Files\Strategy directory.

Note:
 
More elaborate programs will require additional library files and are out of the scope of this document.
 
This scenario deals with removing the Strategy Web Button with an image or logo of your choice. The task involves modifying a CSS file to update the reference to use a new image such that this customization is globally applied on all Strategy Web pages. The Strategy Web Button is used for navigating to the Welcome page.
Before Customization:

After Customization:
  

1. Launch the Strategy Web Customization Editor and create a new plugin.
2. Click on CSS inside the CSS Settings view to expand the hierarchical tree. The expanded list comprises the different CSS files used in Strategy Web.
3. Navigate to Strategy Web Styles->style->mstr.
4. Click on mstr.css to expand the rules defined within this CSS file.
5. Click on .mstrLogo to expand the properties defined for the rule.
6. Double-click on background to launch the Update CSS Property dialog.
7. Click on Utils >> to view the Utilities panel.
8. Click the Image button on the Utilities panel to navigate to the image.
9. Select the image and click OK. The location of the image gets updated in the Value text field.
10. Add "!important" to the end of the Value text field to override the value in the default 9.3.1 _Interface plugin.
11. Make sure the Apply to All Pages radio button is selected.
12. Click OK. The updated background property gets added under the .mstrLogo rule inside a newly created CSS file "global.css" under CSS->Customized Web Styles->style.
13. Follow the above steps to make changes for the hover link selector A.mstrLink:hover .mstrLogo and property background-image.
14. Under CSS->Customized Web Styles->style, right-click on global.css and select "New Selector".
15. For name, enter .opened .mstrLogo and click OK. Note: There is a space between ".opened" and ".mstrLogo".
16. Right-click on the new selector and select "New Property".
17. Enter background-image and select the corresponding image as done above.
18. Launch Strategy Web to view the customization.

Note: Alternatively, the selectors above can be added to global.css under Strategy Web Configuration > Global CSS > Customizations in the Web Customization Editor instead.
 
ADDITIONAL INFORMATION:
 
The Strategy SDK allows you to customize the standard Strategy Web interface, and extend and integrate the Strategy business intelligence functionality into other applications. However, before changing the way Strategy Web products look or behave, it is helpful to understand how the application is built. For more information regarding the Strategy Web architecture or the process of customizing Strategy Web, please refer to Strategy Developer Zone (https://community.strategy.com/topic/0TO44000000FliLGAS/sdk).
 
To access the Strategy Developer Zone, you must have access to the Strategy Knowledge Base, you must have purchased the Strategy SDK, and you must be current on your Strategy maintenance agreement. If you are a US-based business and believe that you satisfy all three of these conditions but you do not have access to the Strategy Developer Zone, please contact Strategy Technical Support at support@microstrategy.com or at (703) 848-8700. If you are an international business, please contact Strategy Technical Support at the appropriate email address or phone number found at https://www.microstrategy.com/en/support/contact-support.
 
 
CUSTOMIZATION WARNING:
 
This customization is provided as a convenience to Strategy users and is only directly applicable to the version stated. While this code may apply to other releases directly, Strategy Technical Support makes no guarantees that the code provided will apply to any future or previous builds. In the event of a code change in future builds, Strategy Technical Support makes no guarantee that an updated version of this particular customization will be provided. In the event of a code change in future builds, Strategy may not be able to provide additional code on this matter even though this customization is provided at this time for this specific build. For enhancements to this customization or to incorporate similar functionality into other versions, contact your Account Executive to inquire about Strategy Consulting assistance.