ITPub博客

首页 > Linux操作系统 > Linux操作系统 > IBM Lotus Quickr中处理组件第 1 部分:创建一个新闻组件

IBM Lotus Quickr中处理组件第 1 部分:创建一个新闻组件

原创 Linux操作系统 作者:genusBIT 时间:2009-07-06 13:36:40 0 删除 编辑

转自:developerworks

作者:Amit Pareek, 系统软件工程师, IBM
Yogesh Karekar, IT 专家, IBM

本文提供了完整的操作步骤,解释如何在 IBM® Lotus® Quickr™ Services for WebSphere® Portal 8.1 中创建新的组件(新闻列表)。这个新闻组件支持新闻内容的基本特性:标题、摘要、正文和类型(普通新闻和重要新闻)。

要阅读本文,您应当对 Lotus Quickr Services for WebSphere Portal 8.1(本文后面将简称为 Lotus Quickr)、IBM Lotus Web Content Management 和使用 JavaServer Pages (JSP) 的 Java™ 编程有较好的理解。

Lotus Quickr 提供了一组列表组件,可用于显示项目任务、公告和联系人等结构化内容。用户可以使用这些预定义组件中的任何一种来存储与 teamplace 中某个团队或项目有关的信息。

本文将展示如何在 Lotus Quickr 中创建一种新的列表组件,即新闻列表。此列表组件支持一则新闻内容的基本特性:标题、摘要、正文和类型(普通新闻和重要新闻)。

本文介绍了创建新闻组件的详细步骤。

本文的新闻组件是在 Lotus Quickr 中使用 Lotus Web Content Management 应用程序实现的。

概述

图 1 展示了这个新闻组件架构的高级视图。


图 1. 新闻组件的架构
新闻组件的架构

新闻组件具有以下特征:

  • 新闻组件是一个 Lotus Web Content Management 组件。
  • 新闻组件创建的所有内容都保存在相应的 teamplace 库下的 News 站点区域中。
  • 使用名为 List – News 的创作模板创建内容。
  • 使用名为 List – News Menu 的菜单组件从相应的站点区域取回新闻内容。
  • 使用名为 List – News Icon 的 JSP 组件显示新闻类型(普通新闻或重要新闻)。通过使用 Lotus Web Content Management API,这个 JSP 根据新闻的类型显示相应的图标。
  • 使用名为 List – News Image 的图像组件在表示模板中显示新闻图像(图标)。
  • 新闻组件使用了两种表示模板 List – Main News(如图 2 所示)和 List - News Item(如图 3 所示)。
    • List – Main News 用于呈现菜单组件 List – News Menu。
    • List - News Item 用于显示单个新闻项的细节。
  • 将前端 portlet 配置为使用最新创建的 Lotus Web Content Management 工件。
  • 创建 Lotus Web Content Management 工件并为其配置 portlet 之后,添加新创建的新闻组件以定制该区段。


图 2. List - Main News 表示模板
List - Main News 表示模板

通过单击任意新闻项,用户可以查看该新闻项的细节。


图 3. List- News 项表示模板
List- News 项表示模板

通过使用窗口右侧提供的链接,用户可以添加或删除这些新闻项。如图 4 所示。


图 4. 添加或删除新闻项的链接
添加或删除新闻项的链接

创建新闻组件

下面的小节将介绍创建新闻组件的具体步骤。遵循以下步骤:

  1. 以管理员身份作为 wpsadmins 组的成员登录到 Lotus Quickr。
  2. 单击左侧面板的 Site Administration 链接。
  3. 单击页首的 Manage Content 选项卡,显示 Web Content Authoring portlet。

注意:创建一个新的库,存储任何 Lotus Quickr 定制所创建的所有新工件。Shared Resources 库是 Lotus Quickr 附带的一个工件,该库在执行修复或补丁时会发生变化。

为新闻组件创建站点

