Tuesday, October 20, 2015

How to modify tenant API store main page in WSO2 API Manager.

In this article we will discuss how we can modify tenant API Store to support lengthy tenant domain names. With API Manager 1.9.0 we cannot have very lengthy names. In this modification we will show part of tenant name in store and show full name when you place mouse courser on tenant store.

in template.jag(/store/site/themes/fancy/templates/api/tenant-stores-listing/template.jag) paste following before this line

"<li class="thumbnail span3 tenent-thumb">"
<a href="<%= encode.forHtmlAttribute(encode.forUri(jagg.getSiteContext() + 
"?tenant="+tenantDomains[i])) %>" title="<%=tenantDomains[i]%>">

in css(styles-layout,css) do following
#tenent_list{ width:900px }
.tenent-thumb{ margin: 0.79% 0.79% !important; /* re-declare thumb border styles since it is overidden by styles-layout */ border: 1px solid #DDDDDD; border-radius: 4px 4px 4px 4px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); display: block; line-height: 20px; padding: 8px 4px 4px 4px; transition: all 0.2s ease-in-out 0s; }
.tenent-thumb h3{ margin:0px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:200px; }

Then you will see it as follows.

No comments:

Post a Comment