IBM Connections 4: Customize, Security, Performance, and Integration
- Customize
- User interface customization
- Customization best practices
- Customize the user interface
- Customize the navigation bar
- Customize images
- Add styles to the IBM Connections stylesheet
- Making extensive color and style changes
- Customize the login page
- Customize the footer
- Customize the error page
- Customize the Get Started view
- Customize product strings
- Overriding and extending JavaScript in IBM Connections
- Extend JSP files with custom tags
- Customize notifications
- Customize a blog theme
- Add a custom theme to Communities
- Use Profiles and Communities business cards
- Customize Profiles
- Add new ways to share content
- Required post-customization step
- Customize Metrics reports
- Security
- Allow third-party applications access to data via the OAuth2 protocol
- Enable virus scanning
- Forcing users to log in before they can access an application
- Configure single sign-on
- Set the single sign-on domain name
- Enable single sign-on for Tivoli Access Manager
- Enable single sign-on for SiteMinder
- Enable single sign-on for Lotus Quickr
- Enable single sign-on for Domino
- Enable single sign-on for standalone LDAP
- Enable single sign-on for the Windows desktop
- Enable single sign-on for Tivoli Access Manager with SPNEGO
- Enable single sign-on for SiteMinder with SPNEGO
- The customAuthenticator element for back-end inter-service communication
- Configure the AJAX proxy
- Securing applications from malicious attack
- Forcing traffic to be sent over SSL
- Performance
- Integrate with other products
- Install plug-ins to use IBM Connections in other applications
- IBM Connections Plug-in for IBM Sametime
- IBM Connections Portlets for WebSphere Portal
- What's New in the IBM Connections Portlets for WebSphere Portal
- Deploying the IBM Connections portlets
- Configure the resource environment provider
- Configure the DynaCache
- Set up an authentication alias for the portlets
- Configure portlets to use common directory services
- Import a certificate to support SSL
- Configure authentication for the portlets
- Enable single sign-on for the portlets using a stand-alone LDAP server
- Configure single sign-on for portlets with TAM and SPNEGO
- Configure single sign-on with TAM
- Configure single sign-on for portlets with Siteminder and SPNEGO
- Configure single sign-on for portlets with SPNEGO
- Change the realm name
- Enable basic authentication
- Update the portlet theme
- Install the IBM Connections Portlets for IBM WebSphere Portal
- Configure the application-specific AJAX proxy to support authentication
- Uninstall the IBM Connections portlets
- Optional and recommended configuration
- Community Pages
- Configure search integration
- Display action buttons and links for anonymous users
- Conditional Loading of the Lotus CSS bundle
- Configure the Connections business card
- Configure links to open Connections in the same browser window
- Enable logging for the portlets
- Pinning portlet content to a tag
- Configure and wiring the Tags portlet
- Addressing IBM Connections content from a portlet
- IBM Connections Business Card
- IBM Connections Desktop Plug-ins for Microsoft Windows
- Performing a user installation
- Performing a silent installation
- Repairing or removing the IBM Connections Desktop plug-ins
- Preferences and policies for the IBM Connections Desktop Plug-ins for Microsoft Windows
- Manage policies and preferences with a group policy
- Configure dynamic feeds for the Outlook Social Connector
- IBM Connections Plug-in for Microsoft SharePoint
- IBM Connections Status Updates Plug-in for Lotus Notes
- IBM Connections Files Plug-in for Lotus Notes
- Install the IBM Connections Files plug-in for Lotus Notes
- Install the Files plug-in on a Windows client
- Silently installing the IBM Connections Files plug-in (Windows)
- Install the Files plug-in on a Mac client
- Silently installing the IBM Connections Files plug-in (Mac)
- Viewing the log files
- Uninstall the IBM Connections Files plug-in
- IBM Lotus Notes Activities sidebar
- Install plug-ins to use other applications in IBM Connections
- IBM Lotus Quickr Library widgets for IBM Connections
- IBM Connections Widget for Microsoft SharePoint
- IBM Connections Connector for Lotus Quickr
- Install the IBM Connections Connector for Lotus Quickr
- Supporting Lotus Quickr authenticated feeds
- Edit the Lotus Quickr configuration file
- Configure roles for Lotus Quickr places
- Enable SSL access to the Lotus Quickr server
- Integrate with SiteMinder and Tivoli Access Manager
- Use the Lotus Quickr Delayed Synchronizer
- Uninstall the Lotus Quickr connector
- Upgrading the Lotus Quickr connector
- Optional: defining a list of supported Lotus Quickr servers for Communities
- Use plug-ins from IBM Connections in other products
- Use the IBM Connections Plug-in for IBM Sametime
- Use the IBM Connections Portlets for WebSphere Portal
- Personalizing a portlet
- The Activities portlet
- The Blogs portlet
- The Blogs Summary portlet
- The Bookmarks portlet
- The Bookmarks Summary portlet
- The Profiles Portlet
- The Profiles Summary portlet
- The Tags portlet
- The Wikis portlet
- The Community Overview portlet
- The Forums portlet
- The Forums Summary portlet
- Use the IBM Connections Desktop Plug-ins for Microsoft Windows
- Connecting to an IBM Connections site
- Use the IBM Connections Plug-in for Microsoft Office
- Add documents to Files
- Add documents to Communities
- Add documents to Activities
- Add documents to Wikis
- Add Word documents to Blogs
- Add IBM Connections profiles to Word documents
- Add IBM Connections bookmarks to Word documents
- Add bookmarks to IBM Connections from Word documents
- Search from Office for IBM Connections content
- Use the IBM Connections Plug-in for Microsoft Outlook
- Viewing IBM Connections user business cards
- Add Outlook emails to Files
- Add Outlook emails to Communities
- Add Outlook emails to Activities
- Add Outlook emails to Wikis
- Add IBM Connections users to Outlook emails
- Search from Outlook for IBM Connections content
- Use IBM Connections with the Outlook Social Connector
- Use the IBM Connections Plug-in for Microsoft Windows Explorer
- Search IBM Connections from Microsoft Office and Outlook
- Set preferences for IBM Connections Plug-ins for Microsoft Windows
- Use the IBM Connections Status Updates Plug-in for Lotus Notes
- Use the IBM Connections Files plug-in for Lotus Notes
- Use the IBM Lotus Notes Activities sidebar
- Use plug-ins from other products with IBM Connections
IBM Connections 4 Part 4: Customize, Security, Performance, and Integration
IBM® Connections 4 Part 4: Customize, Security, Performance, and Integration
Customize
Customize IBM Connections to fit your environment.
- This documentation is provided to help you customize your deployment of IBM Connections. IBM Support can address questions about the customization process, but cannot address questions about the particulars of your customization.
- If you customized a previous release of IBM Connections, note that there is no migration path provided for importing your changes into IBM Connections 4. Any customization work performed at the EAR folder level will be overwritten after you upgrade to a new version of the product. In addition, customization work carried out in the customization directory may no longer be valid if the customized file has been updated in the new fix pack or by applying a later interim fix.
Before upgrading to IBM Connections 4, ensure that you review and make a note of your existing customizations so that you can verify them post-migration and rework if necessary.
User interface customization
You can customize the IBM Connections user interface to meet the needs of your organization.
For information about how to customize specific areas of the user interface, refer to the task-specific topics that are referenced at the end of this topic.
If you customized the IBM Connections user interface in a previous release of the product, note that there is no migration path provided for importing your changes into IBM Connections 4. Before upgrading to IBM Connections 4, review and make a note of your existing customizations so that you can verify them post-migration and rework if necessary.
Customization best practices
Use the following guidelines to help you to implement and manage customizations in your deployment of IBM Connections.
Most of the changes that you make to product files are stored in the customization directory, the location of which is defined by the IBM WebSphere® Application Server variable, CONNECTIONS_CUSTOMIZATION_PATH. It is best practice to make your customization changes within the customization directory only. Changes that cannot be made using the customization directory are known as product modifications.
The type of changes that you can make using the customization directory include:
- Changes to static files, such as images, CSS, HTML, and text files.
- Changes to real files, that is, files that are not generated at runtime and which get served directly to the browser.
- Changes to JSP files using a standard include request, for example, <jsp:include page="myjspfragment.jspf" .../> and <c:import url= myjspfragment.jspf/>.
The following types of change cannot be made using the customization directory:
- Changes to JSP files using the JSP include directive. For example: <%@ include file="myjspfragment.jspf"%>.
- Changes to files within a Java. Archive (JAR) file. For example, adding custom strings to the ui.properties file in the lc.profiles.web.app-3.0.jar archive to customize error messages for field validation.
- Changes to Java classes (Java class files).
- Changes to TAG files. These files are used in the Communities and Forums applications.
- Changes to TLD files.
- Changes to most XML configuration files in the WEB-INF directory. This includes web.xml.
Customization guidelines
- Keep your customization directory under source control to allow you to maintain it and track your changes over time.
- Copy only the resources files to modify to your customization directory. This makes it easier for you to track which files you changed and when.
- Always add comments to your customized files to describe where and why changes were made.
- Use a web inspector to help you to locate the CSS rules that you want to change. For example, Firebug on Mozilla Firefox, Webkit Inspector on Google Chrome or Apple Safari, or Weinre for Mobile.
- Use documented, public APIs where possible.
- Do not modify JSP files inside web modules or JAR files. Instead, use supported extension points where available, for example, for login pages or error pages, and so on.
- Back up the customization directory before a product upgrade:
For more information, see Saving your customizations.
- Rename the customization directory to a temporary name.
- Apply the IBM Connections interim fix or fix pack.
- Verify the functionality.
- Compare the updated files to the customized copy and then merge the changes.
- Change the name of the customization directory back to the original name.
- Test your customizations.
Customize the user interface
The steps that you must perform to customize IBM Connections are the same no matter what part of the product you are customizing. You need to find the relevant source file, save a copy of the file in the appropriate customization directory, edit the file, and then validate your changes.
Start IBM Connections and review the product user interface to determine which areas of the product you want to customize. Use the steps outlined here as a general guide to the process for customizing the product user interface. For additional detail on how to customize specific areas of the user interface, refer to the task-specific topics that are referenced at the end of this topic. For information about best practices to follow when customizing your deployment, see Customization best practices.
The IBM Connections user interface style is based on the IBM Lotus® User Interface Toolkit 3.0.
- Find the file that serves as the source of the area of the product to edit. For a list of the web application source directories and OSGi bundles that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Copy the file to customize and past it into the appropriate customization directory. For more information, see Determining where to save your customizations.
The following table identifies the files that serve as the source for user interface areas that are popular targets for customization. The files are located in the nav folder of the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/application_name.ear/application_name.warwhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
Table 1. Popular customization areas
Feature File location Cascading stylesheets
- To add custom styles to the product, edit the following files:
If your users view the product in Arabic, Hebrew, or another right-to-left language, copy the defaultTheme_rtl.css file too.
For more information, see Add styles to the IBM Connections stylesheet.
- /nav/common/styles/defaultTheme/custom.css
- /nav/common/styles/defaultTheme/custom_rtl.css
- To make extensive changes to the colors used in the product, edit the following file:
/nav/common/styles/defaultTheme/defaultTheme.cssFor more information, see Making extensive color and style changes.
Error page /nav/templates/error.jsp For more information, see Customize the error page.
Footer /nav/templates/footer.jsp For more information, see Customize the footer.
Login page /nav/templates/login.jsp For more information, see Customize the login page.
Navigation bar /nav/templates/header.jsp For the menus available from the navigation bar:
/nav/templates/menu/people.jsp /nav/templates/menu/communities.jsp /nav/templates/menu/apps.jspFor more information, see Customize the navigation bar.For example:
- To edit the footer and have the same footer be displayed in all of the applications, store the updated footer file in the following directory:
customizationDir/common/nav/templates/footer.jsp
- To change the login page of a single application, store the updated login page file in the directory where customizations that are specific to that application are stored. For example, to change the login page of the Files application only, store the login.jsp file in the files subdirectory instead of the common subdirectory:
customizationDir/files/nav/templates/login.jsp
- Edit the file stored in the customizationDir directory to make your changes.
- Test your changes by refreshing the web browser. You might also need to clear your browser cache to see the changes.
- When you are ready to publish your changes, turn off the customization debugging capability.
- Use the WebSphere Application Server Integrated Solutions Console, stop and restart each application EAR file.
- Force all user web browsers to refresh all cached content and display your changes by running the command that updates the product version stamp. For more information, see Required post-customization step.
What to do next
See the following topics for more information about customizing specific areas of the product.
Determine where to save your customizations
When you are customizing your deployment of IBM Connections, you must save your customized files to the appropriate directory to ensure that your customizations override the default settings. The base directory where you need to store your customizations is defined during installation, when it is saved as an IBM WebSphere Application Server variable named CONNECTIONS_CUSTOMIZATION_PATH. By default, this variable is set to installDir/data/customization. This customization base directory is referenced as customizationDir throughout the documentation
To determine the location of your customization directory, check the value of the CONNECTIONS_CUSTOMIZATION_PATH variable for your deployment. After you have determined the base directory location, you can then identify the subdirectory where you need to save your customizations.
- Log in to the IBM WebSphere Application Server Integrated Solutions Console.
- Expand Environment and select WebSphere variables.
- Look for CONNECTIONS_CUSTOMIZATION_PATH in the list of variable names and make a note of the value. For example, it might look like /local/IBM/Connections/data/shared/customization.
- Save your customized files in the appropriate subdirectory of the customization directory:
- To save customizations that apply to all the applications, copy the file into the common subdirectory:
customizationDir/common
- To save customizations that apply to a single application only, copy the file into the subdirectory for that application:
Table 2. Application-specific customization directories
Directory path Description customizationDir/common Stores files to be applied to all of the applications. You most often copy edited files to this directory. customizationDir/activities Stores files to be applied to the Activities user interface only. customizationDir/blogs Stores files to be applied to the Blogs user interface only. customizationDir/bookmarks Stores files to be applied to the Bookmarks user interface only. customizationDir/communities Stores files to be applied to the Communities user interface only. customizationDir/files Stores files to be applied to the Files user interface only. customizationDir/forums Stores files to be applied to the Forums user interface only. customizationDir/homepage Stores files to be applied to the Home page user interface only. customizationDir/metrics Stores files to be applied to the Metrics page user interface only. customizationDir/moderation Stores files to be applied to the Moderation page user interface only. customizationDir/news Stores files to be applied to the News user interface only. customizationDir/profiles Stores files to be applied to the Profiles user interface only. customizationDir/search Stores files to be applied to the Advanced Search user interface only. customizationDir/wikis Stores files to be applied to the Wikis user interface only. The following table identifies where to store customized versions of files when the customizations apply to all the applications.
Table 3. Directory location for popular customization targets
Directory path Description customizationDir/themes/defaultTheme/custom.css Customized styles customizationDir/themes/defaultTheme/defaultTheme.css Customized themes customizationDir/common/nav/templates/login.jsp Customized login page customizationDir/common/nav/templates/footer.jsp Customized footer file customizationDir/common/nav/templates/error.jsp Customized error page customizationDir/themes/images Customized images The following table identifies where to store application-specific versions of customized CSS files:
Table 4. Directory location for application-specific CSS files
Directory path Description customizationDir/themes/base/applications/activities.css Customized styles for Activities. customizationDir/themes/base/applications/blogs.css Customized styles for Blogs. customizationDir/themes/base/applications/dogear.css Customized styles for Bookmarks. customizationDir/themes/base/applications/bookmarklet.css Customized styles for the Bookmarklet. customizationDir/themes/base/applications/communities.css Customized styles for Communities. customizationDir/themes/base/applications/files.css Customized styles for Files. customizationDir/themes/base/applications/forums.css Customized styles for Forums. customizationDir/themes/base/applications/homepage.css Customized styles for the Home page. customizationDir/themes/base/applications/metrics.css Customized styles for Metrics. customizationDir/themes/base/applications/moderation.css Customized styles for Moderation. customizationDir/themes/base/applications/news.css Customized styles for News. customizationDir/themes/base/applications/profiles.css Customized styles for Profiles. customizationDir/themes/base/applications/wikis.css Customized styles for Wikis.
- For information about where to save customized application properties files, see Property file strings.
- For information about where to save customized JavaScript files, see JavaScript resource strings.
Enable and disable customization debugging
By enabling customization debugging mode, you can force applications to reload override files every time a browser request is made. This capability allows you to see your customization changes in the product instantly.
Do not leave the product in customization debugging mode when you are using it in a production environment. This capability is extremely resource intensive and has a major impact on product performance. Only use debugging mode while you are making and testing changes to the user interface during the testing phase. Ensure that you disable this feature after you have validated your customizations. If you forget to disable customization debugging, an error is written to the log to remind you.
- To turn on the customization debugging capability, add a WebSphere Application Server environment variable named CONNECTIONS_CUSTOMIZATION_DEBUG and set it to true.
- Open the IBM WebSphere Application Server Integrated Solutions Console, expand Environment, and then click WebSphere variables.
- In the Scope section, select cell 1 from the list, and then click New.
- Set the following values into the fields:
- Name
- CONNECTIONS_CUSTOMIZATION_DEBUG
- Value
- true
- Click Apply, and then OK to return to the previous page.
- Restart the server for your changes to take place.
- To disable customization debugging, set the CONNECTIONS_CUSTOMIZATION_DEBUG variable to false.
- Open the Integrated Solutions Console, expand Environment, and then click WebSphere variables.
- In the Scope section, select cell 1 from the list.
- Select CONNECTIONS_CUSTOMIZATION_DEBUG and enter false in the Value field.
- Click Apply, and then click OK.
- Restart the server for your changes to take place.
Application WAR files and OSGi bundles
The following web application directories and OSGi bundles are packaged as part of IBM Connections.
Application WAR files
The default location for the web application directory for each application is:
WAS_HOME/profiles/profile_name/installedApps/cell_name/application_name.ear/application_name.warwhere:
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is one of the following file names:
Table 5. Application WAR files
File Description oawebui.war WAR file for the Activities application blogs.war WAR file for the Blogs application dogear.webui.war WAR file for the Bookmarks application comm.web.war WAR file for the Communities application files.web.war WAR file for the Files application forum.web.war WAR file for the Forums application homepage.war WAR file for the Home page application lc.metrics.ui.war WAR file for the Metrics application sn.moderation.ui.war WAR file for the Moderation application news.web.war WAR file for the News application lc.profiles.app.war WAR file for the Profiles application search.war WAR file for the Search application wikis.web.war WAR file for the Wikis application
OSGi bundles
The following OSGi bundles are packaged as part of IBM Connections,...where version_stamp is a version stamp that may change depending on the interim fix:
Table 6. OSGi bundles
OSGi bundle Description com.ibm.dwa.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Communities Events application. This bundle contains many of the "calendar view" related user interface handling code for the Communities Events widget.
com.ibm.lconn.activities.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Activities application user interface. com.ibm.lconn.activitystreams.search.admin.web.resources_version_stamp.jar Contains all the HTML, JavaScript, and CSS files used by the activity stream search administration user interface. com.ibm.lconn.blogs.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Blogs application. This bundle contains user interface handling code for the Blogs application.
com.ibm.lconn.calendar.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Communities Events application. This bundle contains user interface handling code for most of the features for the Communities Events widget, and code for the Events widget that displays in the Home page.
com.ibm.lconn.communities.catalog.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Communities Places catalog user interface. com.ibm.lconn.communities.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Communities application user interface. Includes resources for the Bookmarks, Feeds, Members, and Subcommunities navigator widgets. com.ibm.lconn.communityblogs.web.resources_version_stamp.jar Contains JavaScript code that is specific to the community Blog widget and Ideation Blog widget. This bundle contains user interface handling code for the Blog and Ideation Blog widgets that are available in the Communities application.
com.ibm.lconn.communityfiles.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Files widget user interface in Communities application. com.ibm.lconn.core0.web.resources_version_stamp.jar Contains core JavaScript widgets, which are mostly a hard copy of the com.ibm.lconn.core.web.resources_version_stamp.jar source. This bundle will be deprecated in a future release.
com.ibm.lconn.dogear.web.resources_version_stamp.jar Containing JavaScript code that is specific to the Bookmarks application. This bundle contains user interface handling code for the Bookmarks application.
com.ibm.lconn.ecmpicker.web.resources_version_stamp.jar Contains the JavaScript code for the document picker that is used to connect to ECM repositories. com.ibm.lconn.files.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Files application user interface. com.ibm.lconn.forums.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Forums application. This bundle contains the user interface handling code for Forums, and also code for the Forums widgets in Communities.
com.ibm.lconn.homepage.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Home page application. This bundle contains the Home page specific elements of the activity stream, user interface handling code for the Home page, and also code for the Home page widgets.
com.ibm.lconn.librarywidget.web.resources_version_stamp.jar Contains the user interface code for the Linked Library widget. com.ibm.lconn.metrics.plugins.web.resources_version_stamp.jar Contains JavaScript code that is needed to bind to other IBM Connections applications for Metrics requirements: track read events in Files and Activities. com.ibm.lconn.metrics.reports.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Cognos® report page. com.ibm.lconn.metrics.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Metrics application: actions (dialogs), beans, scenes, utility classes, custom widgets, and core application code that implements scenes life-cycle. com.ibm.lconn.moderation.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Moderation application. com.ibm.lconn.news.digest.web.resources_version_stamp.jar Contains JavaScript and strings for the user interface elements that are specific to the News application, including the language selector that is used on the Sets page in News. com.ibm.lconn.news.microblogging.sharebox.form_version_stamp.jar Contains code for the microblogging widget that displays before the activity stream. This bundle also contains code that provides the gadget used for the Share dialog, and strings that are used in the microblogging widget and dialog.
com.ibm.lconn.oauth.web.resources_version_stamp.jar Contains JavaScript resources for the OAuth administration application. com.ibm.lconn.profiles.web.resources_version_stamp.jar Contains JavaScript and resource strings for the Profiles application user interface in places like the general user interface, widgets, and business card. com.ibm.lconn.recomm.web.resources_version_stamp.jar Contains strings and JavaScript resources for the Related Communities widget. com.ibm.lconn.share0.web.resources_version_stamp.jar Contains base classes (dialogs, widgets, and utils) for the com.ibm.lconn.wikis.web.resources__version_stamp.jar file. com.ibm.lconn.wikis.web.resources_version_stamp.jar Contains JavaScript code that is specific to the Wikis application: actions (dialogs), beans, scenes, utility classes, custom widgets, and core application code that implements the scenes life-cycle.
Language codes
Use the language codes listed in the table to identify the language-specific version of the JavaScript or properties files to customize.
Set the language code as a suffix to the file name using the format _language_code.For example, customizationDir/strings/com.example.resources_de.properties,
...where the language code _de indicates that the resource strings are in German.
Table 7. Language codes
Code Language ar Arabic ca Catalan cs Czech da Danish de German el Greek en English es Spanish fi Finnish fr French hu Hungarian it Italian iw Hebrew ja Japanese kk Kazakh ko Korean nl Dutch no Norwegian pl Polish pt Iberian Portuguese pt-BR Brazilian Portuguese ru Russian sl Slovenian sv Swedish th Thai tr Turkish zh Simplified Chinese If you provide translated strings in Simplified Chinese, be sure to also provide strings in Traditional Chinese. When the customer's language preference is set to Traditional Chinese, but that language is not provided, Simplified Chinese is displayed by default.
zh-TW Traditional Chinese
Customize the navigation bar
You can edit the files that control the content of the IBM Connections navigation bar to add to the bar's functionality. For example, you can add extra links to the navigation bar, remove the Log Out link, or insert extra drop-down menus.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- To add a link to the list of links in the navigation bar, for example, a link called IBM software that links to that website:
- Make a copy of the header.jsp file, which defines the content of the main navigation bar. You can access the file from the following directory:
application_name.war/nav/templatesFor information about how to find the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
The header.jsp file is the same for each application so you only need to make a copy of one of the header.jsp files.
You might want to copy your header changes to the login.jsp and error.jsp files for consistency across your deployment. See Customize the login page and Customize error page for more information.
- Paste the copy of the header.jsp file into the appropriate subdirectory in the customization directory, most likely the common directory. See Determining
...where to save your customizations for more details about customization subdirectories.
For example, to change the look of the navigation bar in all the applications, copy the file into the following directory:
customizationDir/common/nav/templates
- Open the copy of the header.jsp file in a text editor and look for the following section:
Links to each installed application are displayed here. To add a link to another website, add the following markup: <li> <a href="http://mycompany.com/link">My Company Site</a> </li> to the end of the following <UL>. This section replaces the macro "{{application links: li }}" in the previous version of the header.
- Add the following HTML code before the closing </ul> tag:
<li><a href="http://www.ibm.com" >IBM website/a></li>
- After making your updates, save and close the copy of the header.jsp file. You do not need to restart the applications to see the links display.
- If you want to remove the Log Out link from the drop-down menu, for example, when single sign-on is enabled, you can prevent the link from being displayed by editing the logoutContainer element in the user.jsp file:
- Copy the user.jsp file from application_name.war/nav/templates/menu/ to the following location:
customizationDir/common/nav/templates/menu/user.jsp
- Modify the following line in the copied file to add a lotusHidden style:
--%><td class="lotusNowrap lotusHidden" id="logoutContainer"</><%--
- Save and close the customized user.jsp file.
- To add a new drop-down menu:
- Copy the user.jsp file from application_name.war/nav/templates/menu/ to the following location:
customizationDir/common/nav/templates/menu/user.jsp
- Copy one of the existing menu sections and change the "src" attribute to point to an servlet, JSP, or static HTML page containing the markup to use. Be sure to change the ID of the new element to avoid having duplicate IDs on the page.
For example:
<tr role="menuitem"> <td class="lotusNowrap" id="logoutContainer"> <a href="http://www.ibm.com">IBM Homepage</a> </td> </tr>
- Save and close the customized user.jsp file.
- To make changes to Communities, Profiles, and Apps menus, copy or remove code sections to render links in the respective JSP files:
- Copy one of the menu files from the following locations:
- Profiles menu: application_name.war/nav/templates/menu/people.jsp
- Communities menu: application_name.war/nav/templates/menu/communities.jsp
- Apps menu: application_name.war/nav/templates/menu/apps.jsp
- Paste the copied file into the following directory:
customizationDir/common/nav/templates/menu/
- Open the copied file in a text editor and make your changes.
- Save and close the customized file.
The Apps menu is always visible by default. If you remove all the applications that are listed by this menu, you also need to comment out this section in the header.jsp file:
<li id="lotusBannerApps" class="<c:if test="${first}">lotusFirst</c:if> <c:if test="${'communities' != appName && 'profiles' != appName && 'homepage' != appName}">lotusSelected</c:if>"><%-- --%><a onmouseover="dojo.require('lconn.core.header');lconn.core.header.menuMouseover(this);" onclick="dojo.require('lconn.core.header');lconn.core.header.menuClick(this);" onfocus="dojo.require('lconn.core.header');lconn.core.header.menuFocus(this);" role="button" _lconn_menuid="lconnheadermenu-apps" aria-label="<fmt:message key="label.menu.apps.name" />" src="<lc-cache:uri template="{staticLanguageRoot}/nav/templates/menu/apps.jsp" />" href="javascript:;" errormessage="<fmt:message key="${appName}.error.unavailable.title" />"><%-- --%><fmt:message key="label.menu.apps.name" /><%-- --%> <img role="presentation" src="<lc-ui:blankGif />" class="lotusArrow lotusDropDownSprite"><span class="lotusAltText">▼</span><%-- --%></a><%-- --%> </li>
- Optional: If you enabled customization debugging in step 1, turn off this capability when you are ready to publish your changes. Test whether your changes were added successfully by restarting the applications, and then refreshing the web browser. A browser refresh only shows you your changes if you turned on debugging. See Enabling and disabling customization debugging for more details.
- See Required post-customization step for information about how to update the product version stamp and ensure that your users see the changes the next time that they log in to IBM Connections.
Customize images
You can update the images used in IBM Connections to suit the needs of your organization. For example, you can replace the IBM logo with your company logo, or customize the sprited images and file type icons that are used in the product interface to fit with your company's branding.
Replace images
Customize the product by replacing images specific to IBM Connections with your own company images.
The procedure described here applies to non-sprited images only. For information about how to make changes to sprited images in IBM Connections, see Customize sprited images.
- Copy the image to replace and paste it to a new location.
Tip: To find the source file for the image to change, use one of the web inspector tools listed in Customization best practices to inspect the image. The image name displays in the img tag. If the image is sprited, you can see the class that has the image or icon
- Open the copied image file and update it as needed.
- Replace the original image with your new image by saving the updated file into the images subdirectory of the appropriate customization directory. See Determining
...where to save your customizations for more details about customization directories.
- Optional: To change the size of the image, do one of the following:
- If the dimensions of the image are specified in a CSS file, update the CSS file to customize the dimensions of the image.
- If the dimensions of the image are specified in a JSP or HTML file, update the relevant JSP or HTML file to customize the dimensions of the image.
- Stop and restart the Common.ear file in order to pick up the CSS changes.
- Test whether your custom image is being displayed successfully by refreshing the web browser and opening the page where the image is displayed.
- See Required post-customization step for information about how to update the product version stamp and ensure that your users see the changes the next time that they log in to IBM Connections.
Example
For an example of how to replace images in IBM Connections, see Changing the IBM Connections logo, which details how to replace the logos that are used in the product.
Change the IBM Connections logo
To customize IBM Connections so that it has the look and feel of your organization, you can specify a CSS override that replaces the IBM Connections logo with your company logo. Two IBM logos display in the product by default. The first logo contains the text IBM Connections and second logo is the graphical IBM logo. You can replace both logos with your company logo.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Create a CSS file named custom.css and store it in the following subdirectory of the customization directory:
customizationDir/themes/defaultThemeFor information about how to find out where your customizationDir directory is located, see Determining where to save your customizations.
- Save your company logo in the following directory:
customizationDir/themes/defaultTheme/images
- Open the CSS file in a text editor and add the following lines:
- To replace the IBM Connections text-based logo
with your company logo, add the following lines to the file:
.lotusui30 .lotusBanner .lotusLogo { background-image: url("images/logo.png"); height: image_heightpx; width: image_widthpx; } .lotusui30 .lotusBanner .lotusLogo .lotusAltText { display: none; }Where
- logo.png is the file name of your company logo.
- image_height is the height of the logo.
- image_width is the width of the logo.
- To replace the IBM graphic logo
with your company logo, add the following lines to the file:
.lotusui30 .lotusBanner .lotusIBMLogo { background-image: url("images/logo2.png"); background-position 0px 0px; height: image_heightpx; width: image_widthpx; }Where
- logo2.png is the file name of your company logo.
- image_height is the height of the logo.
- image_width is the width of the logo.
If you are supporting right-to-left languages, such as Arabic or Hebrew, you must make equivalent changes to the customRTL.css file and save that in the customizationDir/themes/defaultTheme directory as well.
- Save and close the custom.css file.
- Stop and restart the Common.ear file in order to pick up the CSS changes.
- When you are ready to publish your changes, turn off the customization debugging capability. Test whether your changes were added successfully by restarting the applications, and then refreshing the web browser. A browser refresh only shows you your changes if you turned on debugging. See Enabling and disabling customization debugging for more details.
- See Required post-customization step for information about how to update the product version stamp and ensure that your users see the changes the next time that they log in to IBM Connections.
Customize file type icons
You can add new file extensions to an existing file type icon, or add a new file extension with a new icon. Custom file type icons display in the Activities, Files, and Communities applications. They also display in the activity stream.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Add the new icon files to the following directory:
customizationDir/themes/imageswhere customizationDir is the base directory where your customizations should go. For more information, see Determining where to save your customizations.
- Make a copy of the sprite-lconn.css file. You can access the file from the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/application_name.ear/application_name.war/nav/common/styles/basewhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
- Paste the sprite-lconn.css file into the appropriate subdirectory of the customizationDir directory:
- When you want the edited file to be used by all the applications, post it to the customizationDir/themes/images/common directory.
- For the file to be used by a specific application only, post it to the customizationDir/themes/images/application_name directory.
- Open the new copy of the sprite-lconn.css file in a text editor and do one of the following:
- Add a new extension and associate it with an existing icon:
- Find the line with extensions that currently use the icon. For example, this is the line for extensions that use the "document" icon:
.lconn-ftype16-doc,.lconn-ftype16-docm,.lconn-ftype16-docx, .... {background-position: 0 -408px;}
- Add the new extension in the appropriate format. Make it lowercase, and replace non-alpha numeric characters (a through z and 0 through 9) with a dash ("-"). For example, add the extension .DocFormat_2010 to the list like this:
.lconn-ftype16-docformat-2010, .lconn-ftype16-doc,.lconn-ftype16-docm,.lconn-ftype16-docx, .... {background-position: 0 -408px;}
- Repeat steps a and b in the 32 and 64 pixel list. For example:
.lconn-ftype32-docformat-2010, .lconn-ftype32-doc,.lconn-ftype32-docm,.lconn-ftype32-docx, .... {background-position: 0 -1112px;}.lconn-ftype64-docformat-2010, .lconn-ftype64-doc,.lconn-ftype64-docm,.lconn-ftype64-docx, .... {background-image: url(../images/ftWordProcessing64.png);}
- Add a new extension and a new icon by creating new rules for 16, 32, and 64 pixel icons, for example:
.lconn-ftype16-docformat-2010 { background-image:url(myCustomExtensionIcon16.png) !important; background-position: 0 0; }.lconn-ftype32-docformat-2010 { background-image:url(myCustomExtensionIcon32.png) !important; background-position: 0 0; }.lconn-ftype64-docformat-2010 { background-image:url(myCustomExtensionIcon64.png) !important; background-position: 0 0; }
- When you are ready to publish your changes, turn off the customization debugging capability. Test whether your changes were added successfully by restarting the applications, and then refreshing the web browser. A browser refresh only shows you your changes if you turned on debugging. See Enabling and disabling customization debugging for more details.
- See Required post-customization step for information about how to update the product version stamp and ensure that your users see the changes the next time that they log in to IBM Connections.
File type icons
These icons are provided by IBM Connections for displaying files.
Table 8. IBM Connections file type icons
Icon Description File extensions (partial list) ![]()
generic
Anything not covered by other images.
![]()
text
.323, .asc, .bas, .c, .etx, .h, .jw, .log, .mcw, .msg, .ow, .pfs, .qa, .rtf, .sow, .text, .tsv, .tw, .txt, .uls, .vw3, .ws, .xy
![]()
document
.doc, .docm, .docx, .dot, .dotm, .dotx, .en4, .enw, .leg, .lwp, .lwp7, .manu, .msw, .mwp, .mwp2, .mwpf, .odc, .odg, .odt, .ort, .otg, .oth, .otm, .ott, .pages, .pcl, .rtx, .std, .stw, .sxd, .sxq, .sxw, .w6, .w97, .wm, .wp5, .wp6, .wpf
![]()
data
.123, .12m, .acs, .csv, .dbs, .dez, .ens, .fcd, .fcs, .mwkd, .mwks, .odf, .ods, .oss, .otf, .ots, .qad, .smd, .sms, .stc, .sxc, .sxm, .wg2, .wk4, .wk6, .xla, .xlam, .xlc, .xlm, .xls, .xlsb, .xlsm, .xlsx, .xlt, .xltm, .xltx, .xlw
![]()
presentation
.flw, .key, .mass, .odp, .ope, .otc, .otp, .pot, .potm, .potx, .pp2, .pp97, .ppam, .pps, .ppsm, .ppsx, .ppt, .pptm, .pptx, .prz, .shw3, .sti, .sxi
![]()
Adobe PDF
.pdf, .ai, .eps, .ich, .ich6, .iwp, .ps
![]()
flash
.swf, .fla
![]()
code
.asp, .axs, .css, .htc, .htm, .html, .js, .jsp, .php, .sct, .stm, .wml, .xml, .xsl
![]()
graphic
.bmp, .cgm, .cmx, .cod, .djv, .djvu, .drw, .dxf, .eshr, .gif, .hgs, .ico, .ief, .img, .jfif, .jpe, .jpeg, .jpg, .odi, .oti, .pbm, .pcx, .pgl, .pgm, .pic, .pict, .png, .pnm, .pntg, .ppm, .psd, .psp6, .ras, .rgb, .sdw, .svg, .svgz, .tga, .tif, .tif6, .tiff, .wbmp, .wpg, .xbm, .xpm, .xwd
![]()
audio
.aac, .aif, .aifc, .aiff, .au, .kar, .m3u, .m4a, .mid, .midi, .mp3, .mpga, .ra, .ram, .rm, .rmi, .rpm, .snd, .wav, .wma
![]()
video
.asf, .asr, .asx, .avi, .divx, .flv, .lsf, .lsx, .mov, .movie, .mp2, .mp4, .mpa, .mpe, .mpeg, .mpg, .mpv2, .qt, .svi, .wmv
![]()
compressed
.cab, .dmg, .gtar, .gz, .jar, .rar, .sit, .sqx, .tar, .taz, .tgz, .z, .zip
![]()
contact
.crd, .vcard, .vcf, .vcrd
Customize sprited images
You can customize the sprited images used in IBM Connections by modifying the images and copying them to the appropriate customization directory.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Download the following file:
- Extract the contents of Spriting.zip to a local working directory.
- Modify the sprited images as needed using an image editor of your choice. The images are located in the resources/imageLibrary folder.
- From within your working directory, run the following command to build the sprites:
WAS_HOME/bin/ws_ant.sh target...where:
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- target is the name of the image that you want to sprite. You must specify this parameter when you run the ws_ant.sh command. For a full list of the targets that you can specify, see Sprite targets.
The first time you run the command, set the target to all. This is the default setting if you do not specify a target. For example:
/opt/IBM/WebSphere/AppServer/bin/ws_ant.sh allThe next time you run the command, you can specify a particular target to update specific sprites instead of all of them. For example:/opt/IBM/WebSphere/AppServer/bin/ws_ant.sh iconStates16
- From the working directory, run the following command to compile the final CSS for the sprited images:
./spriteCat.sh
- A css folder is created inside the resources directory. Copy all of the contents of this directory to the following location:
customizationDir/themes/
- When you are ready to publish your changes, turn off the customization debugging capability. Test whether your changes were added successfully by restarting the applications, and then refreshing the web browser. A browser refresh only shows you your changes if you turned on debugging. See Enabling and disabling customization debugging for more details.
- Update the version stamp and restart the application. For more information, see the topic, Required post-customization step.
Sprite targets
When you are customizing sprited images, you need to specify the sprite target as a parameter when you run the ws_ant.sh command.
The following table lists the sprites that you can customize for IBM Connections. You can also specify any of the specifically labeled components, such as iconsOther48, as a target for the ws_ant.sh command.
Table 9. Sprite targets
Target Includes all branding, icons, and other branding brandingLogos and brandingOther brandingLogos brandingLogos15, brandingLogos23, and brandingLogos30 brandingOther brandingOther16, brandingOther24, and brandingOther32 icons iconsActions, iconsComponents, iconsComponentsBlue, iconsComponentsGray, iconsComponentsWhite, iconsComponentTypes, iconsDisplayControls, iconsFileTypes, iconsMessages, iconsOther, and iconsStates iconsActions iconsActions16 and iconsCKActions16 iconsComponents iconsComponents16, iconsComponents32, iconsComponents64, and iconsComponents128 iconsComponentsBlue iconsComponentsBlue16, iconsComponentsBlue24, and iconsComponentsBlue32 iconsComponentsGray iconsComponentsGray16, iconsComponentsGray24, and iconsComponentsGray32 iconsComponentsWhite iconsComponentsWhite16, iconsComponentsWhite24, and iconsComponentsWhite32 iconsComponentTypes iconsComponentTypes16 iconsDisplayControls iconsDisplayControls16 iconsFileTypes iconsFileTypes16, iconsFileTypes32, and iconsFileTypes64 iconsMessages iconsMessages16 and iconsMessages48 iconsOther iconsOther16 and iconsOther48 iconsStates consStates16 other otherColumnHeadings, otherFramework, otherMediaPlayer, otherPeople, otherStatus, and otherTree otherColumnHeadings otherColumnHeadings16 otherFramework otherFramework16 and otherFramework32 otherMediaPlayer otherMediaPlayer16, otherMediaPlayer32, otherMediaPlayer45, and otherMediaPlayer75 otherPeople otherPeople16, otherPeople24, otherPeople32, otherPeople48, otherPeople64, otherPeople128, and otherPeople155 otherStatus otherStatus9 otherTree otherTree16
Add styles to the IBM Connections stylesheet
You can change the look of the IBM Connections pages to give them a custom look by adding new style definitions in the cascading stylesheet and applying that style to different parts of the product user interface. To add a custom style to the IBM Connections stylesheet, you need to create a CSS file containing your customized styles and store it in the customizationDir/themes/defaultTheme folder.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Create a CSS file named custom.css and store it in the appropriate subdirectory of the customization directory.
For example, to change the style of a class in all the applications, you copy the file into the following directory:
customizationDir/themes/defaultThemeFor information about how to find out where your customizationDir directory is located, see Determining where to save your customizations.
A custom.css file is present in the WAR file for each application, but the file does not contain any useful content by default, so it is easier to create a custom.css file from scratch.
- Open the CSS file in a text editor, and define any new styles to apply to the product user interface.
You might want to use the defaultTheme.css file as a resource for styles that have already been defined for the application. You can find this file in the following location:
http://server_name/connections/resources/web/com.ibm.oneui3.styles/css/defaultTheme/defaultTheme.cssAlternatively, you can copy it from any of the application WAR directories:
application_war/nav/common/styles/defaultTheme/defaultTheme.cssFor a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- Add new style definitions or edit the style specified for the class definition that you copied from the defaultTheme.css file.
- Save and close the custom.css file.
- Stop and restart the Common.ear file in order to pick up the CSS changes.
- To test your style changes, reference your new style from a user interface element, and then refresh your web browser.
- Optional: If you enabled customization debugging in step 1, turn it off when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for information about how to apply your changes permanently.
Making extensive color and style changes
Edit the defaultTheme.css file to make extensive changes to the product user interface, such as changing the font style and background color.
Some applications define styles and colors beyond those that are specified in the defaultTheme.css file. These additional and application-specific styles are defined in files named after the applications, for example, activities.css. The styles and colors defined in these application-specific styles override those specified in the defaultTheme.css. When you want to customize a UI control that is only used in a particular application, you might need to edit the application-specific .css file rather than the defaultTheme.css file. If so, you can overwrite the version of that file in the product by storing your updated version in the defaultTheme customization directory for that application.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Create a defaultTheme directory in the customizationDir directory.
For example: customizationDir/themes/defaultThemeFor information about how to find out where your customizationDir directory is located, see Determining where to save your customizations.
- Navigate to the web application defaultTheme directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/application_name.ear/application_name.war/nav/common/styles/defaultThemewhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
- Copy the defaultTheme.css file and any other files required to change, and then paste them into the common customization defaultTheme directory.
For example:customizationDir/themes/defaultTheme/defaultTheme.cssNotes:
- Pasting the defaultTheme.css file into the common customizationDir directory makes it available to all the applications.
- To customize the theme for a specific application, you must override the application-specific .css file in the following directory:
customizationDir/themes/base/applications/application_name.cssFor a list of the customization locations for application-specific themes and styles, see Determining where to save your customizations.
- Copy and paste files only, do not copy and paste the directory.
- Open the copy of the defaultTheme.css file in a text editor.
- Edit the style specified for the class definition that you want to change. For example, let's say to update the following lines of text:
body.lotusui30 {color:#222;background:none;background-color:#cee1fc} .lotusContent{background-color:#fff;}
- To change the default color of standard text, change the value defined for the body color from #222, which is black, to a color of your choosing.
The font color that you define for the body text will only be applied to text that is contained within basic body tags, such as <p> tags. User interface items such as page headings, subheadings, and links are formatted differently elsewhere.
- To change the default background color, change the value defined for the .lotusContent background-color from #fff, which is white, to a color of your choosing.
- Save and close the CSS file.
- To test your style changes refresh the web browser.
- Optional: If you enabled custom debugging, turn off the debugging capability when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for information about how to apply your changes permanently.
Customize the login page
Customize the login page in IBM Connections to have the appropriate style and content for your organization. You can change the appearance of the IBM Connections login page to meet your organization's needs. For example, you might want to replace the IBM logo that is displayed on the login page with your own company logo. Or you might want to include a link that enables users to have their user IDs or passwords sent to them through email.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Copy the login.jsp file from the WAR file of one of the applications. You can access the file from the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/ application_name.ear/application_name.war/nav/templateswhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
The login.jsp file is the same for each application. You only need to make a copy of one instance of the file.
- Paste the login.jsp file into the appropriate subdirectory of the customizationDir directory.
See Determining where to save your customizations for more information about locating your base customization directory.
- To use the same login page for all of the applications, copy it into the common directory:
customizationDir/common/nav/templates/login.jsp
- To create a different login page per application, copy the file into the appropriate subdirectory for each application:
customizationDir/application_name/nav/templates/login.jsp
- Edit the login.jsp file or files to contain the information you want.
For information on how to replace the logo on the login page, refer to the steps covered in Changing the IBM Connections logo.
- Save and close the login page.
- To test your changes, log out of the product. Refresh the web browser, and then go to a login page.
- Optional: If you enabled custom debugging, turn off the debugging capability when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for details about how to apply your changes permanently.
Customize the footer
You can edit the files that control the content of the IBM Connections footer to improve the footer's functionality.
The footer.jsp file defines the content of the footer in IBM Connections. The style used by the footer is defined in the defaultTheme.css file. In addition to defining the style of IBM Connections, this file also sets the font color and background color of the navigation bar and footer.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Make a copy of the footer.jsp file. You can access the file from the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/ application_name.ear/application_name.war/nav/templateswhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
The footer.jsp file is the same for each application. You only need to make a copy of one instance of the footer.jsp file.
- Paste the copy of the footer.jsp file into the appropriate subdirectory in the customization directory, which is most likely the common directory. See Determining where to save your customizations for more details.
For example, to change the look of the footer in all applications, copy the file into the following directory:
customizationDir/common/nav/templates
- Open the copied footer.jsp file in an editor, and then determine the section of the footer to which you want to add your link.
For example, if you want to add a link to your company's help page to the Help section of the footer, find the Help section of the footer by searching for the following HTML markup:
The help links. Points to the end-user help for the current application, and to the public IBM forums for IBM Connections --%><lc-ui:templateLink key="help.help" appname="${appName}"><fmt:message key="label.footer.help.help" /> </lc-ui:templateLink><%-- --%><li><%-- --><a href="<c:out value="http://www-10.lotus.com/ldd/lcforum.nsf" />"><%-- --%><fmt:message key="label.footer.help.forums" /><%-- --%></a><%-- --%></li>Add your company help link to the section by adding the link as an <li> element to the <td> block.The help links. Points to the end-user help for the current application, and to the public IBM forums for IBM Connections --%><lc-ui:templateLink key="help.help" appname="${appName}"><fmt:message key="label.footer.help.help" /> </lc-ui:templateLink><%-- --%><li><%-- --%><a href="<c:out value="http://www-10.lotus.com/ldd/lcforum.nsf" />"><%-- --%><fmt:message key="label.footer.help.forums" /><%-- --%></a><%-- --%></li> <li> <a href="http://www.mycompany.com/help">My Company Help</a> </li><%--You do not need to add the <lc-ui:templateLink> or <fmt:message> elements. You can just add your link within a standard <li> element.
- Save and close the footer.jsp file.
- Restart the applications, and then refresh your web browser to see your changes.
- Optional: If you enabled custom debugging, turn off the debugging capability when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for information about how to apply your changes permanently.
Customize the error page
Customize the text on the error page in IBM Connections. You can change the text that is displayed on the IBM Connections error page to more closely reflect what users should do when they run into a problem. For example, you might want to replace the phrase "Contact your administrator" with details about who to contact, including an email address or other contact information.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Copy the error.jsp file from the WAR file of one of the applications. You can access the file from the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/application_name.ear/application_name.war/nav/templateswhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
The error.jsp file is the same for each application. You only need to make a copy of one instance of the file.
- Paste the file into the appropriate subdirectory in the customization directory, which is most likely the common directory. See Determining
...where to save your customizations for more details.
For example, to use the same error page in all the applications, copy the file into the following directory:
customizationDir/common/nav/templatesIf you want to create an application-specific error page, copy the file into the following directory:
customizationDir/application_name/nav/templates
- Open the copied error.jsp file in an editor and make your changes.
For example, you might want to change the generic text in the message that says "Contact your administrator" to provide a more meaningful message for your organization, such as "Add a ticket in the Acme IT Support Database <link>" or .Copy the following error information and email it to lcadmin@mycompany.com." To do so, look for the following block of HTML:
<p id="lconnErrorDetails" style="display:none;" class="lconnErrorDetails"> <label for="lconnErrorText"> <fmt:message key="error.details.info" /> </label> <textarea id="lconnErrorText" readonly="readonly" class="lotusText" wrap="off"> </textarea> </p>Replace the <fmt:message> element with the text to have displayed in the message box. For example:<p id="lconnErrorDetails" style="display:none;" class="lconnErrorDetails"> <label for="lconnErrorText"> Copy the following error information and email it to <a href="mailto:lcadmin@mycompany.com">lcadmin@mycompany.com</a>. </label> <textarea id="lconnErrorText" readonly="readonly" class="lotusText" wrap="off"> </textarea> </p>
- Save and close the error.jsp file.
- To test your changes, refresh the web browser, and then perform an action that will generate an error message.
- Optional: If you enabled custom debugging, turn off the debugging capability when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for information about how to apply your changes permanently.
Customize the Get Started view
Help your users get started with your implementation of IBM Connections by customizing the Get Started view that is displayed in the Home page.
The Get Started view is only available from the Home page. If you do not install the Home Page application, then the Get Started view is not available in the product.
To edit configuration files, you must use the IBM WebSphere Application Server wsadmin client. See Start the wsadmin client for information about how to start the wsadmin command-line tool. The gettingstarted-config.xml file defines the content of the Get Started view in the Home page. By default, the view identifies the following steps in vertical tabs:
You can edit the content that is displayed in each tab and you can add or remove tabs.
- Welcome
- Share
- Explore
- Open a command window, and then start the wsadmin command line tool.
- Access the configuration files for the Home page application:
execfile("homepageAdmin.py")
- Check out the Get Started view configuration files :
HomepageCellConfig.checkOutGetstartedConfig("working_directory","cell_name")...where:
For example:
- working_directory is the temporary working directory to which the configuration XML and XSD files are copied and are stored while you make changes to them. Use forward slashes to separate directories in the file path, even if you are using the Microsoft Windows operating system.
AIX® and Linux only: The directory must grant write permissions or the command will not run successfully.
- cell_name is the name of the WebSphere Application Server cell hosting the IBM Connections application. This argument is case-sensitive, so type it with care. If you do not know the cell name, you can determine it by typing the following command in the wsadmin command processor:
print AdminControl.getCell()
- AIX/Linux:
HomepageCellConfig.checkOutGetstartedConfig("/opt/act/temp","foo01Cell01")
- Microsoft
Windows:
HomepageCellConfig.checkOutGetstartedConfig("c:/act/temp","foo01Cell01")
- From the temporary directory to which you checked out the gettingstarted-config.xml file, open it in a text editor.
- Make any of the following updates that you want:
- To remove one of the vertical tabs, find the <step> element that represents the tab and change the value of its enabled attribute from true to false.
- To add another tab to the list:
- Copy one of the existing <step> elements and paste it into the <steps> block. The order of the vertical tabs reflects the order of the steps in the <steps> element block, so copy it before and after the steps you want it to be displayed between on the page.
- Change the content of the copied <step> element:
- Change the tab title by adding your title text directly to the element in place of the jsp.start.step1.tab.title key or by specifying a key that you define in a corresponding resource bundle that you also define. For example, the title of the first tab is Welcome. It is defined by the jsp.start.step1.tab.title key that is stored in the com.ibm.lconn.homepage.resources.nls.jsp.jsp_resources resource bundle. It is specified in the title element for that step in the configuration file. The bundle attribute identifies where the resource bundle is stored and the title element itself contains the key value for the title string.
<title bundle="com.ibm.lconn.homepage.resources.nls.jsp.jsp_resources"> jsp.start.step1.tab.title </title>
- Define what should be displayed in the tab body using the <body-links> element. The <body-links> element must reference a web page that can be accessed over http and https. The page must be in the same domain as the Home page, for example an HTML page on the HTTP server of the IBM Connections deployment.
- To specify the page, provide its web address as the value of the secure and unsecure attributes. For example:
<step enabled="true"> ... <body-links secure="https://w3.example.com/peoplepages/myProfile.wss" unsecure="http://w3.example.com/peoplepages/myProfile.wss" /> </step>
- To change what is displayed in a tab, edit the title and content of the page. See the previous bullet for details.
- Save and close the gettingstarted-config.xml file.
- Run the following command to check the configuration files back in. You must check the files back in during the same wsadmin session in which you checked them out for the changes to take effect.
HomepageCellConfig.checkInGetstartedConfig("working_directory", "cell_name")...where the working_directory and cell_name parameters contain the same values you specified for the checkout location.
- Update the version stamp property to force a refresh of your users' web browsers, so that they will see the changes you made to the Get Started view the next time they access the product. See Required post-customization step.
Customize product strings
You can replace a word or phrase in the product user interface with terminology that better suits your environment.
Notes:
Many of the product strings in the IBM Connections user interface are represented by key-value pairs defined in the properties files stored in the application JAR files. Before you can redefine the value of a string, you must find out which key is used to represent it. After you have identified the key-value pair to customize, you can create a properties file that contains the key-value pairs corresponding to your custom strings, and copy it into the customizationDir/strings directory.
- You cannot use this method to customize the default notification messages in emails that are sent from IBM Connections applications. See Customize notifications for information about how to customize notifications.
- You cannot use the customization debugging capability to test edited strings.
- Find the key that is used to represent the value of the string to customize. For a list of the application properties files that contain strings you can customize, see Property file strings.
- Create a properties file in which to store the key-value pair for the custom string. Give the properties file the same name as the properties file that is used to store that key by the application. For example, if you copy the templates.properties file, and paste it into the customizationDir/strings directory, name it as follows:
com.ibm.lconn.core.strings.templates.propertiesYou must create the file with the full file name; that is, it must not be a series of directories containing the templates.properties file, such as, com/ibm/lconn/core/strings/templates.properties.
Also, specify a language code for the properties file in the file name. If you do not provide a _language_code value at the end of the properties file name, the value you specify for the key in the properties file is used despite the locale of the web browser accessing the application.
For example, if you change the key with the current value of "Help" to "Ayuda" and define it in a file named com.ibm.lconn.files.strings.ui.properties (without the _es suffix), then anyone who accesses the product will see Aydua in place of the Help string even if their browser locale is not set to es. In some cases, you might want the same value applied to all languages. If you want to change the term "IBM Connections" to a company name, for example, then you might store the customized key in a properties file without the _language_code suffix and the company name shows as-is to all browsers.
For a full list of the language codes supported by IBM Connections, see Language codes.
- Save the properties file that you created in the following directory:
customizationDir/strings...where customizationDir is the root directory for customization files. See Determining
...where to save your customizations for more details. Unlike some of the other areas of the product, the strings directory in the customization root does not have a subdirectory for each application. Each application uses unique properties file names so all of the strings that you replace can be stored in this common strings directory.
- Use the IBM WebSphere Application Server Integrated Solutions Console, stop and restart each application EAR file.
- Test your changes by clearing your browser cache, and then refreshing the browser.
- To force all user web browsers to refresh all cached content and display your changes, run the command that updates the product version stamp.
- Enter the following command to access the IBM Connections configuration file: execfile("connectionsConfig.py")
If prompted to specify a service to connect to, type 1 to pick the first node in the list. Most commands can run on any node. If the command writes or reads information to or from a file using a local file path, you must pick the node where the file is stored. This information is not used by the wsadmin client when you are making configuration changes.
- Enter the following command to check out the IBM Connections configuration files:
LCConfigService.checkOutConfig("working_directory","cell_name")
where:
For example:
- working_directory is the temporary working directory to which the configuration XML and XSD files are copied and are stored while you make changes to them. Use forward slashes to separate directories in the file path, even if you are using the Microsoft Windows operating system.
AIX and Linux only: The directory must grant write permissions or the command does not run successfully.
- cell_name is the name of the WebSphere Application Server cell hosting the IBM Connections application. This argument is case-sensitive, so type it with care. If you do not know the cell name, type the following command while in the wsadmin command processor:print AdminControl.getCell()
- AIX or Linux:LCConfigService.checkOutConfig("/opt/temp","foo01Cell01")
- Microsoft
Windows:LCConfigService.checkOutConfig("c:/temp","foo01Cell01")
- Enter the following command to increment the value of the versionStamp property: LCConfigService.updateConfig("versionStamp","gmt_timestamp") where gmt_timestamp is the GMT time. You can specify an empty string for the time stamp or provide a GMT value string. When you specify an empty string, the client calculates the current GMT time and updates the version stamp with that value. If you choose to provide the time, specify it using the following format: yyyyMMdd.HHmmss and specify the time in GMT. It is best to provide an empty string and let the client format the time stamp. For example: LCConfigService.updateConfig("versionStamp","").
- After making changes, you must check the configuration files back in and you must do so during the same wsadmin session in which you checked them out for the changes to take effect. See Applying common configuration property changes for information about how to save and apply your changes.
Property file strings
Use the information in the tables to locate the customizable strings contained in property files and to determine where to save the customized files.
The following tables list the application properties files containing strings that you can customize.Notes:
- To customize the source properties files, you must first extract the contents of the JAR file files using a compression program.
- In the paths listed here:
- installedApps refers to the following directory path:
WAS_HOME/profiles/profile_name/installedApps
where:
- WAS_HOME is the directory to which you installed IBM WebSphere® Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
For example: /opt/IBM/WebSphere/AppServer/profiles/AppSrv01/installedApps/standaloneCell01/
- webresources refers to the web resources provisioning directory for IBM Connections created during installation. By default, it is created in the following directory:
CONNECTIONS_HOME/data/shared/provision/webresourcesFor example: /opt/IBM/Connections/Data/shared/provision/webresources/
- customizationDir refers to the base customization directory where you need to save your customized files. This base directory is defined during the installation of IBM Connections, when it is saved as a WebSphere Application Server variable named CONNECTIONS_CUSTOMIZATION_PATH. This variable is set to shared_data_directory_root/customization by default.
For example: local/opt/IBM/Connections/Data/shared/provision/customization/
- _version refers to the file version and timestamp, for example, _3.0.0.20120307-0100 in the following file name:
com.ibm.lconn.activities.web.resources_3.0.0.20120307-0100.jar
- The customized files are saved in the customizationDir/strings/customized_properties_file_name directory,
...where any slashes in the source file name location are replaced by dots.
For example, when you customize the ui.properties source file for Blogs from the Blogs.ear/blogs.war/WEB-INF/classes/com/ibm/lconn/blogs/strings/ui.properties source location, you must save the customized properties file in the following location:
customizationDir/strings/com.ibm.lcon.blogs.strings.ui.properties.
- When you want to customize a locale-specific version of one of the source files listed, look in the same source directory for a file of the same name but with the relevant language code appended before the .properties file extension. When you save the customized version of the file, ensure that you append the language code to the file name before the file extension.
For example, to customize German strings for Blogs, look for the ui_de.properties file in the Blogs.ear/blogs.war/WEB-INF/classes/com/ibm/lconn/blogs/strings/ui.properties source location and save the customized strings in the following location:
customizationDir/strings/com.ibm.lcon.blogs.strings.ui_de.properties
- The following features do not have any properties files associated with them:
- Blog widget (Communities)
- ECM document picker (Communities)
- Ideation Blog widget (Communities)
For a list of the JavaScript files associated with these features, see JavaScript resource strings.
Common areas
Table 10. Common string locations
Description Source location Save customizations in Common widget strings In installedApps/application_name.ear/war/WEB-INF/
lib/lc.util.web-3.0.jar:
com.ibm.lconn.core.strings.templates.propertiescustomizationDir/strings/com.ibm.lconn.core.strings.templates.properties Core activity stream strings used in the Home page, Profiles, Communities, IBM Lotus Notes®, and other consumers of the activity stream gadget In installedApps/Common.ear/connections.web.resources
.war/WEB-NF/eclipse/plugins/com.ibm.social.as.web.
resources_version.jar:
properties/activitystream_resources.propertiescustomizationDir/strings/com.ibm.social.as.activitystream_resources.properties Core activity stream strings used in the Home page, Profiles, Communities, IBM Lotus Notes, and other consumers of the activity stream gadget In installedApps/Common.ear/connections.web.resources
.war/WEB-INF/eclipse/plugins/com.ibm.social.as.lconn.web.
resources_version.jar:
properties/activitystream_lconn.propertiescustomizationDir/strings/com.ibm.social.as.lconn.activitystream_lconn.properties Strings used by the Application Access and Access Request interfaces that prompt users to grant, deny, and revoke access to their IBM Connections data for third-party applications protected by OAuth In installedApps/Common.ear/connections.web.resources
.war/WEB-INF/eclipse/plugins/com.ibm.social.as.lconn.web.
resources_version.jar:
com.ibm.lconn.oauth.strings.ui.propertiescom.ibm.lconn.oauth.strings.ui.properties
Activities
Table 11. Activities
Description Source location Save customizations in Activities user interface strings Most user interface strings are in strings.js. This file is in the Activities resource jar located in the PROVISION folder sample: C:\IBM\Connections\Data\provision\webresources\
com.ibm.lconn.activities.web.resources_version.jarIf you cannot find the string here, check the Activities resource bundle in installedApps\Activities.ear\oawebui.war\WEB-INF\lib\oawebui.jar:
com\ibm\openactivities\web\coreui\resources\resources.propertiesSee Customize strings sourced in JavaScript for more information.
customizationDir/strings/com.ibm.openactivities.web.coreui.resources.
resources.propertiesActivities notification strings Notification strings and some user interface strings are in \LotusConnections-config\notifications\activities\resources\nls\notification_<locale>.properties where <locale> is the language code, for example notification _en.properties. If no locale is specified then use notification.properties. Edit and save the customized file in the source location.
Blogs
Table 12. Blogs
Description Source location Save customizations in User interface strings Blogs.ear/blogs.war/WEB-INF/classes/com/ibm/lconn/blogs/strings/ui.properties customizationDir/strings/com.ibm.lcon.blogs.strings.ui.properties Log strings Blogs.ear/blogs.war/WEB-INF/classes/com/ibm/lconn/blogs/strings/log.properties customizationDir/strings/com.ibm.lcon.blogs.strings.log.properties
Bookmarklet
The bookmarklet is the window that displays when you add a bookmark. It is located in the Common.ear file. The bookmarklet allows users to add bookmarks to different applications, such as Communities or Activities. Users can add a button to their browser that allows them to access the bookmarklet window. Every page in IBM Connections has a Bookmarking Tools link in the page footer that allows users to install this toolbar button.
Table 13. Bookmarklet
Description Source location Save customizations in Bookmarklet user interface strings (JSP files) In installedApps/common.ear/lc-bookmarklet.war/WEB-INF/lib/lc-
bookmarklet.jar:
com.ibm.lconn.bookmarklet.strings.ui.propertiescustomizationDir/strings/com.ibm.lconn.bookmarklet.strings.ui.properties Bookmarklet user interface strings (Java files) In installedApps/common.ear/lc-bookmarklet.war/WEB-INF/lib/lc-
bookmarklet.jar:
com.ibm.lconn.bookmarklet.resources.jspresources.propertiescustomizationDir/strings/com.ibm.lconn.bookmarklet.resources.jspresources.properties
Bookmarks
Table 14. Bookmarks
Description Source location Save customizations in Bookmarks user interface strings (JSP files) In installedApps/Dogear.ear/dogear.webui.war/WEB-INF/lib/dogear.svc.jar:
com/ibm/lconn/dogear/strings/uilabels.propertiescustomizationDir/strings/com.ibm.lconn.dogear.strings.uilabels.properties Bookmarks user interface strings (Java files) In installedApps/Dogear.ear/dogear.webui.war/WEB-INF/lib/dogear.svc.jar:
com/ibm/lconn/dogear/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.dogear.strings.ui.properties
Communities
Table 15. Communities
Description Source location Save customizations in Main Communities application user interface In installedApps/Communities.ear/comm.web.war/WEB-INF/lib/comm.web.jar:
com/ibm/lconn/communities/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.communities.strings.ui.properties Communities email text In installedApps/Communities.ear/comm.web.war/WEB-INF/lib/comm.web.jar:
com/ibm/lconn/communities/strings/uiemail.propertiescustomizationDir/strings/com.ibm.lconn.communities.strings.uiemail.properties Communities business card (used by the IBM Connections applications) In installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.web.resources_version.jar:
_properties/com/ibm/lconn/core/web/resources/commbizcard.propertiescustomizationDir/strings/com.ibm.lconn.core.web.resources.commbizcard.properties Communities widget titles installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.web.resources_version.jar:
_properties/com/ibm/lconn/widgets/resources/ui_resources.propertiescustomizationDir/strings/com.ibm.lconn.widgets.resources.ui_resources.properties Linked Library widget and Media Gallery widget In webresources/com.ibm.lconn.librarywidget.web.resources_
version.jar:
_properties/com/ibm/quickr/lw/nls/LibraryWidgetMessages.propertiescustomizationDir/strings/com.ibm.quickr.lw.nls.LibraryWidgetMessages.properties Related Communities widget In installedApps/Communities.ear/recomm.web.war/WEB-INF/classes/com/ibm/lconn/recomm/strings/ui.properties customizationDir/strings/com.ibm.lconn.recomm.strings.ui.properties
Files
Table 16. Files
Description Source location Save customizations in Main Files application user interface and the Files widget in Communities In webresources/com.ibm.lconn.files.web.resources
_version.jar:
_properties/com/ibm/lconn/files/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.files.strings.ui.properties Help pop-ups In webresources/com.ibm.lconn.files.web.resources
_version.jar:
_properties/com/ibm/lconn/files/strings/uihelp.propertiescustomizationDir/strings/com.ibm.lconn.files.strings.uihelp.properties About and Metrics pages In webresources/com.ibm.lconn.files.web.resources
_version.jar:
_properties/com/ibm/lconn/files/strings/uitemplates.propertiescustomizationDir/strings/com.ibm.lconn.files.strings.uitemplates.properties
Forums
Table 17. Forums
Description Source location Save customizations in User interface strings Forums.ear/forum.web.war/WEB-INF/lib/forum.web.jar/com/ibm/forum/web/resources/resources_en.properties customizationDir/strings/com.ibm.forum.web.resources.resources.properties Log strings Forums.ear/forum.web.war/WEB-INF/lib/forum.svc.jar/com/ibm/lconn/forum/internal/resources/resources.properties customizationDir/strings/com.ibm.lconn.forum.internal.resources.resources.properties Log strings Forums.ear/forum.web.war/WEB-INF/lib/forum.svc.jar/com/ibm/lconn/forum/internal/service/core/core.properties customizationDir/strings/com.ibm.lconn.forum.internal.service.core.core.properties
Home page
Table 18. Home page
Description Source location Save customizations in Most strings appearing in the user interface, except for the stories in the river of news In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
com/ibm/lconn/homepage/resources/nls/jsp/jsp_resources.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.nls.jsp.jsp_resources.properties Activity Stream strings In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
com/ibm/lconn/homepage/resources/nls/activitystream/activitystream_resources.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.nls.activitystream.
activitystream_resources.propertiesActivity Stream filters In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
com/ibm/lconn/homepage/resources/nls/activitystream/config/activitystreamconfig_resources.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.nls.activitystream.
config.activitystreamconfig_resources.propertiesNotification strings In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
com/ibm/lconn/homepage/resources/nls/ui/ui_resources.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.
nls.ui.ui_resources.propertiesStrings related to widgets, such as widget titles and the strings that are displayed in the customization palette In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
com/ibm/lconn/homepage/resources/nls/catalog/service/ui/CatalogServiceUIMessages.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.nls.catalog.service.
ui.CatalogServiceUIMessages.propertiesWidget resources In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/homepage.utils.jar:
/com/ibm/lconn/homepage/resources/nls/widgets/widgets_resources.propertiescustomizationDir/strings/com.ibm.lconn.homepage.resources.nls.widgets.
widgets_resources.propertiesCore activity stream filter resources In installedApps/Homepage.ear/homepage.war/WEB-INF/lib/lc.services.gadgets.osapiclient.jar:
com/ibm/lconn/services/gadgets/osapiclient/activitystream/config/activitystreamconfig.propertiescustomizationDir/strings/com.ibm.lconn.services.gadgets.osapiclient.
activitystream.config.activitystreamconfig.properties
Metrics
Table 19. Metrics
Description Source location Save customizations in Main Metrics application user interface, not including metrics reports provided by Cognos In webresources/com.ibm.lconn.metrics.web.resources
_version.jar:
_properties/com/ibm/connections/metrics/ui/strings/ui.propertiescustomizationDir/strings/com.ibm.connections.metrics.ui.strings.ui.properties About page In webresources/com.ibm.lconn.metrics.web.resources
_version.jar:
_properties/com/ibm/connections/metrics/ui/strings/uitemplates.propertiescustomizationDir/strings/com.ibm.connections.metrics.ui.strings.uitemplates
.properties
Moderation
Table 20. Moderation
Description Source location Save customizations in Main Moderation application In installedApps/moderation.ear/sn.moderation.ui.jar:
com.ibm.lconn.moderation.ui.strings.ui.propertiescustomizationDir/strings/com.ibm.lconn.moderation.ui.strings.ui.properties Online help In installedApps/moderation.ear/sn.moderation.ui.jar:
com.ibm.lconn.moderation.ui.strings.uihelp.propertiescustomizationDir/strings/com.ibm.lconn.moderation.ui.strings.uihelp.properties About page In installedApps/moderation.ear/sn.moderation.ui.jar:
com.ibm.lconn.moderation.ui.strings.uitemplates.propertiescustomizationDir/strings/com.ibm.lconn.moderation.ui.strings.uitemplates.properties
News
Table 21. News
Description Source location Save customizations in Template resource strings for use in activity stream event titles In installedApps/News.ear/news.common.jar:
com/ibm/lconn/news/nls/templatePlaceholders.propertiescustomizationDir/strings/com.ibm.lconn.news.nls.templatePlaceholders.properties JSP resources for email digest settings page In installedApps/News.ear/news.common.jar:
com/ibm/lconn/news/nls/jsp_resources.propertiescustomizationDir/strings/com.ibm.lconn.news.nls.jsp_resources.properties Notification strings displayed in the Home page In installedApps/News.ear/news.common.jar:
com/ibm/lconn/news/nls/ui_resources.propertiescustomizationDir/strings/com.ibm.lconn.news.nls.ui_resources.properties
Profiles
Table 22. Profiles
Description Source location Save customizations in Used in the Atom APIs for informational use only, not for the end user In installedApps/Profiles.ear/lc.profiles.app.war/WEB-INF/lib/lc.profiles.web.app.jar:
com/ibm/lconn/profiles/api/actions/resources.propertiescustomizationDir/strings/com.ibm.lconn.profiles.api.actions.
resources.propertiesMain resource string file for user interface display in Profiles In installedApps/Profiles.ear/lc.profiles.app.war/WEB-INF/lib/lc.profiles.web.app.jar:
com/ibm/lconn/profiles/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.profiles.strings.ui.properties Strings for profile field labels In installedApps/Profiles.ear/lc.profiles.app.war/WEB-INF/lib/lc.profiles.web.app.jar:
com/ibm/lconn/profiles/strings/uilabels.propertiescustomizationDir/strings/com.ibm.lconn.profiles.strings.uilabels.properties
Search
Table 23. Search
Description Source location Save customizations in Search application user interface strings In installedApps/Search.ear/search.common.jar:
com/ibm/lconn/search/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.search.strings.ui.properties
Social analytics
Table 24. Social analytics
Description Source location Save customizations in Strings for the Who Connects Us, Things in Common, and Do You Know widgets In installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.sand.web.resources_version.jar:
_properties/com/ibm/lconn/sand/resources/sand.propertiescustomizationDir/strings/com.ibm.lconn.sand.resources.sand.properties
Wikis
Table 25. Wikis
Description Source location Save customizations in Main Wikis application user interface In installedApps/Wikis.ear/wikis.web.jar:
com/ibm/lconn/wikis/strings/ui.propertiescustomizationDir/strings/com.ibm.lconn.wikis.strings.ui.properties Help tooltips In installedApps/Wikis.ear/wikis.web.jar:
com/ibm/lconn/wikis/strings/uihelp.propertiescustomizationDir/strings/com.ibm.lconn.wikis.strings.uihelp.properties About page and Server Metrics page In installedApps/Wikis.ear/wikis.web.jar:
com/ibm/lconn/wikis/strings/uitemplates.propertiescustomizationDir/strings/com.ibm.lconn.wikis.strings.uitemplates.properties These resource bundles contain the majority of the Wikis user interface strings, but the strings for the Communities Widget are provided in JavaScript. See Customize strings sourced in JavaScript for more information.
Customize strings sourced in JavaScript
Replace a word or string in the product user interface that is sourced in JavaScript as opposed to a strings resource bundle. Many strings in the IBM Connections user interface are represented by key and value pairs defined in JavaScript files that are stored in the application JAR files. You can customize these strings by locating the appropriate JavaScript source file, copying it into the corresponding subdirectory of the customization directory, and overwriting the key and value pair in the copied file with your custom text.
Notes:
- You cannot use the customization debugging capability to test edited strings.
- Follow the steps outlined here when you want to update the text in the JavaScript files in your deployment. When you want to change the functionality of the JavaScript code, follow the procedure covered in the topic, Overriding JavaScript in IBM Connections.
- To use the external resource bundle loader for adding and updating strings in the user interface, see Add custom strings for widgets and other specified scenarios.
- Locate the JavaScript source file for the application to customize, based on the information in the topic, JavaScript resource strings.
- Determine the base directory where your customizations should go. For more information, see Determining
...where to save your customizations.
- Copy and paste the file to customize into the appropriate subdirectory of the customization root directory. For information about where to place your customizations, see JavaScript resource strings.
For example, for Activities, save the customized JavaScript file in the following location:
customizationDir/javascript/lconn/act/nls/strings.jsFor locale-specific strings, create a folder in the customizationDir/javascript/lconn/act/nls directory, name it with the corresponding language code, and save the JavaScript file in the new folder. For example, to save German strings for Activities, save the customized JavaScript file in the following location:
customizationDir/javascript/lconn/act/nls/de/strings.jsFor a full list of the language codes supported by IBM Connections, see Language codes.
- Open the copied JavaScript file for editing. Find the key and value pair to overwrite, and replace the value with your custom text.
- Repeat the previous step until you have replaced all of the strings to change.
- Remove any key and value pairs that you did not edit. Those will be read from the version of the JavaScript file in the application's product directory.
- Save and close the JavaScript file.
- Use the WebSphere Application Server Integrated Solutions Console, restart the application associated with the file that you have changed.
- Test your changes by clearing your browser cache, and then refreshing the browser.
- See Required post-customization step for information about how to apply your changes permanently.
JavaScript resource strings
Use the information in the tables to help you find the customizable strings that are sourced in JavaScript files and to determine where to save the customized JavaScript files.
Notes:
- In the paths listed here:
- installedApps refers to the following directory path:
WAS_HOME/profiles/profile_name/installedApps
where:
- WAS_HOME is the directory to which you installed IBM WebSphere® Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
For example: /opt/IBM/WebSphere/AppServer/profiles/AppSrv01/installedApps/standaloneCell01/
- webresources refers to the web resources provisioning directory for IBM Connections that is created during installation. By default, it is created in the following directory:
CONNECTIONS_HOME/data/shared/provision/webresourcesFor example: /opt/IBM/Connections/Data/shared/provision/webresources
- customizationDir refers to the base customization directory where you need to save your customized files. This base directory is defined during the installation of IBM Connections, when it is saved as a WebSphere Application Server variable named CONNECTIONS_CUSTOMIZATION_PATH. This variable is set to shared_data_directory_root/customization by default.
For example: local/opt/IBM/Connections/Data/shared/provision/customization/
- version refers to the file version and timestamp, for example, _3.0.0.20120307-0100 in the following file name:
com.ibm.lconn.activities.web.resources_3.0.0.20120307-0100.jar
- language_code identifies the language-specific version of the strings to customize. For a list of the language codes supported by IBM Connections, see Language codes.
- The following applications do not have any associated JavaScript resource strings:
- Files
- Linked Library widget (Communities)
- Media Gallery
- Metrics
- Moderation
- News
- Profiles
Common
Table 26. Common JavaScript files
Description Source location Place customizations in Upload file dialog related strings installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.web.resources_version.jar/resources/upload/nls/upload.js customizationDir/javascript/lconn/core/upload/nls/upload.js
Activities
Table 27. Activities JavaScript files
Description Source location Place customizations in Activities application strings webresources/com.ibm.lconn.activities.web.resources_version.
jar/resources/nls/strings.jscustomizationDir/javascript/lconn/act/nls/strings.js
Blogs
Table 28. Blogs JavaScript files
Description Source location Place customizations in Blogs application strings webresources/com.ibm.lconn.blogs.web.resources_version.jar/resources/nls/strings.js customizationDir/javascript/lconn/blogs/nls/strings.js Blog widget (Communities) webresources/com.ibm.lconn.communityblogs.web.resources/resources/nls/strings.js customizationDir/javascript/lconn/communityblogs/nls/strings.js Ideation Blog widget (Communities) webresources/com.ibm.lconn.communityblogs.web.resources/resources/ideation/nls/strings.js customizationDir/javascript/lconn/communityblogs/ideation/nls/strings.js
Bookmarks
Table 29. Bookmarks JavaScript file
Description Source location Place customizations in Bookmarks application strings webresources/com.ibm.lconn.dogear.web.resources_version.jar/resources/nls/strings.js customizationDir/javascript/lconn/dogear/nls/strings.js
Bookmarklet
The bookmarklet is the window that displays when you add a bookmark. It is located in the Common.ear file. The bookmarklet allows users to add bookmarks to different applications, such as Communities or Activities. Users can add a button to their browser that allows them to access the bookmarklet window. Every page in IBM Connections has a Bookmarking Tools link in the page footer that allows users to install this toolbar button.
Table 30. Bookmarklet JavaScript file
Description Source location Place customizations in Bookmarklet application strings installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.bookmarklet.web.resources_version.jar/resources/nls/strings.js customizationDir/javascript/lconn/bookmarklet/nls/strings.js
Communities
Table 31. Communities JavaScript files
Description Source location Place customizations in Communities application strings webresources/com.ibm.lconn.communities.web.resources_
version.jar/resources/nls/strings.jscustomizationDir/javascript/lconn/comm/nls/strings_xx.js ECM document picker (used to configure the Linked Library to point to a specific library or folder) webresources/com.ibm.lconn.ecmpicker.web.resources_
version.jar/resources/nls/language_code/picker.jscustomizationDir/javascript/quickr/picker/nls/
language_code/picker.jsCalendar widget strings webresources/com.ibm.lconn.calendar.web.resources_version.jar/resources/CalendarData/nls/templateStrings.js customizationDir/javascript/lconn/calendar/CalendarData/nls/templateStrings.js Calendar widget strings (grid view) webresources/com.ibm.dwa.web.resources_version.jar/resources/cv/nls/calendarView.js customizationDir/javascript/dwa/cv/nls/calendarView.js Calendar widget strings (grid view) webresources/com.ibm.dwa.web.resources_version.jar/resources/date/nls/calendar.js customizationDir/javascript/dwa/date/nls/calendar.js Calendar widget strings (grid view) webresources/com.ibm.dwa.web.resources_version.jar/resources/date/nls/datepick.js customizationDir/javascript/dwa/date/nls/datepick.js Related Communities widget strings webresources/com.ibm.lconn.recomm.web.resources_version.jar/resources/nls/strings.js customizationDir/javascript/lconn/recomm/nls/strings.js
Forums
Table 32. Forums JavaScript files
Description Source location Place customizations in Forums application strings webresources/com.ibm.lconn.forums.web.resources_version.jar/resources/nls/strings.js customizationDir/javascript/lconn/forums/nls/strings.js Forums widget (Communities) installedApps/cellName/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.web.resources_version.jar/resources/nls/strings.js
where cellName is the name of the cell to which the Common.ear node belongs.customizationDir/javascript/lconn/core/nls/strings.js
Profiles
Table 33. Profiles JavaScript files
Description Source location Place customizations in Profiles business card installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.web.resources_version.jar customizationDir/javascript/lconn/communities/bizCard/nls/ui Profiles JavaScript-defined strings come from property files; all Dojo dijits used in Profiles are defined in core.ui (bizcard, invite) and their strings are stored in core.web.resources.
Search
In the source location, com.ibm.lconn.search.web.resources is the name of the JAR file beginning with com.ibm.lconn.sand.web.resources.
Table 34. Search JavaScript files
Description Source location Place customizations in Sorting control on the Search Results page installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.search.web.resources/resources/nls/Sorting.js customizationDir/javascript/lconn/search/nls/Sorting.js Strings used when rendering the data from the feed for the search results installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.search.web.resources/resources/nls/searchData.js customizationDir/javascript/lconn/search/nls/searchData.js Search Results page installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.search.web.resources/resources/nls/searchResults.js customizationDir/javascript/lconn/search/nls/searchResults.js Trending widget on the Search Results page installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.search.web.resources/resources/nls/trendData.js customizationDir/javascript/lconn/search/nls/trendData.js
Social analytics
In the source location, com.ibm.lconn.sand.web.resources is the name of the JAR file beginning with com.ibm.lconn.sand.web.resources.
Table 35. Social analytics JavaScript files
Description Source location Place customizations in Recommendations widgets (Communities and Home page) installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins/com.ibm.lconn.sand.web.resources/resources/nls/RecommendWidget.js customizationDir/javascript/lconn/sand/nls/RecommendWidget.js
Wikis
Table 36. Wikis JavaScript files
Description Source location Place customizations in Wiki widget (Communities) Wikis.ear/wikis.web.war/iwidgets/CommunityWidget/nls/en/WikiWidget.js customizationDir/javascript/wikis/iwidgets/CommunityWidget/nls/en/WikiWidget.js
Add custom strings for widgets and other specified scenarios
You can add custom strings or modify existing strings when performing certain IBM Connections tasks.
When adding custom strings, you must use the wsadmin client. See Start the wsadmin client for details.
IBM Connections provides a external resource bundle loader for adding and updating strings to Profiles, Communities, and the Home page. You can only use this process when performing the following tasks:
You can add custom strings for other tasks using the procedure outlined in Customize product strings. To add custom strings for the listed tasks, create a bundle containing the custom strings and save it in the customization_dir/strings directory that is created at installation time. You then register the file in LotusConnections-config.xml. For performance reasons, include all the resource strings in a single bundle.
- Add custom extension attributes to profiles
- Customize the Profiles business card
- Add custom widgets to Communities, Profiles, and the Home page
- Configure the vCard export application
- Renaming the tabs in the Home page
- Add custom themes to Communities
For a complete example, see Creating a simple profile data model and template customization.
- Create a properties file containing the strings that you want to add in the customization_dir/strings directory.
- To specify the name of the default properties file, use the following syntax:
resource_bundle_name.properties_file_name
- To specify custom strings in multiple languages, append an underscore followed by the appropriate language code to the resource bundle name using the following syntax:
resource_bundle_name_language_code.properties_file_nameFor example, if your string bundle is named com.example.resources, you might create a file in the strings directory that looks like the following:
customization_dir/strings/com.example.resources.properties
This file contains the strings used for the default locale. When there is no specific bundle for the user's locale, the labels in this default properties file are used.To include an English version of the strings, you might create the following file:
<customization_dir>/strings/com.example.resources_en.propertiesAnd to include a Slovakian version of the strings, you might include the following file:
customization_dir/strings/com.example.resources_sk.propertiesThe following sample string is contained in the properties file.
label.vcard.encoding.cp943c=Japanese Encoding
- Register the resource bundle in LotusConnections-config.xml:
- Open a command window and start the wsadmin command-line tool as described in the topic, Starting the wsadmin client.
- Enter the following command to access the IBM Connections configuration file:
execfile("<$WAS_HOME>/profiles/<DMGR>/config/bin_lc_admin/connectionsConfig.py")
- Enter the following command to check out the IBM Connections configuration file:
LCConfigService.checkOutConfig(working_directory, cell_name)
where:
For example:
- working_directory is the temporary working directory to which the configuration XML and XSD files are copied. The files are kept in this working directory while you make changes to them.
- cell_name is the name of the IBM WebSphere Application Server cell hosting the IBM Connections application. This argument is required. It is also case-sensitive, so type it with care.
LCConfigService.checkOutConfig("/temp", "foo01Cell01")
- From the temporary directory to which you just checked out the IBM Connections configuration files, open LotusConnections-config.xml in a text editor.
- Add the following line of code into the <resources> element block to register the resource bundle:
<widgetBundle prefix=bundle_prefix name=bundle_name />...where
The following sample code is used to register the com.example.resources bundle:
- bundle_prefix is a globally unique name that identifies the bundle. This is a string value. The bundle prefix is used to uniquely scope the keys in each bundle. The prefix must be unique across all registered widget bundles.
This bundle prefix maps to the bundle ID reference that you specify when you define a custom resource attribute or widget. For more information about defining custom resource attributes, see Enabling custom extension attributes for Profiles. For information about defining custom widgets, see Enabling custom widgets for Communities or Enabling custom widgets for Profiles.
- bundle_name is the Java package name. This parameter takes a string value. When you name the resource bundle, the elements in the bundle name must correspond to the file name of the properties file that you created in step 1.
For example, if the strings customization directory contains the files com.example.resources.properties, com.example.resources_en.properties, and com.example.resources_sk.properties, the name of the bundle is com.example.resources.
<resources> <!-- Example: The attribute 'prefix' must be globally unique as it identifies the bundle when used in IBM Connections. --> <widgetBundle prefix="example" name="com.example.resources"/> </resources>
- Save your changes to LotusConnections-config.xml.
- To check in the updated file, use the following command:
LCConfigService.checkInConfig()
- To exit the wsadmin client, type exit at the prompt.
What to do next
After completing this procedure, you can use the labels in other configuration settings or in your JavaScript code. For example, you can use the strings when customizing the business card in Profiles (to add labels for custom extension attributes) and adding widgets to Profiles, Communities, and the Home page (to provide widget titles and descriptions). You can also use the strings to rename the Updates, Widgets, and Administration tabs in the Home page.Note that when you specify external labels for attributes, editable attributes, or custom extension attributes, the labels are only applied to the user interface element that the configuration object represents. For example, if you apply a custom label to a business card <attribute> element, the label does not automatically apply to the same element in the advanced search page layout.
For information about how to apply the label configuration to each user interface element individually, see Specifying external labels for attributes.
Customize notification strings
Customize the strings that are used in the notifications that are sent to IBM Connections users by the system. You can customize the text used in the notification messages sent to your users to include information specific to your organization. All of the strings used in notification templates are contained in the following directory:
profile_root/config/cells/cell_name/LotusConnections-config/notifications
- Find the file that serves as the source of the notification string to edit. You can locate the strings used in notifications in one of the following directories:
- Strings that are shared across templates are contained in the following directory:
LotusConnections-config/notifications/resources/nls/notification_*.properties
- Strings that are specific to templates from a particular application, such as Activities or Files, are contained in the following directory:
LotusConnections-config/notifications/application_name/resources/nls/notification_*.properties
- Open the file and edit the string directly to make the required changes.
- Save your changes and close the file.
- To test out your customizations, restart the News application before sending new notifications.
Overriding and extending JavaScript in IBM Connections
IBM Connections supports a mechanism that allows you to override or extend the JavaScript that is used in the different applications.
You can override JavaScript files when you want to provide very targeted fixes. Extending allows you to package your JavaScript files and have them loaded with IBM Connections in such a way that they do not disrupt existing code or prevent you from applying interim fixes.
Overriding JavaScript in IBM Connections
You can override the JavaScript files used by IBM Connections when you want to completely change the behavior of a Dojo module and you need the change to take effect as soon as the module is loaded.
To override JavaScript files, you must set up an IBM Connections deployment with the customization directory configured. For information about locating the customization directory, see Customize the user interface. After you have located your customization directory, create the following subdirectory:
customizationDir/javascriptFiles placed in this directory will override the JavaScript that is loaded for the main IBM Connections applications. This directory is loaded first and takes precedence over the content that is deployed as part of each application. Changes to this directory take effect immediately except when the JavaScript is loaded and cached statically.
Files in the customization directory are not updated when interim fixes are installed. If you add an override file and deploy an interim fix that also affects the file, copy that new change into your override file to maintain your customization.
To override JavaScript files, complete the following steps.
- Identify the JavaScript file to override.
Most of the JavaScript used by IBM Connections is located inside one of the web resources JAR files inside the provisioning directory (typically CONNECTIONS_HOME/data/shared/provision/webresources), or inside the Common.ear file. Each JAR file corresponds to a base package in Dojo. For example, com.ibm.lconn.core.web.resources corresponds to the Dojo package lconn.core. Open the JAR file and locate the JavaScript file to override.
For example:
- Find com.ibm.lconn.core.web.resources_*.jar inside the deployed Common.ear file.
- Open the JAR file with a zip program.
- Extract the resources/SearchBar.js file to a location on your hard drive.
- Copy the source file to the customization directory or create an empty file in the correct location.
For IBM Connections to detect an override JavaScript file, the path of the file in the customization directory must match the name of the Dojo JavaScript module. The name of a module is determined by its path and vice versa. You can convert the name of a module to a path by replacing all the periods in the module name with slashes.
For example:
- Use a text editor, open the SearchBar.js file from the example in step 1.
- Look for a line similar to the following one at the start of the file:
dojo.provide("lconn.core.SearchBar");This line indicates that the name of the module is lconn.core.SearchBar.
- Copy SearchBar.js to the following directory:
customizationDir/javascript/lconn/core/Ensure that you use the correct case in case-sensitive file systems.
- Make the required changes to the file.
Changes saved to the file take effect immediately. IBM recommends that you never directly edit the files in your JavaScript customization directory on a production system. Instead, copy them in with an automated task. For example:
- Edit SearchBar.js to put an alert statement at the start of the file:
alert("This file has been customized.");
- Clear your browser's cache and refresh your IBM Connections web application.
The SearchBar.js file in the example is used by most of the applications, so when you refresh the page after clearing your browser cache, the alert added in the previous step should immediately pop up.
What to do next
To remove a JavaScript customization, delete the file from the customization directory and refresh your browser cache. Most applications have a very short cache (20 seconds) before they check again for new JavaScript customizations. For regular users who are not clearing their browser cache, your changes are only guaranteed to be active after you update the version stamp in LCC.xml and restart each affected application, including Common.ear. For more information, see Required post-customization step.
Extend JavaScript in IBM Connections
You can extend the JavaScript files used by IBM Connections when you want to add new functionality, widgets, or scripts to the product.
IBM Connections uses the shared resources WAR file, connections.web.resources.war, to aggregate and serve all JavaScript files. This WAR file is based on the OSGi extension model, which allows new capabilities to be added to a system via a plug-in mechanism. IBM Connections leverages this mechanism to provide the following capabilities:
- Expose custom JavaScript in a new Dojo module package
- Ensure that custom JavaScript loads when another module is loaded
To extend the JavaScript used in IBM Connections, first you must put your JavaScript files into an OSGi bundle (a JAR file with a special MANIFEST.MF file and some directories), and deploy the bundle into IBM Connections. Then, you need to link your JavaScript to ensure that it is loaded at the same time as the rest of the JavaScript in IBM Connections.
The easiest way to extend the JavaScript used in IBM Connections is to start with a sample bundle, add files to it, and deploy it in your IBM Connections environment.
If you want to change a file in the JAR file, stop the Common.ear file, update the JAR file, and then restart the EAR file. You can also unzip the JAR file into a new directory with the same name as the JAR file minus the .jar extension and make changes there, but you might have to restart the EAR file to see new versions of files appear.
Complete the following steps to extend the JavaScript used in IBM Connections using a sample bundle.
- Download the following sample bundle:
com.mycompany.example_1.0.0.jar
- Deploy the sample bundle.
- Locate your web resources provisioning directory for IBM Connections. The installer creates this directory at the following location:
CONNECTIONS_HOME/data/shared/provision/webresourcesThis directory contains many different JAR files, including at least one for each application, and utility bundles.
- Copy the sample bundle into the webresources directory.
- Restart the Common.ear file.
- Enter the following URL in your web browser:
http://server/connections/resources/web/com.mycompany.example/readme.txtYou should see the readme.txt file from the JAR in the resources/ folder display in the browser window.
- Add files to the sample bundle.
You can update the JAR file by adding new files. Put the files in the resources/ directory and view the contents by entering the following URL in your web browser:
http://server/connections/resources/web/com.mycompany.example/
- Stop Common.ear.
- Add your new JavaScript, HTML, image, or CSS files into the JAR file in the resources/ directory.
- Restart Common.ear.
- Clear your browser cache and access the new file directly by viewing it on your server.
For example:http://server/connections/resources/web/com.mycompany.example/newfile
- Ensure that the JavaScript is loaded when an IBM Connections module is loaded by updating the plugin.xml file to add a new <dojoModuleBinding> element. Set the "to" attribute in the binding to the name of the class to load your custom files after.
Most customizations need to be loaded at a certain time, along with other IBM Connections JavaScript. To ensure that your module is loaded, you must update plugin.xml to add a new <dojoModuleBinding> element.
In the example, "com.mycompany.example.demonstration" (demonstration.js) is bound to a file that all IBM Connections applications load, bundle_common.js. Whenever any application loads bundle_common.js, demonstration.js will also be loaded. The demonstration module prints a line to the Firebug console, which you can see in IBM Connections.
- Restart Common.ear to pick up the changes in the plugin.xml file.
- Change the name of the bundle.
- In the META-INF/MANIFEST.MF file, change Bundle-SymbolicName and, optionally, Bundle-Name.
Do not remove the ;singleton:=true text at the end of the line. This text is necessary for the plugin.xml file to get parsed and your JavaScript to be loaded.
- Change each Dojo JavaScript module in the resources/ folder to have a different base package. Alternatively, you can change the <alias> in plugin.xml to define an arbitrary base package.
When IBM Connections tries to look up your modules, it will first look for the base package (the name of the bundle, or the <alias value="" /> defined in plugin.xml) and then look inside the resources/ folder. However, the dojo.provide(...) statement inside each JavaScript file must match the expected name or IBM Connections cannot load your JavaScript.
- Change the name of the JAR file to new-name_version.jar.
When you rename the JAR file, ensure that the version that is described by Bundle-Version in MANIFEST.MF matches the version at the end of the JAR name. If they do not match, IBM Connections will not be able to load your JAR file.
- Remove the old JAR file from the webresources directory, and copy your new JAR file into the directory.
Optional: You can also reference custom bundles that are saved to another location outside your customization directory by using a customresources.link file that is saved in your webresources directory. The customresources.link is a text file that specifies a list of additional directories to search. You can specify as many directories as you like in the file, for example:
/local/opt/myCustomBundles C:\customBundles
- Restart Common.ear.
- Check your changes by accessing the following URL from your browser. You should see the same file that is in the JAR file.
http://server/connections/resources/web/new name/readme.txt
Extend JSP files with custom tags
You can extend IBM Connections by adding your own custom JSTL tags to meet your company's needs.
- Optional: Turn on the customization debugging capability. For more information, see Enabling and disabling customization debugging.
- Copy the .jsp file from the WAR file of one of the applications that you would like to customize. You can access the file from the following directory:
WAS_HOME/profiles/profile_name/installedApps/cell_name/ application_name.ear/application_name.war/nav/templateswhere:
For a list of the web application source directories that are packaged with IBM Connections, see Application WAR files and OSGi bundles.
- WAS_HOME is the directory to which you installed IBM WebSphere Application Server.
- profile_name is the profile to which you installed one of the IBM Connections applications.
- cell_name is the cell to which you installed the application.
- application_name.ear is the EAR file name for the application.
- application_name.war is the WAR file name for the application.
- Paste the .jsp file into the appropriate subdirectory in the customization directory.
See Determining
...where to save your customizations for more information about locating your base customization directory.
- Copy the content of the .tag file containing the custom tags to add, then open the .jsp file and paste the content where it needs to be rendered.
- Save and close the .jsp file.
- To test your changes, refresh the web browser, and then access the page from the product.
- Optional: If you enabled custom debugging, turn off the debugging capability when you are ready to publish your changes. For more information, see Enabling and disabling customization debugging.
- See Required post-customization step for information about how to apply your changes permanently.
Customize notifications
The content of the notifications sent by IBM Connections is defined in templates that are processed by the FreeMarker engine.
You can customize notifications by modifying the existing template files or by replacing the files with custom templates that you create yourself. You can also edit the text strings and images used in the notifications.
Customize standard notifications
You can customize the standard email messages that are sent by the applications in IBM Connections, including the auto-generated notifications that are generated by the News application. The content of individual notifications is defined in templates that are processed by the FreeMarker engine. You can customize the content of notifications by modifying the existing template files or by replacing the files with custom templates that you create yourself. You can also modify the notification properties files to add custom strings to the templates and modify the images used in the notifications.
Customize the content of an email message by completing the following steps.
- To customize an existing template file:
- Locate the FreeMarker template that corresponds to the notification to customize. For more information about the notification types used in IBM Connections, see Configuring notifications.
Notifications are stored in the following location:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/...where app_server_root is the WebSphere Application Server installation directory and dm_profile_root is the Deployment Manager profile directory, typically dmgr01.
You can find folders for each application in this location and a shared resources folder. Look for the FreeMarker template for the notification to customize in the relevant application folder. When you find the template to modify, open the .ftl file in a text editor.
- Make your customizations to the template as needed. For information about editing the templates, refer to the FreeMarker documentation on the following web page: http://freemarker.sourceforge.net/docs/index.html
The FreeMarker version currently used is 2.3.15.
- Save your changes and then close the file.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
- To edit the text strings used in the notification:
- Use a text editor, open the notification_language_code.properties files in one of the following directories and make your changes:
- Application-specific strings:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/application_name/resources/nls
- Shared strings:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/resources/nlsWhere language_code is the locale of the language. For example, notification_fr.properties.
Tip: To see where each string that you are editing is used, look at the .ftl template files in the same directory and check the statements with the following format:u.resource("key")...where key is the key of a translated string in the resource bundle notification_language_code.properties files. Note that the notification framework will look in the application-specific resources folder before moving to the shared strings in the shared resources folder.
- Save your changes and then close the files.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
- To customize the images used in the notification:
- Locate the images in one of the following directories:
Note that the application-specific images are loaded before images in the shared location. If an image is loaded from the application-specific folder, the shared location is not checked for that image.
- Application-specific images:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/application_name/resources/images
- Shared images:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/news/notifications/resources/images
- Replace any image to customize with your own version using the same file name. The images are sent as MIME attachments to each email digest, so ensure that the image size is small.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
Customize email digests
You can customize the email message that is sent to users as part of the daily and weekly email digests. The content of the daily and weekly email digests is defined in templates that are processed by the FreeMarker engine. These templates are used for each recipient of the daily or weekly email digest. You can customize the content of the email digests by modifying the existing template files or by replacing the files with custom templates that you create yourself. You can also modify the notification properties files to add custom strings to the email digests and modify the images used in email digests.
The property named emailDigestBean is passed to the daily and weekly email digest templates. This property stores information about the digest related to email digest recipient. It is an instance of the class IEmailDigestStoriesContainer. For more information about the IEmailDigestStoriesContainer class, refer to the following web page:
http://www-10.lotus.com/ldd/lcwiki.nsf/dx/IBM_Connections_3.0.1_Email_Digest
Customize the content of the email message used for the daily and weekly email digests by completing one or more of the following steps.
- To customize the existing template files:
- Use a text editor, open the dailyDigest.ftl and weeklyDigest.ftl template files from the following location:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/news...where app_server_root is the WebSphere Application Server installation directory and dm_profile_root is the Deployment Manager profile directory, typically dmgr01.
- Make your customizations to the templates as needed. For information about editing the templates, refer to the FreeMarker documentation on the following web page:
http://freemarker.sourceforge.net/docs/index.htmlThe Freemarker version currently used is 2.3.15. The main templates used are dailyDigest.ftl and weeklyDigest.ftl. To change the styles and structure of both weekly and daily digests, make your customizations to the style.ftl file in the aggregated folder.The aggregated folder is shared by the daily and weekly digest and is specific to them. The folder is located in notifications/news/aggregated.
- Save your changes and then close the files.
- Synchronize all the nodes using the IBM WebSphere Application Server Integrated Solutions Console.
- Stop and restart the News application.
- To use your own custom templates instead of the default templates:
- Create the templates by following the instructions provided in the FreeMarker documentation on this web page:
http://freemarker.sourceforge.net/docs/index.htmlThe Freemarker version currently used is 2.3.15.
- Save the templates in the following directory:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/news
- Register the custom templates in the notification-config.xml file.
- Open a command prompt, and then change to the following directory on the system on which you installed the Deployment Manager:
app_server_root/profiles/dm_profile_root/bin...where app_server_root is the WebSphere Application Server installation directory and dm_profile_root is the Deployment Manager profile directory, typically dmgr01. For example, on
Windows:
C:/Program Files/IBM/WebSphere/AppServer/profiles/Dmgr01/binYou must run the following command to start the wsadmin client from this specific directory because the Jython files for the product are stored here. If you try to start the client from a different directory, then the execfile() command that you subsequently call to initialize the administration environment for an IBM Connections component does not work correctly.
- Enter the following command to start the wsadmin client:
- AIX or Linux:
./wsadmin.sh -lang jython -user admin_user_id -password admin_password -port SOAP_CONNECTOR_ADDRESS Port
- Microsoft
Windows:
wsadmin -lang jython -user admin_user_id -password admin_password -port SOAP_CONNECTOR_ADDRESS Portwhere:
- admin_user_id is the user name of a person in the Administrator role on the IBM WebSphere Application Server.
- admin_password is the password of the WebSphere Application Server administrator.
- SOAP_CONNECTOR_ADDRESS Port is the SOAP port for the WebSphere Application Server. The default value of the SOAP port is 8879. If you are using the default port value, you do not need to specify this parameter. If you are not using the default and you do not know the port number, you can look up its value in the WebSphere Application Server Integrated Solution Console. To look up the SOAP port number, perform the following steps:
- Open the WebSphere Application Server Integrated Solution Console for the deployment manager, and then select System Administration > Deployment Manager.
- In the Additional properties section expand Ports, and then look for the SOAP_CONNECTOR_ADDRESS port entry to find the port number.
For example:
- AIX or Linux:
./wsadmin.sh -lang jython -username primaryAdmin -password p@assword -port 8879
- Microsoft
Windows:
wsadmin -lang jython -username primaryAdmin -password p@assword -port 8879
- Access the IBM Connections configuration files:
execfile("connectionsConfig.py")
- Check out the notification-config.xml file :
LCConfigService.checkOutNotificationConfig("temp_dir","cell_name")...where:
- temp_dir is the temporary directory to which the configuration XML and XSD files are copied and are stored while you make changes to them. Use forward slashes to separate directories in the file path, even if you are using the Microsoft Windows operating system.
AIX and Linux only: The temporary directory must grant write permissions or the command will not run successfully.
- cell_name is the WebSphere Application Server cell to which you installed the application for which you are enabling mail. This argument is case-sensitive, so type it with care.
- Use a text editor, open the notification-config.xml file from the temporary directory to which you checked it out.
- Look for the following section of code and replace the value of the ftl property for each digest type with the file name of your new templates:
<type name="dailyDigest" notificationType="FOLLOW"> <channel name="email" enabled="true"> <property name="sender">news_admin@emea.relay.example.com</property> <property name="ftl">dailyDigest.ftl</property> </channel> </type> <type name="weeklyDigest" notificationType="FOLLOW"> <channel enabled="true" name="email"> <property name="sender">news-admin@emea.relay.example.com</property> <property name="ftl">weeklyDigest.ftl</property> </channel> </type>
- Save your changes and close the notification-config.xml file.
- Check the configuration files back in :
LCConfigService.checkInNotificationConfig("temp_dir","cell_name")
- To exit the wsadmin client, type exit at the prompt.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart all the IBM Connections application servers.
- To edit the text strings used in the email digest:
- Use a text editor, open the notification_language_code.properties files from one of the following directories and make your changes:
Where language_code is the locale of the language. For example, notification_fr.properties.
- News strings:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/news/resources/nls
- Shared strings:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/resources/nlsTip: To see where each string that you are editing is used, look at the .ftl template files in the same directory and check the statements with the following format:u.resource("key")...where key is the key of a translated string in the resource bundle notification_language_code.properties files. Note that the notification framework will look in the application-specific resources folder before moving to the shared strings in the shared resources folder.
- Save your changes and then close the files.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
- To customize the images used in the email digest:
Email digests include an IBM Connections logo image and individual application icons.
- Locate the images in the following directory:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/resources/images
- Replace any image to customize with your own version using the same file name. The images are sent as MIME attachments to each email digest, so ensure that the image size is small.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
Customize shared resources for notifications
You can customize the common style and structure documents that are used by notifications in IBM Connections. The notifications used in IBM Connections share common style and structure documents, and are stored in the same location, allowing you to write your customizations once for all notifications, except for email digests. For information about customizing the daily and weekly email digests that are sent to users, see Customize email digests.
You can customize notifications in IBM Connections by updating the shared resources stored at this location:
app_server_root/profiles/dm_profile_root/config/cells/cell-name/LotusConnections-config/notifications/resources
Table 37. Shared resources for notifications
Resource Description images Folder containing all the shared images referenced in templates. nls Folder containing all localized strings shared between templates. commonEEStructure.ftl Template used for generating the Embedded Application MIME part. commonHeader.ftl Used in templates to import common .ftl files into scope. Uses acquisition look-up. commonStructure.ftl Holds the main FreeMarker macros and functions that make up the individual notification components. For example, action, metadata, header, and footer. commonStyle.ftl One CSS style file used in all individual notification templates. commonUrlUtil.ftl Specific utility functions for URL link handling. Contains the linkify function. commonUtil.ftl Provides a common set of utility functions. Note on Freemarker acquisition: The template files that exist in the resources folder can also be stored in the notifications folders for specific applications. For example, if you want to customize Activities templates, you place commonStyle.ftl at the following location:
app_server_root/profiles/dm_profile_root/config/cells/cell-name/LotusConnections-config/notifications/activities/resourcesSaving the style file in this location allows the Activities templates to pick up different styles that override the default shared ones. Acquisition look-up ensures that templates are imported to a directory that is local to the currently generated template. If the templates do not exist, the parent folders are scanned and the templates from the shared resources folder are loaded. Similarly, the images and nls resources can be stored in a directory that is local to an application folder. The notification framework ensures that local resources are checked and used first before checking the shared resources location.
To customize the content of a shared resource, complete one or more of the following steps.
- To customize the existing template files:
- Make your customizations to the templates as needed. For information about editing the templates, refer to the FreeMarker documentation on the following web page:
http://freemarker.sourceforge.net/docs/index.html
The FreeMarker version currently used is 2.3.15.
- Save your changes and then close the files.
- Synchronize all the nodes using the IBM WebSphere Application Server Integrated Solutions Console.
- Synchronize all the nodes using the Integrated Solutions Console.
- To edit the text strings used in the notifications:
- Use a text editor, open the notification_language_code.properties files in the following directory and make your changes:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/notifications/resources/nls...where language_code is the locale of the language. For example, notification_fr.properties.
Tip: To see where each string that you are editing is used, look at the .ftl template files in the same directory and check the statements with the following format:u.resource("key")...where key is the key of a translated string in the resource bundle notification_language_code.properties files. Note that the notification framework will look in the local application resource folder before moving to the shared strings in the shared resources folder.
- Save your changes and then close the files.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
- To customize the images used in notifications:
- Locate the images in the following directory:
app_server_root/profiles/dm_profile_root/config/cells/cell_name/LotusConnections-config/resources/images
- Replace any image to customize with your own version using the same file name. The images are sent as MIME attachments to each email digest, so ensure that the image size is small.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
- To customize notifications for a specific application:
- Move the resource to customize from the location app_server_root/profiles/dm_profile_root/config/cells/cell-name/LotusConnections-config/notifications/resources to the resources folder contained in the application-specific notifications folder. For example, notifications/activities/resources.
- Save your changes and then close the files.
- Synchronize all the nodes using the Integrated Solutions Console.
- Stop and restart the News application.
Customize a blog theme
Customize a blog theme to change the look of a blog. Or create a new theme and make it available to your blog users.
The theme for a blog controls the look and the layout of the blog. You can customize the theme for a blog to change the look of it by editing the templates files that make up the theme. For example, you might add a corporate logo or change the background color for a theme. You should be comfortable editing HTML files and cascading style sheets (CSS files) to modify a blog theme. Also note the following:
- To make a site-wide change, edit the Blogs Homepage theme.
- You can extend a theme so it can use a different color scheme or different content but use the same templates.
- You can create a new theme based on an existing theme and add it to the list of available themes that your users can choose.
CAUTION:The ability for blog owners to customize their blog themes is disabled by default. Although the setting to enable this application is on the Configurations page on the Administration tab, we strongly recommend you do not enable it, because end-user theme customization is not a supported application. End-user customized theme migration will be the customer's responsibility for future releases. The setting is provided for backward compatibility with the IBM Connections 1.x releases. If your end users customized themes in an earlier release, enable this application so they can retrieve their customized themes.If you customized blog themes in a previous release of IBM Connections, there is no migration path provided for importing your changes into IBM Connections 4. Before upgrading to IBM Connections 4, ensure that you review and make a note of your existing customizations to blog themes so you can verify them post-migration and rework if necessary.
The following topics describe how to access and modify the templates for a theme and how to make a new theme available for use.
Standard Blogs theme components
A Blogs theme is made up of a collection of templates, graphics, and macros that you can modify. This topics describes some of the basic theme components.
Theme templates
Although the templates that make up a theme can vary, each theme contains some required templates (you cannot change the template name or delete the template from the theme) and some standard templates. Your theme may contain some or all of the following:
Table 38. Common theme template files
Template Description weblog A required template that defines the main page of your blog. The weblog template specifies blog components such as a links to entries, feed links, a calendar, and paging controls, _day A required template that defines how each day's worth of blog entries is displayed on the main page of your blog. _css The cascading style sheet (CSS) used by the blog. The CSS controls the fonts and spacing that structure the blog pages. _header Controls variables such as text and background color, and image placement. _footer Controls items that display in the footer of a blog, such as links to other web pages. _options Used to enable applications such as the inclusion of Bookmarks. This template should not be edited. _myfavorites defines the look of the My Recommendations page. allblogs Look of the Blogs Listing view. mynotificationreceived Look of the Notifications Received list on the My Updates page. mynotificationsent Look of the Notifications Sent list on the My Updates page. myupdates Look of the My updates page.
Theme macros
Some theme content, for example the comment form and paging controls, is not customizable via the theme templates. This content is specified in a site-wide macro file: WAS HOME/profiles/profile_name/installedApps/Cell Name/Blogs.ear/blogs.war/WEB-INF/velocity/weblog.vm. You can customize these macros, but be aware that changes made to the macros affect all Blogs themes.
Theme graphics
Most image files are found in the common, core images directory: <WAS_home>/profiles/<profile_name>/installedApps/<cell_name>/Blogs.ear/blogs.war/nav/common/styles/images.
Connections Blogs include an images directory as well: WAS HOME/profiles/<profile_name>/installedApps/<Cell Name>/Blogs.ear/blogs.war/roller-ui/images. Changes to these images will affect all Blog and Homepage themes, although additional images can be added and referenced without affecting other themes.
Change the theme used in a blog
A theme controls the layout and color-scheme of your blog. When you create a new blog, you choose from one of the built-in themes.
You must be a blog owner or administrator to edit the blog theme.
This application is disabled by default for blog users. To enable it for blog owners, site administrators must enable it on the Administration Configuration page. It's recommended that site administrators handle theme customization. Change the theme to update the look of your blog.
- From the My Blogs page, click Sets for the blog you want to customize.
- Click Theme.
- Select a different theme for the blog. A preview window shows you what your blog will look like with the new theme.
- Click Save to apply the new theme.
- Optional: Select Customize to alter the theme for the selected blog.
Customize a theme requires that you edit HTML template files. Do not customize unless you are comfortable working with HTML. When you click the Customize button the templates that define your current theme will be copied into your blog where you can edit them from the Templates page. Also note that you can only customize one theme at a time. Clicking Customize overwrites any previous customization.
Customize a blog template
A blog theme is made from a collection of templates that control the look of the blog. You can customize theme templates and save a new theme for a blog.
You must be a blog owner or administrator to edit blog templates.
Blog-level customization is turned off by default. If you enable this feature and allow users to customize their blog templates, the end user is then responsible for updating the templates following a migration. Some customized templates may not work after migration. You can edit the templates that define the layout, colors and fonts of your blog. Before you can edit the templates for the theme, choose to customize the theme. Customize theme templates involves editing the source HTML for the template files. You should only do this if you are comfortable editing HTML files.
Restriction: Only modification to the HTML is supported. Do not change any calls that retrieve data from the blog system or your blog may fail to work.
- From the My Blogs page, click Sets for the blog you want to customize.
If you are the Blogs site administrator and want to edit the theme for the Blogs home page, find the blog which serves as Blogs Homepage on the Site Sets section, on the Configuration page of the Administration tab. You can customize the theme for the home page in the same way you customize the theme for any blog.
- Click Theme.
- Choose the theme you want to customize and click Customize. The templates for that theme are now available for you to edit from the Templates page. Note that the Customize button is only available if the Allow custom themes setting is enabled for the site.
- Click Templates. The templates for the current blog display.
- Click Edit to modify a template. See the examples for guidelines about how to make common customization changes.
- Save changes you make to the template.
- Click Remove to remove a template. You cannot delete a required template.
Example: Add a logo to a blog theme
Customize a theme by adding a logo to the design.
You must be a blog owner or administrator to customize the theme for the blog and the setting to customize a theme must be enabled for the site. These steps illustrate how to add a logo, or any image, to a blog theme.
- From the My Blogs tab, click Sets for the blog to add a logo to.
- Click Theme.
- Choose the theme you want to customize and click the Customize button. The templates for that theme are now available for you to edit from the Templates page. Note that if custom themes are not enabled for the site, the Customize button will not display.
- Click Templates. The templates for the current blog display.
- Click the Edit icon next to the weblog template to open the template file for editing.
- Locate the string <!-- content --> using the browser Find option and add your <img> tag after the line that begins with <a id="mainContent" name="mainContent"></a>. For example:
[ <!-- content --> <!--<td valign="top">--> <a id="mainContent" name="mainContent"></a> <img src="http://www.mycompany.com/logo.gif"/> <div id="content"> ]
- Save changes you make to the template. When you open your blog, you will see the logo displayed with the blog title.
Extend a theme
You can extend an existing theme to use a different color scheme or to display different content.
Templates can be reused in multiple themes and still maintain a different color scheme or content by using the _options.vm file. The _options.vm file stores variables that can be used in the other templates in order to include or ignore content or file imports. Include the _options.vm file in the weblog.vm template in order to set values in the _header.vm template.
Example
The Khaki_Standard theme reuses the blog theme templates, but contains an _options.vm file with one line: #set ($lookAndFeel = "khaki")
The _header.vm checks for the $lookAndFeel variable, and includes the appropriate .css file:
#if ($lookAndFeel) <link rel="stylesheet" type="text/css" href="$url.site/roller-ui/styles/${lookAndFeel}.css" /> #endThe result is two themes, with two different color schemes, based on the same set of templates.
Making a custom theme available to your users
You can create custom themes and make them available to your blog users. Customize themes requires experience editing HTML and CSS files. Follow these steps to make a custom theme available to your users from the Blogs theme field on the Create Blog form.
To define a theme.
- Create a copy of the existing default theme.
For example, to create a new corporate theme: Copy the blog theme directory from WAS HOME/profiles/AppSrv Name/installedApps/Cell Name/Blogs.ear/blogs.war/themes/blog/ to the following directory: customization_dir/blogs/themes/corporateBlogTheme/
The customization_dir folder is the default directory in which customized files are stored. This location is defined during installation, and is saved as a WebSphere Application Server variable named CONNECTIONS_CUSTOMIZATION_PATH. By default, the variable is set to Connections_installdir\data\shared\customization.
- Modify or add template files to create the desired look, layout, and content for your theme.
- Create an image to display as a preview thumbnail so that users can see what the theme looks like from the Create Blog form. The naming convention is sm-theme-blog_directory_name.png. For example, the preview image for the default blog theme is named sm-theme-blog.png.
- Edit the Blogs string resource file com.ibm.lconn.blogs.strings.ui_xx.properties and add a new string for the name of your new theme, as follows:
- Add the com.ibm.lconn.blogs.strings.ui_xx.properties file to customization_dir/strings.
- Locate the #themes section of the file and enter the theme directory name in the format ventura.theme.yourThemeDirectoryName. For example, ventura.theme.MyTheme=My Theme.
Add the new theme directory name to the ui.properties file makes the new theme work in English. For international support, edit the ui_language.properties file,
...where language is the ISO country code associated with the language in which you want to specify the custom label. For example, to support Chinese, you should also edit the ui_zh.properties file.
- Copy the default style sheet, defaulttheme.css from its location in WAS HOME/profiles/AppSrv Name/installedApps/Cell Name/Blogs.ear\blogs.war\roller-ui\styles. Make any changes you want to the theme, then save it to the same directory with the name of your new theme: <myNewThemeName>.css.
Delete a Blogs theme
Delete a Blogs theme if you do not want it to be available to your users.
You can delete either a default theme or a custom theme.
- To remove a default theme, delete the theme from the folder containing the default themes: WAS HOME/profiles/AppSrv Name/installedApps/Cell Name/Blogs.ear/blogs.war/themes.
- To remove a custom theme, delete the theme from the folder containing the custom themes: customization_dir/blogs/themes/.
If you delete a theme that is use, users will get a Page Note Found error when they try to access the blog. The blog owner can correct this by selecting a new theme for the blog.
Add a custom theme to Communities
Community owners can customize the appearance of a community by choosing from a selection of themes that change the colors used in the community. Administrators can modify or add to the selection of default themes provided with Communities by customizing the existing themes, or by defining custom themes and adding them to the Communities configuration file, communities-config.xml.
If you are performing other customizations that apply to all the applications in IBM Connections, for example, if you are customizing the header and footer used in the product, you might need to alter or customize the themes available in Communities to ensure that they work as expected in your environment. Consider adding themes that match the customizations that you have made in other areas, for example, themes that match your customized header and footer.
To configure community themes to work with your corporate branding and best meet the needs of your organization, consider the following options:
- No themes defined. If you remove all the community themes defined in the communities-config.xml file, your corporate branding is applied throughout the IBM Connections applications, and community owners are no longer given the option of choosing a theme when creating or editing a community.
- Multiple themes defined. If multiple themes are defined in the communities-config.xml file, community owners can apply one of these themes when creating or editing a community. That theme then takes precedence for that community over any global customizations or branding that have been applied to all the applications.
- One theme defined. If the communities-config.xml file contains a single theme, any corporate customizations are applied to pages that are not community-specific, for example, the Public Communities page, and that single theme is applied to all community-specific pages. Because only one theme is available, the option to choose a theme does not display when users are creating or editing a community.
If you customized community themes in a previous release of IBM Connections, there is no migration path provided for importing your changes into IBM Connections 4. Before upgrading to IBM Connections 4, ensure that you review and make a note of your existing customizations to community themes so you can verify them post-migration and rework if necessary.
Related
- Administer Communities
Define a community theme
To define a custom theme for Communities, you typically start by copying an existing theme. The stylesheets for Communities are compartmentalized so that the color information is stored separately from the overall structure of the page. This separation makes it easy to change the page's color without disrupting the layout.
To test your style changes, you might find it helpful to use a web development tool such as the Mozilla Firefox browser extension, Firebug. Firebug allows you to modify colors and styles dynamically on the page so that you can preview what the page looks like when your new style is applied to it.
To define a theme.
- Create a copy of the existing default theme.
For example, to create a new corporate theme:
- Copy the com.ibm.oneui3.styles_build stamp.jar file from app server\installedApps\madoneNode03Cell\Common.ear\connections.web.resources.war\WEB-INF\eclipse\plugins\ to a temporary location.
Here is an example of the path where you might find the JAR file: /local/IBM/WebSphere/AppServer/profiles/AppSrv01/installedApps/Common.ear/connections.web.resources.war/WEB-INF/eclipse/plugins
If the installDir/customizationDir/themes/ directory does not already exist, create it now.
The customizationDir folder is the default directory in which customized files are stored. This location is defined during installation when it is saved as a WebSphere Application Server variable named CONNECTIONS_CUSTOMIZATION_PATH. By default, the variable is set to installDir/data/customization. Find it by logging into the WebSphere Application Server Admin Console, and navigating to Environment > WebSphere Variables. Look for the CONNECTIONS_CUSTOMIZATION_PATH. For example, it might look like this: /local/IBM/Connections/data/shared/customization.
- Rename the new directory to corporateTheme. This gives you a directory path that looks like this one: installDir/customizationDir/theme/corporateTheme.
- Rename the defaultTheme.css stylesheet inside this new directory to corporateTheme.css. Rename the defaultThemeRTL.css stylesheet inside this new directory to corporateThemeRTL.css.
Notes:
- The defaultTheme directory contains stylesheets named defaultTheme.css and defaultThemeRTL.css. In other theme directories, the stylesheets are named themeNameTheme.css and themeNameThemeRTL.css.
- The new themes must be saved in the common customization directory so they can be used from all the applications
- Update the corporateTheme.css file and other CSS files in the new directory as needed. The corporateTheme.css file is now the main stylesheet where you'll be making changes. For example, you might want to modify the color settings to match your organization's corporate colors.
If you're using a tool such as Firebug to test your changes, be sure to copy the settings that you've modified into your new CSS files.
- Save your changes.
- To associate a thumbnail image with your custom theme, upload a theme.jpg file to the following directory:
installDir/customizationDir/communities/images/ This image will be displayed in the Theme Palette.
What to do next
After defining a new theme, you need to add it to the Communities configuration file, communities-config.xml. For more information, see Add a theme to the Communities configuration file.
Add a theme to the Communities configuration file
After defining a custom theme, you need to add it to the Communities configuration file, communities-config.xml.
To edit configuration files, you must use the IBM WebSphere Application Server wsadmin client. See Start the wsadmin client for information about how to start the wsadmin command-line tool. The list of themes displayed in the theme palette in Communities comes from list of themes defined in the Communities configuration file, communities-config.xml. When you define a new theme, add a corresponding theme entry to the configuration file for it to display in the user interface. The placement of the theme in the configuration file list matches its placement in the Communities theme palette. Typically, you might add new themes to the end of the list, but if you want to make your new theme the default community theme, you need to add it to the beginning of the list. This placement means that the theme is used whenever another theme has not been explicitly set.
To add a theme to the Communities configuration file, complete the following steps.
- Start the wsadmin client from the following directory of the system on which you installed the Deployment Manager:
app_server_root\profiles\dm_profile_root\bin...where app_server_root is the WebSphere Application Server installation directory and dm_profile_root is the Deployment Manager profile directory, typically dmgr01.
You must start the client from this directory or subsequent commands that you enter do not execute correctly.
- Start the Communities Jython script interpreter.
- Use the following command to access the Communities configuration files:
execfile("communitiesAdmin.py")If prompted to specify a service to connect to, type 1 to pick the first node in the list. Most commands can run on any node. If the command writes or reads information to or from a file using a local file path, you must pick the node where the file is stored.
- Check out the Communities configuration files :
CommunitiesConfigService.checkOutConfig("working_directory", "cell_name")
where:
For example:
- working_directory is the temporary working directory to which the configuration XML and XSD files are copied. The files are kept in this working directory while you make changes to them.
AIX and Linux only: The directory must grant write permissions or the command will not run successfully.
- cell_name is the name of the WebSphere Application Server cell hosting the IBM Connections application. This argument is required. If you do not know the cell name, you can determine it by typing the following command in the wsadmin command processor:
print AdminControl.getCell()
CommunitiesConfigService.checkOutConfig("/opt/my_temp_dir", "CommServerNode01Cell")
- Open communities-config.xml in a text editor.
- Add a new <comm:theme> element to include the properties for the new theme in the list of themes that are already defined in the file:
For example:
<comm:theme> <comm:themeUuid>corporate</comm:themeUuid> <comm:displayNameKey>label.theme.name.corporate</comm:displayNameKey> <comm:isScriptKey>false</comm:isScriptKey> <comm:cssUrl>/themes/corporateTheme/corporateTheme.css</comm:cssUrl> <comm:cssRtlUrl>/themes/corporateTheme/corporateThemeRTL.css</comm:cssRtlUrl> <comm:thumbnailUrl>/images/corporate.png</comm:thumbnailUrl> </comm:theme>...where:
- <comm:themeUuid> is the unique identifier of the theme that is stored in the database when the theme is selected. It should not contain spaces or special characters. It must be 36 characters or less.
- <comm:displayNameKey> is the resource key for the display name. For information about how to create property strings for the displayNameKey, see Specifying the name of a custom theme.
- <comm:isScriptKey> is set to true when the display name is found in a JavaScript resource file.
- <comm:cssUrl> is the location of the theme stylesheet.
- <comm:cssRtlUrl> is the location of the theme stylesheet for right-to-left languages, such as Arabic and Hebrew.
- <comm:thumbnailUrl> is the location of the thumbnail image that is displayed in the Theme Palette. The image must be included in the following location:
/customization/communities/images/
- Save the communities-config.xml file.
- After making changes, check the configuration files back in, and you must do so during the same wsadmin session in which you checked them out for your configuration changes to take effect. You must also stop and restart the Communities server. See Applying property changes in Communities for information about how to save and apply your changes.
What to do next
- Test your changes by refreshing the web browser.
- When you are ready to make the custom theme available to others, refer to steps 6-8 of Customize the user interface for information about how to publish your changes and make them permanent.
Set the name of a custom theme
After adding a custom community theme to the Communities configuration file, specify the name of your new theme by adding a custom string that contains the theme label to IBM Connections.
To specify the name of a custom community theme, complete the following steps.
- Create a properties file containing the string for the community theme name and add it to the customization directory for Communities. For instructions about how to name the file, see step 1 of the topic, Add custom strings for widgets and other specified scenarios.
For example: customization/strings/com.ibm.lconn.communities.strings.ui.properties
If you have an existing file in this location, add your new string to this file rather than creating a new file.
- Open the properties file from the customization subdirectory for Communities and add the name of the custom theme that you defined in the <comm:displayNameKey> element in the communities-config.xml file.
For example:label.theme.name.corporate=Corporate Theme
- Save your changes and close the properties file.
- To test your changes and to force all user web browsers to refresh cached content and display your changes, complete steps 5-8 of the topic, Customize product strings.
- Restart the Communities server.
Remove community themes
If you want to make a specific community theme unavailable to your users, or you want to disable all community themes, you can do so by editing the Communities configuration file, communities-config.xml.
To edit configuration files, you must use the IBM WebSphere Application Server wsadmin client. See Start the wsadmin client for information about how to start the wsadmin command-line tool. The list of themes displayed in the theme palette in Communities corresponds to the list of themes defined in the Communities configuration file, communities-config.xml. If you want to remove a specific theme from the palette, you can do so by removing the theme or commenting out the relevant section in the configuration file. Or, if you have applied corporate branding to all of IBM Connections, and you want to disable community theming so that the branding applies to all communities, you can do so by removing all of the theme information from the communities-config.xml file. When you remove all of the theme information, the option to choose a theme no longer displays when users are creating or editing communities.
To remove community themes, complete the following steps.
- Start the wsadmin client from the following directory of the system on which you installed the Deployment Manager:
app_server_root\profiles\dm_profile_root\bin...where app_server_root is the WebSphere Application Server installation directory and dm_profile_root is the Deployment Manager profile directory, typically dmgr01.
You must start the client from this directory or subsequent commands that you enter do not execute correctly.
- Start the Communities Jython script interpreter.
- Use the following command to access the Communities configuration files:
execfile("communitiesAdmin.py")If prompted to specify a service to connect to, type 1 to pick the first node in the list. Most commands can run on any node. If the command writes or reads information to or from a file using a local file path, you must pick the node where the file is stored.
- Check out the Communities configuration files :
CommunitiesConfigService.checkOutConfig("working_directory", "cell_name")
where:
For example:
- working_directory is the temporary working directory to which the configuration XML and XSD files are copied. The files are kept in this working directory while you make changes to them.
AIX and Linux only: The directory must grant write permissions or the command will not run successfully.
- cell_name is the name of the WebSphere Application Server cell hosting the IBM Connections application. This argument is required. If you do not know the cell name, you can determine it by typing the following command in the wsadmin command processor:
print AdminControl.getCell()
CommunitiesConfigService.checkOutConfig("/opt/my_temp_dir", "CommServerNode01Cell")
- Open communities-config.xml in a text editor.
- Do one of the following:
- To remove a specific theme, find the <comm:theme> element that corresponds to the theme to remove, and either delete that section or comment it out.
For example:
<!-- <comm:theme> <comm:themeUuid>corporate</comm:themeUuid> <comm:displayNameKey>label.theme.name.corporate</comm:displayNameKey> <comm:thumbnailUrl>/images/CorporateTheme.jpg</comm:thumbnailUrl> </comm:theme> -->
- To remove all community themes, delete or comment out all of the <comm:theme> elements in the file.
- Save the communities-config.xml file.
- After making changes, check the configuration files back in, and you must do so during the same wsadmin session in which you checked them out for your configuration changes to take effect. You must also stop and restart the Communities server. See Applying property changes in Communities for information about how to save and apply your changes.
Use Profiles and Communities business cards
Extend your web application by integrating the Profiles and Communities business cards in to the application.
The Profiles business card provides a snapshot of your profile information and contact details. You can adapt the card to change the information that it includes. For example, you can add or remove links, and customize the contact and location information that displays on the card. The Communities business card displays the image associated with the community, and includes key links that allow users to quickly navigate to a community from the application in which the card is deployed.
The use of JavaScript Object Notation with padding (JSONP) technology in the Profiles and Communities business card will be deprecated in future releases. Although JSONP will continue to be supported, if you are integrating the business card in to your web application and you want to prevent JSONP data from being transmitted by IBM Connections, you must use an Ajax proxy.IBM WebSphere Application Server Application Pack for web 2.0 includes an Ajax proxy. For more information, go to: http://publib.boulder.ibm.com/infocenter/wasinfo/v7r0/topic/com.ibm.websphere.web20fepParent.multiplatform.doc/welc6tech_web20.html
IBM WebSphere Portal Server also includes an Ajax proxy. For more information, go to: http://publib.boulder.ibm.com/infocenter/wpdoc/v6r1/index.jsp?topic=/com.ibm.wp.ent.doc_v6101/dev/ajax_proxy_cfg.html