ITPub博客

首页 > 架构设计 > 软件结构 > 使用IBM WCM配置信息发布的操作步骤(下篇)

使用IBM WCM配置信息发布的操作步骤(下篇)

原创 软件结构 作者:zhengwenping 时间:2018-11-29 17:48:02 0 删除 编辑

     通过WCM配置实现信息、内容展现,一共需要经过7个步骤。WCM的配置过程较为复杂,而且极易出错,必须每一步都严格按照以下内容操作。

第4步:创建菜单组件

菜单组件是显示的核心,用于显示Portlet栏目里的新闻条目列表或滚动新闻,点击条目时弹出新闻的明细页面。

创建菜单组件及授权的过程如下。

名称: menu_yantai_companyNews ——公司新闻组件,如图 1- 11所示。

1- 11  创建名称为“ menu_yantai_companyNews ”的菜单组件

   指定菜单的各项属性,指向到需要展示的站点区域下,如图1-12所示。

1-1 2   指定菜单设计属性

编写 “每个菜单搜索结果的设计”代码,参考代码如图 1-13 所示。

1- 13   编写“每个菜单搜索结果的设计”代码

针对参与者,单击后面的“授予参与者访问权”链接,授予菜单的访问权限,如图1-14所示。

1- 14   授予菜单的访问权限

菜单就是栏目里信息条目的展现方式,可以灵活设计,下面介绍几种菜单类型供参考。

  菜单类型 1 :普通文本新闻(公司新闻)的菜单组件

普通文本新闻的菜单组件指的是每个栏目显示该站点区域下的前 8 条信息,点击信息条目时弹出信息明细页面,当该站点区域下有超过 8 条的信息时,显示“更多”按钮,单击“更多”按钮,则弹出带分页功能的全部信息条目页面。菜单由 3 个元素组成:页眉、每个菜单结果、页脚。

页眉代码 如下:

<script type="text/javascript">

function _company_NewsMove(obj){

var companyNewsContainerWidth = document.getElementById("companyNews").   style.width;

var companyNewsWidth = companyNewsContainerWidth.substring(0,companyNews - ContainerWidth.length-2);

obj.className = "companyLiMover";

obj.style.width = (companyNewsWidth - 18) +"px";

}

function _company_NewsOut(obj){

obj.className = "";

}

</script>

 

<div id="companyNews" style="width:335px;">

<div style="margin:2px 0px 0px 0px;width:100%;">

<span>

<a id="comHref" target="_blank">

<script>

var.getElementById("wanhuaLanguageName").value;

if(lang == "zh"){

  document.write(" 公司新闻 ");

}else if(lang == "hu"){

  document.write("Cégcsoport Hírek");

}else{

  document.write("Company news");

}

</script>

</a>

</span>

<span id="companyLink">

<a  class="newLink" onmouseover="dropdownmenu(this, event, ' newLinkCss ' );">new</a>

<div id="newLinkCss">

[Component id="2e974037-49f3-4aa0-9ab1-a7cc0e87205c:NC93YW5odWEvd2FuaHVh - X2xpbmtfYmVpamluZ2tlanVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_beijingkeju_   companynews"]

[Component id="460f9529-8994-4983-9441-ca79a4edf065:NC93YW5odWEvd2FuaHVh - X 2xpbmtfY2hlbmdiYW9zaGFuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_chengbaoshang_   companynews"]

[Component id="ea560d65-651c-44ee-8373-ab5ef9fb3e71:NC93YW5odWEvd2FuaHVh - X2xpbmtfamlhbmxpX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_jianli_companynews"]

[Component id="34d4d805-ab28-4916-af67-d0ea13bc6d4e:NC93YW5odWEvd2FuaHVh - X2xpbmtfeWFudGFpZ29uZ3lleXVhbl9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_yantaigongyeyuan_companynews"]

[Component id="31da860f-2f02-49d7-b477-bde849515aa0:NC93YW5odWEvd2FuaHVh - X2xpbmtfZ3Vhbmdkb25ncm9uZ3dlaV9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_guangdongrongwei_companynews"]

