How to modify UI elements in WSO2 API Manager Store

Removing Sandbox option for ‘using’ keys field from API Console:Go to the following template.

jag file located at<THEME_HOME>/templates/api/swagger/template.

jagRemove or comment the following line in the template.

jag file.

<option value="sandbox">Sandbox</option>3.

As we plan to upload the theme as a sub-theme of the default main theme, delete all the files in <THEME_HOME> folder except the ones that we edited.

The rest of the files are automatically applied from the main theme.


Save the <THEME_HOME> folder that contains the sub-theme of the main theme inside the<APIM_HOME>/repository/deployment/server/jaggeryapps/store/site/themes/wso2/subthemesfolder.

This makes your new theme a sub-theme of wso2.


Open the<API-M_HOME>/repository/deployment/server/jaggeryapps/store/site/conf/site.

jsonfile, and add the following code to it.

It specifies the base theme as wso2, which is overridden by the sub-theme newTheme.

"theme" : { "base" : "wso2", "subtheme" : "newTheme"}6.

Open the API Store.

Note the new theme that is applied to it.

????.Let’s checkout the new lookAfter the modifications, you will be able to observe the API Manager Store like following.

After removing the ‘Sandbox Keys’ tab in ApplicationsAfter removing the Sandbox option in ‘using’ keys field in API Console????.DiscussionBravo!.Now you can apply any modification to the WSO2 API Manager Store that in your imagination by following above given steps.

In the above example I describe a simple requirement.

However, with your requirement you can add any modification using a new sub-theme.

Cheers!!.????More details on WSO2 API Manager UI change:Adding a New API Store Theme – API Manager 2.


0 – WSO2 DocumentationThemes are located in the /repository/deployment/server/jaggeryapps/store/site/themes folder.

There are separate…docs.



. More details

Leave a Reply