Quickr Template Customization – Quickr J2EE Architecture

Quickr Template Customization – Quickr J2EE
Architecture
Customizing the Standard Quickr Template to add a new component – innovation place
Deepak Khandelwal
Shigehisa Okamoto
5.1 Goals and Scope of template customization for this
example
The overall scope of this document is to understand where we can use these templates
and how to customize them within the J2EE edition of Quickr 8.1. In this article, we
accomplish the following two objectives:
1. First , we start from the standard ‘out of the box’ teamplace template and
customize it based on specific a use case.
2. Next, we describe how to create a custom component, how to register it on the
component shelf and how to save a new template which includes the new
component.
5.2 What is a Quickr template
A “template” represents a pattern or a model. In Quickr terminology, a template describes
reusable collaborative patterns. They are portable and persistent. Users can instantiate
templates in the form of an application which contains component definitions, process
definitions, layout and seed content. It also describes a community and its relationship to
the components. Templates can have the ability to affect change in instances created from
the original template.
A Place is created by instantiating it from a template. A customized place (including
pages, components and ACL roles definition) can be saved to new template (Figure.1).
Figure 1: Understanding the relationship between a Quickr Place and a Quickr
Template
5.3 Standard templates and components in Lotus Quickr
services for WebSphere Portal
In this section we introduce default templates and components provided in Lotus Quickr
8.1. It is useful for the consideration of the comparison of similar functions to in the
Lotus Quickr services for Domino.
Standard templates
A Quickr place within Lotus Quickr for WebSphere Portal consists of sets of components
and pages. We will illustrate in the coming sections how to create an original place and a
template from a blank “Custom” template. This section gives an overview of the other
out-of-box templates for the starting point for creating place.
Table 1. Standard templates in Lotus Quickr services for WebSphere Portal
Template
Name
Pages
(no page)
Custom
“Library”
Library
“Welcome”
Meeting
Place
“Meeting
Materials”
“Minutes”
“Welcome”
Project
Library
Place
“Project Library”
Components on
pages
(no component)
Usage
-Announcements
-Contacts
-Project Tasks
-Library
Creates a place where you can
create, manage, track, and
search documents and media.
Organize information and tasks
related to your content with
announcements, project tasks,
and a contacts list.
Displays information in the
style of a journal or diary.
Create posts and comments in a
blog to share information with
the team and to gain quick
project solutions. Bring
visibility to your ideas and
questions.
Creates a place where you can
manage different types of team
content. This place contains a
blog that you can use to post
information, a library to help
manage documents and media
files, and a wiki that lets you
create and edit content online.
Creates a place with no default
components installed. Instead,
you customize your place by
adding any component you
need.
-Library
Creates a place where
documents and media files are
managed and searched, such as
creating workflows and review
cycles for documents.
Creates a place to organize and
-Agenda (Lists)
manage team meetings. This
-Announcements
place contains a library that you
-Library
can use to keep relevant
-All Minutes (Wiki) documents handy and a wiki
that can be used for meeting
minutes.
“Team Blog”
-Blog
“Welcome”
“Blog”
“Library”
“Wiki”
-RichTextEditor
-Blog
-Library
-Wiki
“Team Wiki”
-Wiki
Team Blog
Team Place
Team Wiki
Creates a place where content is
created and maintained by
members.
Standard components included
All Quickr functions such as Blog and Wiki functionality are achieved in the form of
component. We can add standard components to our customized place.
Table 2. Standard components in Lotus Quickr services for WebSphere Portal
Component
Usage
Can add Main screen Can add to
Name
comment
previous
page
A blog is a Web site that
Yes
view
no (new
displays information in the
page will
style of a diary. In a place, the
be created)
Blog
team blog is used to record the
milestones of a team or project.
A wiki is a Web site created
Yes
latest update no
and maintained by the same
document
people
who
use
the
Web
site.
Wikis
In a place a wiki is used to
display content in the form of
editable Web pages called wiki
pages.
The feed reader allows you to
No
view
yes
subscribe to and consume
available feeds which you want
Feed Reader
to be displayed.
One of list feature component. Yes
view
yes
An announcements list
Announcements contains news items relating to
a team or project. Users with
editor access to an
announcements list can create
new announcements.
One of list feature component. yes
view
yes
A project task list is used to
store a set of tasks relating to a
Project Tasks
team or project. Users with
editor access to a project task
list can create new task.
One of list feature component. No
view
yes
A contacts list contains a list of
contacts relating to a team or
Contacts
project. Users with editor
access to a contacts list can
Library
Discussion
Forums
Team Calendar
create new contacts.
Libraries are collection
containers for document files
and other media files, such as
video or audio files.
User could start a
brainstorming session on a
current issue or project, get
new ideas from a broad group
of people, and more.
Calendar application. Allows
posting events and milestones
by teamspace members.
Yes
view
no
“post” to
topic
view
yes
No
View(month yes
/week/day)
Blog
A team member can post an idea, report and memo in rich text. The Blog reader can add
a comment to each blog post. In customization for place/template, this component is
added to the place with new page.
Wiki
The team member can edit a web page. The wiki has section content (like Wikipedia),
versioning, generate link from/to wiki page. This component is added to place with new
page too.
Feed Reader
This component can subscribe RSS/Atom feed. Display item options are configurable.
Announcements / Project tasks / Contacts
These components use common “Lists” form element, thus structure of them looks
similar.Announcements, we can select icon by importance of announcement post.
Project tasks provide assign task to team member, GUI parts for task progress status.
Contacts has many fields for attribute data of each contact.
Library
This is the most multifunctional out-of-the-box component. document files are stored and
managed, many view and navigation style, document versioning, template, document
type and draft approval workflow. The Quickr connector on client side access through a
unit of this library component.
Discussion Forums
This is a new component from verison 8.1. This component treats data within a three
layer structure; namely using “Forums”, “Topics” at each forum and “Posts” for each
topic is supported.
Team Calendar
This is a new component from verison 8.1. A team member can post events and
milestone for project. This component provides three view modes: Month, Week and Day.
All these default components are as portlets and portlet applications in Portal. We can
find them in web modules; iwwcm-teamspace-portlet.war (Blog, Wiki and etc.), pdm.war
(Library), teamCalendar.war, feedreader.war.
5.4 Template customization which builds upon the standard
Teamplace
This section provides information on how to customize a template and populate it with
initial seed content. The Teamplace customization is based upon incorporating additional
functionality around blogs, wikis etc.
Quickr 8.1 provides a user with several ‘out of the box’, provided templates. When a user
wants to create a new teamplace, they have to choose from one of these built-in provided
templates. The figure below illustrates the standard templates provided with J2EE Quickr
8.1.
Figure 2: Standard list of templates available in Quickr 8.1
According to one’s specific requirements, the user creates a place based on an underlying
template. With the exception of a custom template, every template has few standard
components. For example, the library template will have a library portlet, while the Team
wiki will have a wiki portlet included. A user can make further changes in these standard
templates based on their specific needs. For example, if someone has the library template
and needs to add wiki functionality, they can add a wiki page in that teamplace.
When creating your own template, you will ideally have defined a specific use case in
advance which determines the required functionality. Additionally, you will have some
seed content which you want to have in all instances of this template. Finally, you will
want to have a defined layout for the template. In the upcoming sections, we will
illustrate a sample test case which describes the process for customizing a template.
Use Case for Creating the Knowledge Network Teamplace
Test Case: IBM. Senior managers want to have a virtual team ‘place’ with a standard
layout. More specifically they wish for the Quickr teamplace to have the following
characteristics:
• It must have a home page which contains a clear Welcome message. The home
page also needs to contain a Feed Reader and an Announcement.
• The next page should have a wiki and a Feed Reader portlet.
• Finally, there should be one page for Discussion Forums, Library and Blogs.
• The Feed Reader portlet should point to same feed that is used for providing the
initial seed content.
The customized Teamplace for this example is called the “Knoweldge Network”.
Step 1: Create the custom Teamplace ‘Knowledge Network’
To start with this case scenario, we begin by creating a custom teamplace first. To create
the custom teamplace, perform the following steps:
1. First, we must create the place.
Figure 3: Creating a new Teamplace based on a custom template.
2. There will be no pages within this new place with custom template and it will ask
you to create pages. Click on ‘click here to create a new page’.
Figure 4: Example of the sample place “Knowledge Network”
Step 2: Create a welcome page for the Teamplace.
As a starting point for the Teamplace, we need to create a Welcome Page. The theme and
theme policy can be decided by administrators or you can use the default Quickr theme.
Figure 5: Creating a welcome page for the new place
Step 3: Adding portlets to the page
After adding this page, we need to add portlets to this page. We can select the portlets
from a portlet catalog by performing the following steps:
Figure 6: Adding portlets to the page
1. Click on Add portlets and select rich text portlet from the menu. Click OK.
Figure 7: Adding the Rich Text Editing Portlet
2. Add two more portlets on this page, namely the Announcements and Feed
Reader portlets.
Figure 8: Adding the Feed Reader portlet
Figure 9: Adding the Announcements portlet
3. Click on Done and return to the Teamplace. You are now presented with the
Welcome Page where you need to write content in rich text portlet and provide a
feed url for the feed reader portlet.
4. After adding a base amount of seed content, the Welcome Page within the
Teamplace should look like the figure below.
Figure 10: Example of the Welcome Page with sample content
Step 4: Adding a new page for the wiki and feed reader.
To create the new page for placing these portlets, perform the following steps:
1. Go to “customize” on a Teamplace and click on page--> Advanced layout
Figure 11: Customizing using Advanced Layout option
2. Create a new page.
Figure 12: Creating a new page within the teamplace
3. Add both the Wiki and Feed Reader portlets on this page.
Figure 13: Adding the Wiki portlet on the new page
Figure 14: Adding the Feed Reader portlet on the new page
4. Return to the Teamplace.
Step 5: Adding a page for a discussion forum within the teamplace.
To add the page for hosting the discussion forum, perform the following steps:
1. Click on “customize” and select components. Select Discussion Forums from
components provided on the shelf.
Figure 15: Selecting the Discussion Forum component
2. Add this as a new page with some name.
Figure 16: Adding a page to host the discussion forum
Step 6: Adding a library component.
1. Similar to Step 5, click on “customize” and select components. Select the
Library component from components provided on the shelf.
Figure 17: Selecting the Library component
2. Create the page for the Library component.
Figure 18: Creating the page for the library
Step 7: Adding the blog component
1. Similar to the steps for adding the Discussion Forum and the Library component,
follow the same steps to add a Blog component.
2. Click on “customize” and select components. Select the Blog component from
components provided on the shelf.
Figure 19: Selecting the Blog component
3. Next, specify to add the blog to a new page and click OK.
Figure 20: Adding a new page for the blog component
At this point, we have added all the required pages and components to this Teamplace, as
shown in the figure below.
Figure 21: Illustration of the Knowledge Network Teamplace with all components
added
Step 8: Save the Teamplace as a template
1. Go to “customize” and then click on Properties. Click on Save Template.
Figure 22: Save as a template
2. Provide a name for the new template
Figure 23: Naming the Application Template
3. Once you have saved the template, you can see this new template as an option to
choose from when you create new Teamplace.
Figure 24: Once saved as a template, this appears as an option to choose from when
creating new Teamplace
4. Once you create a new Teamplace using this new, customized template and you
will experience the same features, layout and the seed content.
5.5 Creating a new custom component
The following article discusses how to create a new component, register it into the
component shelf, then create this as a template
Overall goal and scope for Innovation Place
In this article, we will create a new component called idea and register it into the
component shelf. Later we will create another template for a new Teamplace Innovation Place which will consist of following components.
o
o
o
o
o
Discussion Forum (To discuss posted ideas)
Library (for upload documents and abstracts)
Idea component (Framework to add/ edit ideas)
Latest Ideas (Menu component for latest ideas posted)
Wiki and blog functionality
For Template customization for the Innovation Place, we must first associate these
components with specific pages, then save the updated place as a template. The template
will consist of the following pages and components:
Welcome Page
- Rich text viewer portlet (Introduction for innovation place)
- Idea component (new customized component)
- Latest ideas (Menu component)
Discussion Forums page
- Discussion forums portlet
Library page
- Library portlet
Blog page
- Blog portlet
Wiki page
- Wiki portlet
Preview of the pages and components to be created for the
Innovation Place
Figure 1: Welcome page within Innovation Place
Figure 2: Discussion forums component within Innovation Place
Figure 3: Library component within Innovation Place
Figure 4: Blog component within Innovation Place
Figure 5: Wiki component within Innovation Place
In the next section, we discuss the steps required to create a new component.
Creating the Idea component
Within the Innovation Place, we will create a new custom component called an Idea
component.
The functionality for the List Idea component is as follows:
• User can create ideas by clicking “Add idea” link
• User can edit / delete the ideas
• User can see other ideas and their authors
• User can add an attachment with an idea
The List Ideas component in Lotus Quickr is implemented using Web Content
Management (WCM) and the following defines the basic WCM concepts that are used.
Authoring Templates
Authoring Template determines List Ideas Design. It defines the list of fields and
elements that are on List Ideas Item. It also defines the default values for the fields in the
default Content settings.
Menu Component
Menus in WCM display the List Items that match the search criteria of the Menu element.
Presentation Templates
Presentation Templates define the layout of elements from Content/List Items that will be
displayed using HTML.
Site
A Site is a top level item and can be used to set the default mappings for Authoring
Templates & Presentation Templates for the Content/List Items.
SiteArea
SiteArea is used to group the Content items. Authoring Template & Presentation
Template mappings set on SiteArea will override the settings on Site.
Steps for Creating the Idea Component
The following describes the detailed steps for creating Idea component. There are a total
of 10 high level steps listed, with specific details given for each step. These are as
follows:
• Step 1: Create the Ideas Site
•
•
•
•
•
•
•
•
•
Step 2: Copy items within the site area
Step 3: Create the Authoring Template for Ideas
Step 4: Create the Menu to display the list of Ideas
Step 5: Create Authoring Tool Component which will generate URLs for
New/Edit/Delete Ideas
Step 6: Create Presentation Template to display the Ideas item
Step 7: Copy default Content Item Announcement from Project Tasks
Step 8: Edit Ideas Site and change the template mappings & Menu Component
Step 9: Make a copy of the Announcement Portlet
Step 10: Add the Component on the Quickr customize link.
Step 1: Create the Ideas Site
In this step, you will create the ideas site, based upon the original Announcement site.
1. Go to Site Administration --> Manage Content.
2. Create a site for Ideas in the Shared Resources Library by opening the
Announcement site in edit mode.
3. You can click “By Site” and select “Announcement” in right pane.
Figure 6: Site Areas by Site
4. Click “Edit” button and then use Save As to save the Ideas Site.
Figure 7: Save As – Announcement to Ideas
Figure 8: Naming the new site
5. Once you have completed this step, you will see the Site Ideas listed within the
list of Site Areas, as shown in the figure below.
Figure 9: Ideas Site has been created
Step 2: Copy items within the site area
In this step, you will copy the items from the Announcement Site to the newly created
Ideas site.
1. Copy items for the SiteArea under the Announcement Site to the newly created
Ideas Site using More Actions in UI.
2. Select items SiteArea and then click More Actions--> Copy
3. This will bring up following screen for Site selection and select Ideas.
Figure 10: Copying Items from Announcements to the Ideas site
Step 3: Create the Authoring Template for Ideas
The following steps illustrate how to create the Authoring template for Ideas.
1. Click New -->Authoring Template
Figure 11: Creating the new authoring template
2. Add list_ideas in the name field.
3. Add List - Ideas in the display title.
4. In “Authoring Template Settings” page, check items as shown in the figure
below.
Figure 12: Options for the Authoring Template settings
5. Click on the option for Default Content Setting.
6. Click on Manage Elements, as shown in the figure below.
Figure 13: Managing the Elements to be included in the template
7. Add the following elements in the Ideas Authoring template:
Element type
Rich Text
File Resource
Name
body
ideaUpload
Display title
Body
Project Idea Attachment
8. Once completed, this will look like the figure below:
Figure 14: Element Manager
9. Click OK .
In the Default Content Settings option, please review the settings and match these to the
values shown in the screenshots illustrated below:
Figure 15: Default Content Settings: Name Field properties
Figure 16: Default Content Settings: Display title properties
Figure 17: Default Content Settings: Description field properties
Figure 18: Hide Field Type
Figure 19: Hide Field Library
Figure 20: Hide Field Authors
Figure 21: Hide Field Owners
Figure 22: Profile properties
Figure 23: Hide Content Properties section
Figure 24: Rich Text Field properties
Figure 25: Attachment Properties
10. Once you have reviewed the settings shown in the figures above, click Save
and click Close
Step 4: Create the Menu to display the list of Ideas
1. Open List – Announcement Menu from Components --> Menu for editing and
save it as List – Ideas Menu
Figure 26: Performing the Save As step to create the List – Ideas Menu
2. Change the Authoring Template selection criteria of Menu Element Query to List
– Ideas and remove List – Announcement, as shown in the figure below.
Figure 27: Changing the Authoring Template selection criteria
3. In Further options setting click the option for User-specified rendering portlet
configuration
User-specified rendering portlet configuration
Figure 28: Specifying the portlet configuration
4. Once this option is open, enter the code from the samples shown below:
Header :
<Component name="shared resources/generic_table_header"/>
<table>
</table>
<table class="portlet-table" cellspacing="4" cellpadding="0">
Design for each menu search result:
<tr>
<td width="25px">
<Component name="shared resources/list_ideas_icon" compute="always"/>
</td>
<td style="width:100%;white-space: normal;">
<span class="content-title">
<a href='<Placeholder tag="href"/>' class="teamspaceList"><Placeholder tag="title"/></a>
<br/>
</span>
</td>
</tr>
Footer:
<Component name="shared resources/generic_table_footer"/>
No result design:
<Component name="shared resources/generic_table_header"/>
<table class="portlet-table" cellspacing="0" cellpadding="0">
<tr class="row-blank" >
<td>
@[email protected]@
</td>
</tr>
<Component name="shared resources/generic_table_footer"/>
5. Click Save. In HTML fields, you can see component id parameter is added
automatically.
6. Click Close.
Step 5: Create Authoring Tool Component which will generate URLs
for New/Edit/Delete Ideas
1. Go to Web content ÆNew ÆComponent Æ Authoring tool
2. Enter the information as shown in the screenshots shown below: This is for the
list_ideas_home_tool.
Figure 29: Enter the name of the Authoring Tool component
Figure 30: Specifying the Action Design
Figure 31: Edit Live Content – use the sample code below
Delete action design:
<Component name="shared resources/list_edit_portlet_settings"/>
3. Click Save. The id parameter is added as below:
Figure 32: The Delete Action Design
4. Click Close.
5. Next, add a second Authoring tool
6. Go to Web content ->New ->Component -> Authoring tool
7. Add the information as shown in the screenshots below. This is for the
list_ideas_item_action_links.
Figure 33: Enter the name of the Authoring Tool component
Figure 34: Specifying the Action Design
Figure 35: Edit Live Content – use the sample code below
Figure 36: Delete Action Design
Step 6: Create Presentation Template to display the Ideas item
In the following steps, you will use the List - Main News Presentation template, then
save this as a List-Main Ideas template.
1. Open List – Main Presentation Template for editing and Save As List – Main
Ideas
Figure 37: Open the List Main News, then Save As List – Main Ideas
2. Enter the information as shown in the screenshots shown below:
Figure 38: Providing the information for the Name and Display title
3. Change the Presentation Template HTML, so that it displays the fields from
Ideas and uses the List – Ideas Home Action Links authoring tool component
that was created to generate the New/Edit/Delete Links for Ideas. The HTML to
enter is shown below:
Presentation template
<table cellpadding="0" cellspacing="0" dir="@nls@dir@" class="ibm-portlet-section-body">
<tr>
<td class="ibm-portlet-section-left">
<div class="ibm-portlet-section-header-small ibm-portlet-section-header">
<table cellpadding="0" cellspacing="0">
<tr>
<td class="header-icon"><Component name="shared
resources/list_main_view_icon"/></td>
<td class="header-left"><h1>
<IDCmpnt context="current" type="sitearea" field="title"/></h1><div
class="information"><IDCmpnt context="current" type="sitearea" field="description"/></div>
</td>
<td class="header-right" style="white-space: nowrap;border-left:1px solid #ECECEC">
</li>
</td>
<td class="header-right" style="white-space: nowrap" ><Component name="shared
resources/list_ideas_home_tool"/></td>
</tr>
</table>
</div>
<div class="content-container">
<Element context="current" type="site" key="menu"/>
</div>
</td>
</tr>
</table>
4. Create the List – Ideas Item template
5. Open the List – Announcement Presentation Template for editing and Save As
List – Ideas Item
Figure 39: Entering the new name for List Ideas Item – Created from Save As from
Announcement Presentation Template
6. Change the Presentation Template HTML (provided below) so that it displays the
fields from Ideas and uses the List – Ideas Item Action Links authoring tool
component that was created to generate the New/Edit/Delete Links for Ideas.
<table cellpadding="0" cellspacing="0" dir="ltr" class="ibm-portlet-section-body">
<tr>
<td class="ibm-portlet-section-left">
<div class="ibm-portlet-section-header-small ibm-portlet-section-header">
<table cellpadding="0" cellspacing="0">
<tr>
<td class="header-icon"><Component name="shared
resources/list_main_view_icon"/></td>
<td class="header-left"><h1><IDCmpnt context="current" type="content" field="title"/>
</h1><div class="information"><a class="nav-link" href="<URLCmpnt
context="current" type="site" mode="storable"/>">< Back to <IDCmpnt context="current"
type="sitearea" field="title"/></a>&nbsp;<span
class="commentHeaderTimestamp">|</span>&nbsp;</div>
</td>
&nbsp;&nbsp;&nbsp
<td class="header-right" style="white-space: nowrap;border-left:1px solid
#ECECEC"><Component name="shared resources/list_ideas_item_action_links"/>
</td>
</tr> </table> </div>
<div class="content-container">
<table cellpadding="0" cellspacing="0" width="100%">
<tr> <td>
<Element context="current" type="content" key="body"/>
</td> </tr> <tr>
<td><script>
var fileUrl = '<Element context="current" type="content" key="ideaUpload"/>';
if(fileUrl!='') {
document.write("<a href="+fileUrl+" title=""
target="">"+fileUrl.substring(fileUrl.lastIndexOf('/')+1,fileUrl.lastIndexOf('?'))+"</a>");
} else {
document.write("<FONT COLOR=red>No Attachment</FONT>");
}
</script> </td> </tr>
</table>
<IDCmpnt context="current" type="content" field="authors" awareness="true"
start="&lt;p&gt;&lt;h4&gt;@[email protected]@&lt;/h4&gt;"/>
</div>
</table>
7. Click Save and click Close.
Step 7: Copy default Content Item Announcement from Project Tasks
1. Go to Content->By Site Area-> Announcement ->items and select
Announcement Content item,
2. From More Actions->Copy, Select Ideas->items so that it saves the copy in
Ideas->items.
Figure 40: Copying the default content item
Step 8: Edit Ideas Site and change the template mappings & Menu
Component
1. Now, edit the Ideas site and change the template mappings & Menu Component
Figure 41: Edit the Ideas site and change the template mappings
2. Edit the template mapping as follows;
a. Remove
List – Announcement (Authoring Template)
List – Announcement (Presentation Template) Item mapping
b. Add
List – Ideas (authoring Template)
List – Ideas Item (Presentation Template) mapping
c. Edit
List – Default (Authoring Template)
d. Change mapping
From:
List – Main(Presentation Template)
To:
List – Main Ideas (Presentation Template)
e. Change List View (menu) to select List – Ideas Menu
f. Change New Button Text to Add Idea
Figure 42: Changing the template mappings
3. Click Save and click Close.
Step 9: Make a copy of the Announcement Portlet
1. Now go to Site Administration and make copy of Announcement Portlet to
create Ideas
2. Go to Site Administration-> Advanced Administration ->Portlet
Management->Portlets and search for Announcement
Figure 43: Creating the Ideas Portlet based upon the Announcements portlet
3. Click on copy portlet and create Ideas Portlet
Figure 44: Naming the new portlet
4. Click on the configure portlet icon and go to Portlet Settings.
5. Change following values:
templateSite
shared resources/ideas
titleKey
Ideas
desciptionKey
Idea Description
WCM_CONTENT_CONTEXT /ideas2/items/Announcement
6. Change the value of AUTHORINGTEMPLATE_OVERRIDE by performing
the following steps:
a. Go to Site Administration -> Manage Content -> Authoring Template
->Open
List – Ideas in Edit mode .
b. Right click on List – Ideas authoring template -> view page source. It
will open a text document. Search for the
HEX_IDENTITY_REFERENCE value field. It gives results similar to
this:
<input type="hidden" value="9362290047dd0f7f8d56cd667e18b34e"
name="PC_7_UBKEDVC21GEKB02P28TC6D14D1_HEX_IDENTITY_
REFERENCE" id="HEX_IDENTITY_REFERENCE" class="te1" />
c. Take the value of value field . Change the value of
AUTHORINGTEMPLATE_OVERRIDE with this value .
Add one parameter
New parameter : CommentsShow
New value
: disabled
d. Click Add.
Figure 45: Listing of Parameters
e. Click OK.
7. Go to Portal Settings->Custom Unique Names->Portlets and change Unique
Name for the News portlet to wps.p.web.ideas
Step 10: Add the Component on the Quickr customize link.
1. To add the component on the Quickr customize link, edit the following file:
<QuickrDir>/wp_profile/installedApps/<node>/wps.ear/wps.war/themes/html/<them
e folder>/pageHeaderContent.jsp file and following for custom component under
<div id="customizePage2" style="display: none;"
<li>
<a href="#"
onClick="javascript:showTeamSpaceAddComponentForm(&quot;<%=MarkupUtil.htmlAtt
ributeEscape(MarkupUtil.jsEscape("Ideas"))%>&quot;,
&quot;<%=MarkupUtil.htmlAttributeEscape(MarkupUtil.jsEscape("Ideas"))%>&quot;,
&quot;<%= applicationID %>&quot;, &quot;wps.p.web.ideas&quot;, true, nodesOnLevel,
false, Ideas)" class="picture">Ideas</a>
</li>
Creating the Menu component for latest Ideas
In this step, we will now create a menu component which will retrieve content from the
specified authoring template on the date basis.
Step 1: Create a new Menu component
1. Create a new Menu component by navigating to New ÆComponent Æ Menu
Figure 46: Creating the new Menu component
2. Name the Menu component Aggregated Ideas
Figure 47: Naming the new Menu component ‘Aggregated Ideas’
Step 2: Select the List- Ideas as authoring template
1. Select the List-Ideas (created in a previous step) as the authoring template for the
Menu component
Figure 48: Selecting the List-Ideas template authoring template
Step 3: Select menu design properties
1. Select the menu design properties as shown in the screenshot below:
Figure 49a: Menu component design properties
Figure 49b: Menu component design properties
Figure 49c: Menu component design properties
2. Once you have verified these settings, please click Save and close.
Step 4: Place the Web Content Viewer portlet on the page to view the
list Ideas
1. Finally – view the completed component for List Ideas on a page, you must first
put a “Web content viewer” portlet on that page.
2. From within the page, add the Web Content Viewer Portlet as shown below
Figure 50: Place the Web Content Viewer on the page to view List Ideas
Step 5: Edit the settings of the Web Content Viewer Portlet to show
the Aggregated Ideas component
1. Click Edit shared setting of this “Web content viewer” Portlet on the page as
following.
Figure 51: Associating the Aggregated Ideas component with the web content viewer
portlet.
2. Click Apply and OK.
3. All the latest ideas will be listed here in descending order, as shown in the
screenshot below
Figure 52: Showing the list of Ideas
Saving the Innovation Place template with the new customized
components
After adding all the pages with all these out of box and customized components, we can
save it as a template using the same method as described in last section.
1. Click customize Æ Properties and Save Template.
Figure 53: Saving as a template
Comparison between J2EE version and Domino version in
template customization
As we described, the J2EE version a Quickr Place template consists of page and
components. Blog, Wiki and Library are all ready as components. Though the template
only for the unit is prepared respectively, it is possible to add component to other
templates.
In case we customize template, edit object are components and pages. Both version has
similar function as Application, but the beginning point of customizing depends on each
architecture and is different. Customizing and extending templates and component can be
done based on the portal and web content management infrastructure.
Regarding document file storage function, J2EE version basically treat them in only
Library component. Domino version could has document files at any position as attached
file. In this respect, when the Quickr connector accesses them, usage of the application is
a little different between both version.
Table 3. Comparison template customization
J2EE version
Default template
-Custom
-Library
-Meeting Place
-Project Library Place
-Team Blog
-Team Place
-Team Wiki
Customize object
Components and Pages
Connector access
Library component
to
Domino version
-Srandard place for Teams
-Blog
-Wiki
etc. (Some Domino templates
are only available in English
and from Website)
Forms and Pages
Any group for attached files
Summary
This document summarizes customizations to the Lotus Quickr template for WebSphere
Portal. We described how to create a new template by editing the place and creating an
original component. This serves as a useful exercise for understanding how the
template/place and component architecture is based on portal and web content
management. We introduced the default templates and components in Lotus Quickr
portal version, and illustrated some of the key differences with the Quicker Domino
version.
Reference:
Customizing your place (Information Center)
http://publib.boulder.ibm.com/infocenter/lqkrhelp/v8r0/topic/com.ibm.lotus.quickr.user.
wp.doc/ts/customize_place.html
Customizing components in IBM Lotus Quickr services for IBM WebSphere Portal 8.0
http://www.ibm.com/developerworks/lotus/library/quickr-components/