[Component id="3b2520f8-4e3a-4392-951c-141f2e740ae4:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhZ3VvamlfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuaguoji_companynews"]

[Component id="b1502461-dd21-4c 1- ae70-de7c498ef764:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhamllbmVuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_wanhuajieneng_companynews"]

[Component id="7ca359a5-1ca5-4968-99b2-c45e76281416:NC93YW5odWEvd2FuaHVh - X2xpbmtfbmluZ2Jvcm9uZ3dlaV9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_ningborongwei_companynews"]

[Component id="1be07e75-252d-4986-a3d6-c767c593dda1:NC93YW5odWEvd2FuaHVh - X2xpbmtfbmluZ2Jvd2FuaHVhX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_ningbowanhua_companynews"]

[Component id="ad779aa4-d529-41a6-add4-624a592b7228:NC93YW5odWEvd2FuaHVh - X2xpbmtfc2hhbnhpemhvbmdxaWFuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_shanxizhongqiang_companynews"]

[Component id="100ffaca-ac68-4613-9df8-ee8566c0e24b:NC93YW5odWEvd2FuaHVh - X2xpbmtfYmNfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_bc_companynews"]

[Component id="4450f966-4cc7-4ad9-ab0f-e1e30dbb70fb:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhYmFueWVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuabanye_companynews"]

[Component id="ef7df3a6-6ee5-4d28-81fe-4defcd44aee1:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhbWF0b3VfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuamatou_companynews"]

[Component id="f2080b98-8778-4d09-ab78-2688b66ab4ae:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhcmVkaWFuX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_wanhuaredian_companynews"]

[Component id="c937678b-d061-4100-bc97-f076693431fa:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhc2hpeWVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuashiye_companynews"]

[Component id="d31d4028-a1ad-4a5a-bba2-ce01eb2f7488:NC93YW5odWEvd2FuaHVh - X2xpbmtfeWFudGFpX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_yantai_companynews"]

</div>

</span>

 

<script type="text/javascript">

var newLinkCssContent = document.getElementById("newLinkCss").innerHTML;

newLinkCssContent = newLinkCssContent.replace(/\s/g,"");

if(newLinkCssContent == ""){

document.getElementById("companyLink").style.display = "none";

}

</script>

 

 

</div>

<div style="clear:both;"></div>

< div style="margin:1px 0px;width:100%;"><hr/>   </div>

<div>

<ul>

<script>

var comp_i = 0;

</script>

每个菜单结果的代码 如下:

<li onmousemove="javascript:_company_NewsMove(this);" onmouseout="javascript:   _company_NewsOut(this);">

<script>

if(comp_i == 0){

document.getElementById("comHref").href = '[Placeholder tag="href"]';

}

comp_i++;

</script>

<a href="[Placeholder tag="href"]"  target="_blank" hidefocus="true" title=" [Element context="autofill" type="content" key="news_title"]">

<span>[[Property context="autofill" type=   "content" format="yyyy-MM-dd" field="publishdate"]]</span>

<span>

<script type="text/javascript">

d ocument.write(companyWidthCheck('[Element context="autofill"type="   content"key="news_title"]',45));

</script>

</span>

</a>

</li>

页脚代码 如下:

</ul>

</div>

</div>

  菜单类型 2 :滚动图片新闻的菜单组件

滚动图片新闻的菜单组件指的是每个条目的新闻都有一个名为 TitleImage ”的图片,所有条目的图片滚动显示,点击图片时弹出新的页面,用来显示该条目对应的信息详细内容。

页眉代码 如下:

  <script type="text/javascript">

function _company_NewsMove(obj){

var companyNewsContainerWidth = document.getElementById("companyNews").   style.width;

var companyNewsWidth = companyNewsContainerWidth.substring(0,company - NewsContainerWidth.length-2);

obj.className = "companyLiMover";

obj.style.width = (companyNewsWidth - 18) +"px";

}

function _company_NewsOut(obj){

obj.className = "";

}

</script>

<div id="companyNews" style="width:335px;">

<div style="margin:2px 0px 0px 0px;width:100%;">

