Flyout mode configuration
To integrate the Connections Engagement Center into the Connections top navigation bar, configure a custom drop menu in the header.jsp in the <CUSTOMIZATION_DIR/>.
Step | Instructions |
---|---|
1 |
|Copy the header.jsp file into Connections customization folder under common/nav/templates/.
| |2
|Add the following markup to the header.jsp (for example after the section containing:
<li><span class=lotusBranding>
. . .
</span></li>
```
Start Connections Engagement Center FLYOUT PAGE
--%>
END Connections Engagement Center FLYOUT PAGE
|
|3
|Add the following CSS to your Connections theme customization and copy the images for the Flyout page to the <THEME\_FOLDER\>/images folder of the <CUSTOMIZATION\_DIR\>.
**Note:** For Right-to-Left languages such as Hebrew or Arabic, add the following CSS to the customRTL.css file.
```
.xccTHIcon {
background-image: url("/com.ibm.lconn.core.styles.oneui3/hikariTheme/images/flyout.png");
background-position: 0 0;
background-repeat: no-repeat;
height: 16px;
margin: 2px 0 0 0;
width: 16px;
}
.lotusui30 #lotusBannerFlyout.lotusSelected .xccTHIcon,
.lotusui30 #lotusBannerFlyout.lotusHover .xccTHIcon,
.lotusui30 .lotusBanner .xccTHIcon:hover,
.lotusui30 .lotusBanner .xccTHIcon:focus,
.lotusui30 .lotusBanner .xccTHIcon:active {
background-image: url("/com.ibm.lconn.core.styles.oneui3/hikariTheme/images/flyout_active.png");
}
| |4
|Restart the Connections servers to publish the changedheader.jsp to all Connections applications.
|
Parent topic:Mode configuration