创建新闻 Lotus Quickr 组件的第一步是创建站点和站点区域框架,用于关联创作模板和表示模板。下面的步骤描述了如何为组件创建站点。

  1. 单击 Web Content 选项卡并选择 New - Site。
  2. 在 Name 字段输入 “news”,在 Display title 字段输入 “News”。
  3. 单击 Save。
  4. 在 Web Content 页面,选择 Site Areas - By Site view。它将显示最新创建的 News 站点和其他站点区域。

    为 News 站点创建新闻站点区域

    遵循以下步骤,创建用于存储新闻组件的默认内容的站点区域。

    1. 单击 Web Content 选项卡并选择 New - Site Area。
    2. 选择站点 News,您需要在该站点下创建新闻站点区域。
    3. 单击 OK。
    4. 在 Name 字段输入 “items”,在 Display title 字段输入 “Items”。
    5. 单击 Save。

    为新闻组件创建创作模板

    本节介绍如何为新闻组件创建创作模板。创作模板类似一个方案图,包含系统中创建的所有新闻项。

    1. 在 Web Content 页面上,选择名为 Shared Resources 的库,然后选择 Authoring Templates 视图。它将显示一个现有创作模板的列表。
    2. 从该列表中选择名为 List - Announcement 的创作模板并在 Edit 模式下打开它,方式为单击列表上方的 Edit 操作。
    3. 在 Edit 模式下,选择顶部的 Save - Save as 操作。
    4. 将 Name 字段的值改为 “list_news”,将 Display title 字段的值改为 “List - News”。
    5. 单击 OK 创建新的创作模板。
    6. 在 Actions to Hide 区段中选择以下选项,该区段显示在创作模板的 Edit 模式下:
      • Save
      • Save as
      • Save and read
      • Save and version
      • Preview
      • Apply authoring template
    7. 按如下所示修改 Toolbar visibility options 区段中的选项:
      • 选择 Hide top toolbar 选项。
      • 选择 Reverse the toolbar button order 选项。
    8. 在 Versioning Strategy 区段中,选择 Do not offer a manual version 选项和 do not version automatically 选项。
    9. 在创作模板中添加以下 Access 设置。这些选项将所有继承的访问添加的创作模板中,参见图 5。
      • Check Inheritance for role User
      • Check Inheritance for role Contributor
      • Check Inheritance for role Editor
      • Check Inheritance for role Manager


      图 5. 新创作模板的访问设置
      新创作模板的访问设置

    10. 单击 Save。

      为创作模板配置默认的内容设置

      遵循以下步骤为创作模板配置默认的内容设置:

      1. 单击 List-News 页面顶部位于 action 按钮下方的 Default Content Setting 链接。
      2. 单击 Manage Elements。
      3. 将表 1 所示的元素添加到 News 创作模板。

      表 1. 管理元素列表
      元素类型 名称 显示标题
      富文本 第一行的第二个单元格 摘要
      富文本 正文 新闻正文
      选项选择 类型 新闻类型

      注意:不要修改这些元素的名称。

      图 6 展示了 Element Manager 窗口,当您单击 List - News 页面顶部的 Manage Elements 操作时将显示该窗口。此窗口可使管理员管理(即添加、修改或删除)创作模板的元素。


      图 6. 创作模板 List - News 的 Element Manager 表单
      创作模板 List - News 的 Element Manager 表单
      1. 单击 OK。
      2. 单击 List-News 页面顶部的相应操作返回到 Default Content Settings 视图。
      3. 在 Identification 区段,单击 Name 字段旁边的 Properties 图标 properties 图标 并选择以下选项,如图 7 所示:
        • Hide field.
        • Generate name. The field is not editable when visible.

        Name 字段将自动生成,因为 Lotus Web Content Management 要求特定站点区域中的所有内容都有惟一的名称。由于您不可能每次都依赖用户输入一个惟一的名称,因此使用该选项将使 Lotus Web Content Management 可以使用内容的 uuid 作为其名称。这种方式可以确保名称是惟一的。



        图 7. Name 字段的属性
        Name 字段的属性

      4. 单击 Done。
      5. 在 Identification 区段中,单击 Display title 字段旁边的 Properties 图标 properties 图标,并选择 Identify this as a required field 选项。
      6. 在 Field label 字段中输入 “News Title”。
      7. 单击 Done。
      8. 在 Identification 区段中,单击 Description 字段旁边的 Properties 图标 properties 图标,并选择以下选项:
        • Hide field.
        • Generate the description. The field is not editable when visible.
      9. 单击 Done。
      10. 在 Identification 中的以下每个字段中,选择 Hide field 选项并单击 OK。
        • Type
        • Library
        • Authors
        • Owners
      11. 单击 Done。
      12. 单击 Profile 区段旁边的 Expand 图标 expand 图标 以打开该区段。
      13. 在 Profile 区段中,选择 Hide field 选项。
      14. 单击 Content Properties 区段旁边的 Expand 图标 expand 图标 以打开该区段。
      15. 在 Content Properties 区段中,选择 Hide field 选项。

        配置创作模板的元素和默认访问

        遵循以下步骤,配置创作模板的元素和默认访问:

        1. 单击 Content 区段旁边的 Expand 图标 expand 图标 以打开该区段,如图 8 所示。
        2. 在 Content 区段中,单击 Summary 字段旁边的 Properties 图标 properties 图标。将 Field height 的值改为 150,然后单击 Done。


          图 8. Content 区段列出创作模板元素
          Content 区段列出创作模板元素

        3. 在 Content 区段中,单击 News Body 字段旁边的 Properties 图标 properties 图标
        4. 将 Field height 的值修改为 350。选择 Identify this as a required field 选项。
        5. 单击 Done 以保存更改。
        6. 在 Content 区段中,单击 News Type 字段旁边的 Properties 图标 properties 图标
        7. 在 Type the choices 窗口中输入以下文本:
          @nls:custom_news.nls.CustomNews@News.Normal@
          @nls:custom_news.nls.CustomNews@News.Important@

          注意:带有 at 符号(@)的文本用于翻译。请参考 developerWorks® 文章 “在 IBM Lotus Quickr services for IBM WebSphere Portal 8.0 中定制组件” 了解更多有关 Lotus Quickr 国际化的内容。

        8. 选择 User interface 区段中的 Radio Button 选项。
        9. 单击 Done。
        10. 单击 Access 区段旁边的 Expand 图标 expand 图标 以打开该区段。
        11. 在 Access 区段中,选择 Hide field 选项然后单击 OK。
        12. 单击 Save。

        创建菜单组件以显示新闻项列表

        该菜单组件用于向该组件主页上的用户显示一个新闻组件列表。遵循以下步骤创建菜单组件:

        1. 单击 Web Content 选项卡并选择 New - Component - Menu 以打开一个空白表单,从中创建一个新菜单组件。
        2. 在 Name 字段中输入 “list_news_menu”,在 Display title 字段中输入 “List – News Menu”。
        3. 在 Menu Element Query 区段中,选择以下选项:
          • Authoring Templates
          • Site Areas
        4. 选择 List – News 作为创作模板。
        5. 单击 Further 选项设置站点区域。
        6. 在 Site Areas 区段中,选择以下选项:
          • Include ancestors
          • Include descendents
          • Current content options
        7. 在 Menu design 属性区段中,进行以下修改,如图 9 所示:
          • 将 selection for the Specify results display order 字段修改为 Descending。
          • 选择 Creation Date 作为 “sort results first by” 下所有三个字段的选项。
          • 将 Maximum 页面的值修改为包括 10000 个字段。
          • 将 Pages 的值修改为提前读取 200 个字段。


          图 9. 菜单组件设计属性
          菜单组件设计属性

        8. 在 Header 字段中输入清单 1 所示的 HTML 代码:

        清单 1. 每个菜单搜索结果的设计
        				
        
        
        

        1. 在 Design for each menu search result 字段中输入清单 2 所示的 HTML 代码。

        清单 2. 每个菜单搜索结果的设计
        < Placeholder tag="title"/>

        1. 在 Footer 字段中输入清单 3 所示的 HTML 代码。

        清单 3. 每个菜单搜索结果的设计
        
        

        1. 在 No result design 字段中输入清单 4 所示的 HTML 代码。

        清单 4. No result design
        
        
        
        @nls@list.empty@

        1. 按图 10 所示修改 Access 区段。此次修改将向该组件添加所有继承访问。
          • Select Inheritance for role User
          • Select Inheritance for role Contributor
          • Select Inheritance for role Editor
          • Select Inheritance for role Manager


          图 10. 菜单组件的访问设置
          菜单组件的访问设置 单击 Save

          创建名为 List - News Icon 的 JSP 组件

          List – News Icon JSP 组件用于显示表示新闻项类型的图标。遵循以下步骤创建 JSP 组件:

          1. 单击 Web Content 选项卡并选择 New - Component - JSP。
          2. 在 Name 字段中输入 “list_news_icon”,在 Display title 字段中输入 “List – News Icon”。
          3. 在 Path 字段中输入 /teamspace/jsp/html/list_news_icon.jsp 作为 JSP 路径。

            注意:在 <.quickr_server_root>/PortalServer/installedApps /WCM_Teamspace_Portlet_.ear/.war/teamspace/jsp/html 目录中创建并保存 JSP 文件 list_news_icon.jsp。清单 5 展示了 JSP 文件中的样例代码。


          清单 5. list_news_icon.jsp 的代码
          <%@ page buffer="none" %>
          <%@ page session="true" contentType="text/html" import="java.util.*,
                    javax.naming.*,
                    com.ibm.workplace.wcm.api.exceptions.*,
                    com.ibm.workplace.wcm.api.*,
                    javax.naming.Reference,
                   org.apache.jetspeed.portlet.PortletURI"
          %><%@
          taglib uri="/WEB-INF/tld/portlet.tld" prefix="portletAPI"
          %><%@
          taglib uri="/WEB-INF/tld/portal.tld" prefix="wps"
          %><%@
          taglib uri="/WEB-INF/tld/wcm.tld" prefix="wcm"
          %><%!
          	static final String IMAGE_NORMAL_SRC = "normal.gif";
          	static final String IMAGE_IMPORTANT_SRC = "important.gif";
          
          	static final String IMAGE_NORMAL_LABEL = 
          	"@nls:custom_news.nls.CustomNews@News.Normal@";
          	static final String IMAGE_IMPORTANT_LABEL = 
          	"@nls:custom_news.nls.CustomNews@News.Important@";
          
          	static final String NEWS_TYPE_NAME = "type";	
          %><%
          // If rendering as part of a JSP Cmpnt, get the rendering context for the cmpn, 
          this context is menu aware
          RenderingContext renderingContext = (RenderingContext)request.
          getAttribute( Workspace.WCM_RENDERINGCONTEXT_KEY );
          
          // If we still don't have a rendering contxt then we will produce nothing.
          if ( renderingContext != null )
          { 
             // Ensure we only attempt to access items with User access
             wcmWorkspace.useLiveAccess(true);
          
          	Content content = null;
          	DocumentId docId = renderingContext.getCurrentResultId();
          
             if ( docId != null && docId.isOfType( DocumentTypes.Content ) )
             {
          		content = (Content)wcmWorkspace.getById( docId );
             }
             if ( content == null )
             {
                content = renderingContext.getContent();
             }
          
          	OptionSelectionComponent ption = (OptionSelectionComponent)content.
          	getComponent( NEWS_TYPE_NAME );
          	if (option != null )
          	{
          	   // We will default to ta regular icon/selection.
          	   boolean specialSelected  = false;
          	   String[] selections = option.getSelections();
          
          	   if ( selections != null && selections.length > 0 )
          	   {
          	      // Should only be a single slection, but well check them all
          	      for ( int i=0; i<%= altText %><%
          	}
          }
          %>
          

          1. 修改 Access 区段以将继承访问添加到 Editor 和 Manager 角色中,如图 11 所示。这一修改将把所有继承访问添加到组件中。
            • Select Inheritance for role User
            • Select Inheritance for role Contributor
            • Select Inheritance for role Editor
            • Select Inheritance for role Manager


            图 11. JSP 组件的访问设置
            JSP 组件的访问设置

          2. 单击 Save。

            创建名为 List - News Image 的图像组件

            该图像组件用于在新闻列表组件的顶部显示新闻图像(图标)。遵循以下步骤创建图像组件:

            1. 单击 Web Content 选项卡并选择 New - Component - Image。
            2. 在 Name 字段输入 “list_news_image”,在 Display title 字段输入 “List – News Image”。
            3. 将图像 news_list_32x32.gif 上传到 List News Image 选项卡的 Image Element 区段的 Image 字段中。

              注意:使用合适的图像表示您的新闻组件。为了获得最佳效果,所使用图像的大小应该为 32x32 像素。

            4. 如图 12 所示修改 Access 区段。这一修改将把所有继承访问添加到该组件中。
              • Select Inheritance for role User
              • Select Inheritance for role Contributor
              • Select Inheritance for role Editor
              • Select Inheritance for role Manager


              图 12. Image 组件的访问设置
              Image 组件的访问设置

            5. 单击 Save。

              创建表示模板以显示新闻项列表

              表示模板用于显示呈现新闻项列表的菜单组件。菜单组件被映射到站点;然后在表示模板中引用它。

              1. 单击 Web Content 选项卡并选择 New - Presentation Template。
              2. 在 Name 字段中输入 “list_main_news” 并在 Display title 字段中输入 “List – Main News”。
              3. 在 Presentation Template 字段中输入清单 6 所示的 HTML。

              清单 6. 显示新闻项列表的表示模板


              1. 将图 13 所示的 Access 设置添加到表示模板。这一修改将所有继承访问添加到此表示模板。
                • Select Inheritance for role User
                • Select Inheritance for role Contributor
                • Select Inheritance for role Editor
                • Select Inheritance for role Manager


                图 13. 显示新闻项列表的表示模板的访问设置
                显示新闻项列表的表示模板的访问设置

              2. 单击 Save。

              创建 List – News Item 表示模板

              该表示模板用于在用户单击新闻列表中的某一项时显示每一条新闻项及其细节。遵循以下步骤进行创建:

              1. 单击 Web Content 选项卡并选择 New - Presentation Template。
              2. 在 Name 字段中输入 “list_news_item” 并在 Display title 字段中输入 “List - News Item”。
              3. 在 Presentation Template 字段中输入清单 7 所示的 HTML 代码。

              清单 7. 显示单个新闻项细节的表示模板
              @nls:custom_news.nls.CustomNews@ News.NewsSummary@
              @nls:custom_news.nls.CustomNews@ News.NewsBody@


                
              @nls:custom_news.nls.CustomNews@ News.Author@ @nls:custom_news.nls.CustomNews@ News.PublishDate@

        1. 将如图 14 所示的 Access 设置添加到表示模板。这一修改将所有继承访问添加到此表示模板。
          • Select Inheritance for role User
          • Select Inheritance for role Contributor
          • Select Inheritance for role Editor
          • Select Inheritance for role Manager


          图 14. 显示单个新闻项细节的表示模板的访问设置
          显示单个新闻项细节的表示模板的访问设置

        2. 单击 Save。

        创建默认内容项

        该项的类型是 List-Default,用于存储新闻组件的元数据。

        遵循以下步骤进行创建:

        1. 在 Web Content 页面中,选择 library Shared Resources,然后选择 Content - By Site Area 视图。这将显示现有站点的列表。
        2. 浏览到 Announcement - Items,选择名为 Announcements 的内容项,然后单击列表顶部的 More Actions - Copy 操作。
        3. 在随后的视图中,选择站点区域 News - Items 作为本文前面创建的目标站点区域。
        4. 在 Web Content 页面中,选择库 Shared Resources,然后选择 Content - By Site Area 视图。它将显示现有站点的列表。
        5. 浏览到 News - Items,从列表中选择名为 Announcements 的内容项,然后通过单击列表顶部的 Edit 操作在 Edit 模式下打开它。
        6. 将 Name 字段值改为 “news”,并将 Display title 字段值改为 “News”。
        7. 单击 Save。

        编辑 News 站点并添加模板映射和菜单组件

        这个步骤将添加需要在站点中定义的创作模板和表示模板的映射。还在站点中定义了一个定制元素来映射 List – News Menu 菜单组件。遵循以下步骤来编辑站点:

        1. 单击 Web Content 选项卡并选择 Site Area - By Site 视图。
        2. 在 Edit 模式下打开 News 站点,方法为单击列表顶部的 Edit 操作。
        3. 单击 Manage Element。
        4. 在 Element Manager 页面,在 News 站点中添加表 2 所示的元素。

        表 2. News 站点的 Element Manager
        元素类型 名称 显示标题
        组件引用 comment_section Comment Section Reference
        组件引用 Menu List View
        文本 new_button new_button

        注意:不要修改这些元素的名称。

        1. 在 Site Properties 区段中,选择内容项 /shared resources/news/items/news,该项是在前面的小节中作为默认内容创建的。
        2. 在 Site Properties 区段中,单击 Edit Template Mapping,添加表 3 所示的创作模板和表示模板的映射。

        表 3. News 站点的模板映射
        创作模板 表示模板
        List – News List – News Item
        List – Default List – Main News
        1. 在所显示屏幕的 Elements 区段中,执行以下步骤:
          • 选择 List – News Menu 组件作为 List View 元素的值。
          • 选择 Document Posts - Show HTML 组件作为 Comment Section Reference 元素的值。
          • 将下面的文本输入到 new_button 区段:
            @nls:custom_news.nls.CustomNews@News.newAction@
        2. 向表示模板添加图 15 所示的 Access 设置。这一修改将所有继承访问添加到此站点中。
          • Select Inheritance for role User
          • Select Inheritance for role Contributor
          • Select Inheritance for role Editor
          • Select Inheritance for role Manager


          图 15. 站点的访问设置
          站点的访问设置

        3. 单击 Save。

        创建 teamspace portlet 应用程序副本作为新闻 portlet

        创建完所有 Lotus Web Content Management 工件后,必须使用 portlet 将新闻组件公开给用户。

        遵循以下步骤:

        1. 在 Lotus Quickr 页面导航中,进入 Site Administration - Advanced Administrator 页面。
        2. 在 Portlet Management - Portlets 区段中,搜索 Announcement portlet。
        3. 通过单击 Copy 图标 copy 图标 创建 Announcement portlet 的副本。
        4. 输入 “News List Application” 作为 portlet 应用程序名称,并输入 “News” 作为 portlet 名称。
        5. 单击 Configure portlet 图标 configure 图标 并修改表 4 所示的参数。

        表 4. 需要修改的 Portlet 参数
        参数名 参数值
        templateSite shared resources/news
        titleKey @nls:custom_news.nls.CustomNews@News.Title@
        desciptionKey @nls:custom_news.nls.CustomNews@News.NewsSiteDescription@
        AUTHORINGTEMPLATE_OVERRIDE see instructions below for retrieving the ID
        WCM_CONTENT_CONTEXT /news/items/news
        componentType news_list
        1. 获得创作模板的 ID;参见清单 8 的代码:
          • 在 Lotus Web Content Management 创作 portlet 中,在 Edit 模式下打开创作模板 List – News。在您的浏览器中查看此 Web 页面的源代码。
          • 寻找 HEX_IDENTITY_REFERENCE value 字段。
          • 使用 value 属性中的 ID(本例中为 e5e826804a3ff2ccb18abd6be9464753)。

        清单 8. 获得创作模板的 ID
        
        

        1. 单击 OK。
        2. 在 Advanced Administration 页面中选择 Portal Settings - Custom Unique Names - Portlets 区段。
        3. 将 News portlet 的惟一名称修改为 “wps.p.web.news”。
        4. 单击 OK。

        将新闻组件添加到 Lotus Quickr Customize 链接

        本节介绍如何在定制区段添加新闻组件的链接。该链接使授权用户能将新闻组件添加到任何 teamplace。

        遵循以下步骤添加新闻组件:

        1. 访问目录 / wp_profile/installedApps//wps.ear/wps.war/themes/html/QPG。
        2. 打开 pageHeaderContent.jsp 文件并查找 id 为 “customizePage2” 的
          标记:
        3. 将清单 9 所示的 HTML 添加到这个
          标记。

        清单 9. 使 News 组件可用于主题的 Customize teamplace 区段的 HTML 片段
        
        

        1. 将属性 JAR 文件(news_properties.jar)添加到目录 /PortalServer/wcm/shared/app 中。

          注意:可以在本文的下载小节找到 news_properties.jar 文件。

        2. 重新启动 Lotus Quickr 服务器。
        3. 通过使用 Customize 区段,现在可以将新的新闻组件添加到 teamplace 中,就像添加其他组件(Announcements 或 Project Tasks)一样。

        结束语

        本文描述了如何在 Lotus Quickr 8.1 的门户版本中创建新组件(新闻组件)。您使用 Lotus Web Content Management 工具创建并配置了用于新闻组件的工件,使新闻组件可以在 Lotus Quickr teamplace 中使用。您还使用经过翻译的字符串,让新闻组件国际化。


        来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/14751907/viewspace-608404/,如需转载,请注明出处,否则将追究法律责任。

        请登录后发表评论 登录
        全部评论