<span>

<a id="comHref" target="_blank">

<script>

var.getElementById("wanhuaLanguageName").value;

if(lang == "zh"){

  document.write(" 公司新闻 ");

}else if(lang == "hu"){

  document.write("Cégcsoport Hírek");

}else{

  document.write("Company news");

}

</script>

</a>

</span>

<span id="companyLink">

<a onmouseover="dropdownmenu(this, event, 'newLinkCss');">   new</a>

<div id="newLinkCss">

[Component id="2e974037-49f3-4aa0-9ab1-a7cc0e87205c:NC93YW5odWEvd2FuaHVh - X2xpbmtfYmVpamluZ2tlanVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_beijingkeju_   companynews"]

[Component id="460f9529-8994-4983-9441-ca79a4edf065:NC93YW5odWEvd2FuaHVh - X 2xpbmtfY2hlbmdiYW9zaGFuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_chengbaoshang_   companynews"]

[Component id="ea560d65-651c-44ee-8373-ab5ef9fb3e71:NC93YW5odWEvd2FuaHVh - X2xpbmtfamlhbmxpX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_jianli_companynews"]

[Component id="34d4d805-ab28-4916-af67-d0ea13bc6d4e:NC93YW5odWEvd2FuaHVh - X2xpbmtfeWFudGFpZ29uZ3lleXVhbl9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_yantaigongyeyuan_companynews"]

[Component id="31da860f-2f02-49d7-b477-bde849515aa0:NC93YW5odWEvd2FuaHVh - X2xpbmtfZ3Vhbmdkb25ncm9uZ3dlaV9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_guangdongrongwei_companynews"]

[Component id="3b2520f8-4e3a-4392-951c-141f2e740ae4:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhZ3VvamlfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuaguoji_companynews"]

[Component id="b1502461-dd21-4c 1- ae70-de7c498ef764:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhamllbmVuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_wanhuajieneng_companynews"]

[Component id="7ca359a5-1ca5-4968-99b2-c45e76281416:NC93YW5odWEvd2FuaHVh - X2xpbmtfbmluZ2Jvcm9uZ3dlaV9jb21wYW55bmV3cw==" name="wanhua/wanhua_link_ningborongwei_companynews"]

[Component id="1be07e75-252d-4986-a3d6-c767c593dda1:NC93YW5odWEvd2FuaHVh - X2xpbmtfbmluZ2Jvd2FuaHVhX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_ningbowanhua_companynews"]

[Component id="ad779aa4-d529-41a6-add4-624a592b7228:NC93YW5odWEvd2FuaHVh - X2xpbmtfc2hhbnhpemhvbmdxaWFuZ19jb21wYW55bmV3cw==" name="wanhua/wanhua_link_shanxizhongqiang_companynews"]

[Component id="100ffaca-ac68-4613-9df8-ee8566c0e24b:NC93YW5odWEvd2FuaHVh - X2xpbmtfYmNfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_bc_companynews"]

[Component id="4450f966-4cc7-4ad9-ab0f-e1e30dbb70fb:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhYmFueWVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuabanye_companynews"]

[Component id="ef7df3a6-6ee5-4d28-81fe-4defcd44aee1:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhbWF0b3VfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuamatou_companynews"]

[Component id="f2080b98-8778-4d09-ab78-2688b66ab4ae:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhcmVkaWFuX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_wanhuaredian_companynews"]

[Component id="c937678b-d061-4100-bc97-f076693431fa:NC93YW5odWEvd2FuaHVh - X2xpbmtfd2FuaHVhc2hpeWVfY29tcGFueW5ld3M=" name="wanhua/wanhua_link_wanhuashiye_companynews"]

[Component id="d31d4028-a1ad-4a5a-bba2-ce01eb2f7488:NC93YW5odWEvd2FuaHVh - X2xpbmtfeWFudGFpX2NvbXBhbnluZXdz" name="wanhua/wanhua_link_yantai_companynews"]

</div>

</span>

<script type="text/javascript">

var newLinkCssContent = document.getElementById("newLinkCss").innerHTML;

