EducationSoftwareStrategy.com
StrategyCommunity

Knowledge Base

Product

Community

Knowledge Base

TopicsBrowse ArticlesDeveloper Zone

Product

Download SoftwareProduct DocumentationSecurity Hub

Education

Tutorial VideosSolution GalleryEducation courses

Community

GuidelinesGrandmastersEvents
x_social-icon_white.svglinkedin_social-icon_white.svg
Strategy logoCommunity

© Strategy Inc. All Rights Reserved.

LegalTerms of UsePrivacy Policy
  1. Home
  2. Topics

KB320008: How to Change Search Result Icons For Specific Result Types When Using the Web Search in MicroStrategy Web 10.6


Community Admin

• Strategy


When using the search functionality in MicroStrategy Web, each individual search result has an icon next to it. This is both in list view and grid view. This can be customized with CSS and Java through the Web SDK.

SUMMARY:
When using the search functionality in Strategy Web, each individual search result has an icon next to it. This is both in list view and grid view. 
List view:

ka04W00000147pTQAQ_0EM440000002GM1.jpeg

 
Grid view:

ka04W00000147pTQAQ_0EM440000002GLx.jpeg

From Strategy Web 10.6 onwards, a custom transform can be used to programmatically change the CSS class used for the icon of individual search results. Custom CSS can then be used to define custom pictures for specific search results (e.g. by object type or object ID). This example demonstrates this customization using the object type.
 
ACTION:

  • Launch the Strategy Web Customization Editor
  • Create a new plugin, give a meaningful name.

    Create the CSS that will apply custom images depending on the custom CSS class name:
  • Navigate to Strategy Web Configuration-> Global CSS-> Customizations
  • Right click on css and choose New Selector.
  • Use ".mstrmojo-ListIcon.folder" for the new selector name.
  • Right click on the newly added selector and choose New Property.
  • Use the property "background-image" with a value similar to "url("../style/images/folderSM.png");" to override the image for this specific selector.
  • Repeat steps 4-7 for any additional custom images for custom CSS selectors, matching the icons for search results.
  • Add these images to the plugin's style/images folder, as shown below:
ka04W00000147pTQAQ_0EM440000002GM0.jpeg
  • Create a custom transform to override and return a CSS class when individual search results are rendered, depending on a condition:
     
  • In the Web Customization Editor navigate through Strategy Web Configuration -> Styles.
  • Right-click on the MojoFolderStyle and select new transform.
  • When creating the new transform, ensure the superclass is set to com.Strategy.web.app.transforms.MojoFolderTransform.
  • Within the custom transform, override the method addCustomCSSClass, as shown below:
    
    package com.custom.icon;
    import com.Strategy.web.app.transforms.MojoFolderTransform;
    import com.Strategy.web.objects.WebObjectInfo;
    public class US57366 extends MojoFolderTransform{
    	@Override
    	public String addCustomCSSClass(WebObjectInfo objInfo) {
    		//apply your rules here:
    		if(objInfo.getType()==3)
    			return "report";
    		else if(objInfo.getType()==8)
    			return "folder";
    		else
    		return super.addCustomCSSClass(objInfo);
    	}
    }

  • Repeat step 10 to find the style named MojoFolderStyle.
  • Double-click the style to open it, and click "Change" on the transform box.
  • Find the custom transform created in steps 11-13 and save the style with the new transform.

 
After restarting Strategy Web, this custom transform will now be called to add "report" or "folder" to the class property from individual search results which can be used to override the icons for specific results.
 
NOTES:
This customization was made possible through an enhancement added to Strategy 10.6.0 and is therefore not possible in previous versions [2016-Dec-09].
 
ADDITIONAL INFORMATION:
The Strategy SDK allows you to customize several Strategy products and extend and integrate the Strategy business intelligence functionality into other applications. However, before changing the way Strategy products look or behave, it is helpful to understand how the application is built. For more information regarding the Strategy products or the process of customizing Strategy products, please refer to Strategy Developer Zone (https://developer.Strategy.com).
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@Strategy.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.Strategy.com/us/services/support/contact.
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.


Comment

0 comments

Details

Knowledge Article

Published:

March 30, 2017

Last Updated:

March 30, 2017