newLinkCssContent = newLinkCssContent.replace(/\s/g,"");

if(newLinkCssContent == ""){

document.getElementById("companyLink").style.display = "none";

}

</script>

</div>

<div style="clear:both;"></div>

<d iv style="margin:1px 0px;width:100%;"><hr/>   </div>

<div>

<ul>

<script>

var comp_i = 0;

</script>

每个菜单结果的代码 如下:

< li onmousemove="javascript:_company_NewsMove(this);" onmouseout="javascript:   _company_NewsOut(this);">

<script>

if(comp_i == 0){

document.getElementById("comHref").href = '[Placeholder tag="href"]';

}

comp_i++;

</script>

<a href="[Placeholder tag="href"]"  target="_blank" hidefocus="true" title=" [Element context="autofill" type="content" key="news_title"]">

<s pan>[[Property context="autofill" type="content" format   ="yyyy-MM-dd" field="publishdate"]]</span>

<span>

<script type="text/javascript">

d ocument.write(companyWidthCheck('[Element context="autofill"type="content" key="news_title"]',45));

</script>

</span>

</a>

</li>

页脚代码 如下:

</ul>

</div>

</div>

    5 步:创建演示模板(如有则跳过

演示模板用来显示每条信息的详细内容。创建演示模板的步骤如下。

      ① 单击“新建”→“演示模板”,输入名称:temp_show_spotNews——焦点新闻演示模板,如图1-15所示。

1- 15  创建名称为“ temp_show_spotNews ”的演示模板

② 在演示模板的“演示标记”属性项下输入代码,参考代码如图 1-16 所示。

1- 16   演示模板的“演示标记”属性项参考代码

    6 步:创建编写模板

①  创建编写模板的步骤如下。

新建 “编写模板”,输入名称: temp_YYYY_spotNews ——焦点新闻,如图 1- 17 所示。

1-17    创建名称为“ temp_YYYY_spotNews ”的编写模板

  ② 输入编写模板的表单属性,参考值如图 1- 18 所示。

1- 18   输入编写模板的表单属性值

  ③ 为编写模板指定对应的演示模板,如图 1- 19 所示。

1- 19  为编写模板指定对应的演示模板

④ 单击 “更多操作”→“管理元素”,为这个编写模板添加组件,如图 1- 20 所示。

1- 20   为编写模板添加组件

     7 步:配置内容呈现 Portlet

① 在 Portlet 管理界面复制“ Web Content Viewer Web 内容查看器)” Portlet ,定制到指定的页面上,然后进行部署,如图 1- 21 所示。

1- 21   Portlet 选择默认内容,并选择要展示的站点区域

Portlet 选择演示模板,如图 1-22 所示。

1- 22   Portlet 选择演示模板

单击 “保存”按钮,就完成了 Portlet 的所有配置,如图 1- 23 所示。

1- 23   保存 Portlet 的所有配置

    8 步:分配 Portlet 的查看者

单击 “管理”→“ Portlet 管理”,找到要分配权限的 Portlet ,然后单击该 Portlet 右侧的“指定对 Portlet 的访问权”按钮,如图 1- 24 所示。

单击 “编辑角色”图标,为之授予“特权用户”角色,如图 1- 25 所示。

1-24    指定对该 Portlet 的访问权

1- 25  授予“特权用户”角色

单击“添加”按钮,在弹出的用户、用户组列表里选择具有查看者权限的用户或用户组,如图 1- 26所示。

1- 26   添加具有查看者权限的用户或用户组

完成后回到首页,该 Portlet 就能正常显示该站点区域对应的栏目内容了。



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

请登录后发表评论 登录
全部评论
郑文平,专职从事企业门户(Portal)的咨询、实施、管理、问题诊断、性能调优等超过15年时间,拥有50多个门户项目经验。著有全球唯一一本辅导企业门户项目实施的书籍 《企业门户(Portal)项目实施方略与开发指南》(电子工业出版社,2013年),亦擅长互联网产品的规划设计。

注册时间:2018-11-07

  • 博文量
    24
  • 访问量
    8101