An IBM Proof of Technology
Producing and consuming ATOM/RSS feeds
Lab Exercise
Catalog Number
© Copyright International Business Machines Corporation 2007, 2008. All rights reserved.
US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
IBM
Contents
Lab 1 Overview 5
1.1 Objectives 5
Time Estimate 5
Prerequisites 5
Getting Started 5
Lab 2 Producing and consuming ATOM/RSS feeds 6
2.1 Producing ATOM feeds 6
2.2 Consume Feeds 24
Summary 35
End of Exercise 35
Appendix A. PRODUCING OTHER ATOM AND RSS FEEDS 36
Fixed Portal Page ATOM Feed 36
Standalone web site ATOM Feed 37
RSS Feed 38
Appendix B. SETTING UP THE PERSONALIZATION FEEDS RESOURCE 40
Appendix C. Notices 55
Appendix D. Trademarks and copyrights 57
Contents Page 1
IBM
THIS PAGE INTENTIONALLY LEFT BLANK
Lab 1 Overview
1.1 Objectives
The purpose of this lab is to demonstrate how to produce ATOM/RSS feeds to existing Lotus Web Content Management site areas, and how to consume existing feeds.
After completion of the lab, the IT specialist will be able to add feeds into his existing web site managed by Lotus Web Content Management and integrate existing feeds into their portal sites.
Time Estimate
The IT Professional should be able to complete this lab in 60 minutes.
Prerequisites
Appropriate Skill Level:
You need to have a basic understanding on how to build WCM web sites.
A good understanding of the format of ATOM and RSS feeds will help you to more easily follow all steps, but we will introduce you these topics.
Image Requirements:
This lab exercise uses the STEW 2008 image labeled WTS Image 1.
Hardware Requirements:
PC Hardware with a minimum of 2 gigabytes of RAM and 25 gigabytes of free disk space.
Software Requirements:
VMware Workstation version 6.
Getting Started
In order to start the lab, open the VMware image file labeled WTS Image 1 in the VMware Workstation application and start the image.
Lab 2 Producing and consuming ATOM/RSS feeds
2.1 Producing ATOM feeds
__1. In the first part of this lab, you will add an ATOM feed to your existing web site. You will do this as an example in the Intranet site that is preinstalled with WebSphere Portal, but you should be able to easily add this to other WCM managed web sites as well. The feed will basically be managed by an ATOM Feed Menu Component that will create the ATOM feed for the existing site area. It will be linked to in the 'List' presentation template of the content. The ATOM Feed Menu Component needs some control elements. Two 'CDATA' Text Components are needed to control rich text in the feed. If you want to display your content on different pages, you need a page URL mapping that refers to the page where the content needs to be shown.
Normally, you would put these design elements in a specific design library, but to keep this lab applicable to any new Portal 6.1 installation you will put it in the standard library 'Intranet 6.1.0' available with Portal installation.
__a. Have a look at the existing Jumpstart first. Open Mozilla Firefox (as this browser has a built-in feed reader) and go to http://portal.ibm.com:10040/wps/portal/intranet:
This shows you the 'Intranet' home page with latest news, announcement and events lists. 'Intranet' is the page name. You will add an ATOM feed to announcements in this example, so people can subscribe to this list and use their favorite feed reader to get updated on any new announcements. As you can notice from the URL, a Virtual Portal mapping of 'intranet' exists for this page.
__b. Now first site the PageURLMapping element in the site area for which your want to use the feed. Log in first as a WCM designer, in this environment, user=wpadmin, password=passw0rd.
__c. And then go to the main portal, with URL http://portal.ibm.com:10040/wps/myportal:
__d. Go to 'Applications' – 'Content' – 'Web Content Management' as shown.
__e. Then change the library from the default 'Internet Web Content 6.1.0' to 'Intranet Web Content 6.1.0' and navigate to the Content to verify that you have an 'Intranet' site with underlaying 'Home' – 'Announcements' site area. In this site area, you should see the 'Announcement List' that controls the list view, and two announcement entries 'Employee Achievements' and 'Company Milestones'.
__f. Now go back one level to 'Home' and select 'Announcements' on the right. Click 'Edit'.
__g. Select 'Manage Elements'.
__h. Select a 'Short Text' element type and name it 'PageURLMapping' with display title 'Page URL Mapping'. Click 'Add' and 'OK'.
__i. Then set the new element to 'intranet' as this is the portal page where the announcement as shown. Click 'Save and Close'. You may repeat this for the other site areas 'News' and 'Events'.
__2. In the feed, you need to be able to add rich text in your feeds. This is controlled by putting the rich text into '<![Data[' and ']]>' text. However, this cannot be edited directly in the menu, as it will be encoded into something like '<...'. Therefore, you will put this text in text components and add these components into your menu component.
__a. Create a new text component. Select 'New' – 'Component' – 'Text'. Give it the name and display title 'CData Start' and put '<![CDATA[' in the text element field.
__b. Add access to all users (including anonymous). Go to the ‘Access’ section and add ‘[all users]’ to the contributor role.
__c. Click 'Save’ and then ‘Save as' to create another text component. Name it now 'CData End' and add ']]>' in the text element:
__d. This should have the same access settings as the one you copied from. Click 'Save and Close' to store it.
__3. Now create a new Menu Component. Select in menu 'New' – 'Component' - 'Menu'.
__a. Set the name and display title to 'ATOM Feed Menu'. Set the description to 'Menu that creates an ATOM feed for an existing site area'.
Then select 'Site Areas' in 'Menu Element Query'. Select 'Exclude current content from results', unselect both 'Include ancestors' and 'Include descendants'. Open 'Further Options' and select 'Current content'. This will have the menu search in the current's content's site area for all content found. You will use the list content 'Announcement List' in our example, as the context for this menu, and this should not appear as an item in the feed.
__b. Add the following code in the header. For your convenience, you may import this from 'C:\Lab Files\FeedsLab\ATOMFeedMenu.html'
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title><IDCmpnt context="current" type="content" field="title"/></title>
<link rel="self" href="<PathCmpnt type="base"/>/wps/portal/<Element context="current" type="sitearea" key="PageURLMapping"/>?WCM_GLOBAL_CONTEXT=<URLCmpnt context="current" type="content" mode="standalone"/>"></link>
<updated><HistoryCmpnt context="current" type="content" field="lastmodifieddate" format="yyyy-MM-dd'T'hh:mm:ss'Z'"/></updated>
<author>
<name><IDCmpnt context="current" type="content" field="authors" format="cn"/></name>
</author>
<id><PathCmpnt type="base"/>/wps/myportal/<Element context="current" type="sitearea" key="PageURLMapping"/>?WCM_GLOBAL_CONTEXT=<URLCmpnt context="current" type="content" mode="standalone"/></id>
<generator uri="http://www.ibm.com/software/lotus/products/webcontentmanagement">Lotus Web Content Management</generator>
__c. Based on the current context, the default content for a site area, it will create this example code:
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title>Announcements List</title>
<link rel="self" href="http://portal.ibm.com:10040/wps/myportal/intranet?WCM_GLOBAL_CONTEXT=/wps/wcm/myconnect/Intranet+Web+Content+6.1.0/IntranetSite/Home/Announcements/AnnouncementsList"></link>
<updated>2008-06-24T12:24:57Z</updated>
<author>
<name>uid=xyzadmin,o=defaultWIMFileBasedRealm</name>
</author>
<id>http://portal.ibm.com:10040/wps/myportal/intranet?WCM_GLOBAL_CONTEXT=/wps/wcm/connect/Intranet+Web+Content+6.1.0/IntranetSite/Home/Announcements/AnnouncementsList</id>
<generator uri="http://www.ibm.com/software/lotus/products/webcontentmanagement">Lotus Web Content Management</generator>
__d. Now enter the following code in 'Design for each menu search result:'
<entry>
<title type="text"><IDCmpnt context="autoFill" type="content" field="title"/></title>
<link rel="alternate" type="text/html" href="<PathCmpnt type="base"/>/wps/myportal/<Element context="current" type="sitearea" key="PageURLMapping"/>?WCM_GLOBAL_CONTEXT=<URLCmpnt context="autoFill" type="content" mode="standalone"/>"></link>
<id><PathCmpnt type="base"/>/wps/myportal/<Element context="current" type="sitearea" key="PageURLMapping"/>?WCM_GLOBAL_CONTEXT=<URLCmpnt context="autoFill" type="content" mode="standalone"/></id>
<published><WorkflowCmpnt context="autoFill" type="content" field="publishdate" format="yyyy-dd-MM'T'hh:mm:ss'Z'"/></published>
<updated><HistoryCmpnt context="autoFill" type="content" field="lastmodifieddate" format="yyyy-dd-MM'T'hh:mm:ss'Z'"/></updated>
<summary type="html"><Element context="autoFill" type="content" key="Summary"/></summary>
<content type="html"><Component name="CData Start" htmlencode="false"/><Element context="autoFill" type="content" key="Description"/><Component name="CData End" htmlencode="false"/></content>
<category term="<ProfileCmpnt context="autoFill" type="content" field="categories"/>" ></category>
<author>
<name><IDCmpnt context="current" type="content" field="authors" format="cn"/></name>
</author>
</entry>
__e. It uses content stored in the elements 'Summary' and 'Description'. If this is different in your authoring template(s), you may need to change that. This generates the following example content:
<entry>
<title type="text">Company Milestones</title>
<link rel="alternate" type="text/html" href="http://portal.ibm.com:10040/wps/myportal/intranet?WCM_GLOBAL_CONTEXT=/wps/wcm/myconnect/Intranet+Web+Content+6.1.0/IntranetSite/Home/Announcements/CompanyMilestones"></link>
<id>/wps/wcm/myconnect/intranet+web+content+6.1.0/intranetsite/home/announcements/companymilestones</id>
<published>2008-30-04T10:41:42Z</published>
<updated>2008-05-06T12:33:00Z</updated>
<summary type="html">Has your company released a new product or reached financial milestone? Post announcements that celebrate your company's progress.</summary>
<content type="html"><![CDATA[<BR>Has your company released a new product or reached financial milestone? Post announcements that celebrate your company's progress.]]></content>
<category term="" ></category>
<author>
<name>uid=xyzadmin,o=defaultWIMFileBasedRealm</name>
</author>
</entry>
__f. Finally enter in the footer the code to end the feed:
</feed>
__4. You should now have the following:
__5. Click 'Save' and you should see that the component tags will have an ID added:
If this is not added, please verify if you used the right names for these components and correct if necessary.
__6. Allow this menu to be read by all users (also anonymous ones). Go to the ‘Access’ section and add [all users] to User Defined users, as shown.
__7. Now test your ATOM Feed Menu first.
__a. Click 'Preview'.
__b. Then select in the 'Intranet Web Content 6.1.0' library, the site 'Intranet', site area 'Home' – 'Announcement' and then content 'Announcement List'.
__c. This should show the follow feed subscription to Announcements.
__d. If you do not see this, you may want to check that you are using Mozilla Firefox and no other browser. If you have any other problems in generating your feed, you may want to use a markup validator, such as the W3C Markup Validation Service: http://validator.w3.org/#validate_by_input. Click 'Subscribe Now' and keep the selection 'Bookmarks Toolbar Folder'. Click 'OK'.
__e. Go back to the previous browser window and notice that the feed is now available in your browser. By clicking on it, it will load the latest list of announcements.
__f. You may want to change the URL of this feed to anonymous access. Click right on the “Announcement List” and select “Properties”. Remove the “my” from myconnect in the URL as show. Click “OK” to save. Normally, if you use feeds for your internet access, these URLs are generated correctly automatically.
__8. Now you will add the ATOM Feed Menu to your content, in this case the list contents for the different site areas announcements, events, etc. In this example, this is managed with the presentation template of the 'Announcement List' content, 'List'.
__a. Select 'Web Content'.
__b. Then go to 'Presentation Templates', select 'List' and click 'Edit'.
__c. Add the code in red to the existing presentation template code. For your convenience, you may import the modified design directly from 'C:\Lab Files\FeedsLab\ListPT.html:
<html>
<head>
<link rel="alternate" type="application/atom+xml" title="<IDCmpnt context="current" type="content" field="title"/>" href="<URLCmpnt context="current" type="content" mode="standalone"/>?srv=cmpnt&source=library&cmpntname=Intranet+Web+Content+6.1.0/ATOM+Feed+Menu" />
</head>
<body TEXT="Black" BGCOLOR="White" BACKGROUND="" LEFTMARGIN="0" RIGHTMARGIN="0" TOPMARGIN="0" BOTTOMMARGIN="0">
<Component id="f4717b00456c4c529a399f68831e096e:NC9pbnRyYW5ldCB3ZWIgY29udGVudCA2LjEuMC9zdHlsZXM=" name="intranet web content 6.1.0/styles"/>
<script type="text/javascript" language="JavaScript" src="<Component id="89e40980456ed79099d4fd85f14ced10:NC9pbnRyYW5ldCB3ZWIgY29udGVudCA2LjEuMC9saXN0c2NyaXB0cw==" name="intranet web content 6.1.0/listscripts"/>"></script>
<Element context="current" type="content" key="Header"/>
<a href="<URLCmpnt context="current" type="content" mode="standalone"/>?srv=cmpnt&source=library&cmpntname=Intranet+Web+Content+6.1.0/ATOM+Feed+Menu" />Subscribe</a>
<Element context="current" type="content" key="List"/> <Element context="current" type="content" key="Footer"/>
</body>
</html>
__d. It should look like the following:
The link in the header adds a link to the feed producer that will be displayed on the right of the name bar of Mozilla. The A HREF adds a link to the 'Subscribe' text and opens the same feed producer for the current content managed by the 'ATOM Feed Menu' menu component. You may wish to change the 'Subscribe' text to a feed image component.
__9. Now you will configure the intranet site to receive the links from the feed and test it directly in the site.
__a. Go to the intranet site again http://portal.ibm.com:10040/wps/portal/intranet. Notice that each list (Latest News, Announcement and Event) now has the 'Subscribe' option. Click on the top right of the 'Announcement' portlet to make it receive links from other portlets and specially from the feed.
__b. Click 'Edit Shared Settings'.
__c. In the links section, select 'Other portlets and this portlet' to receive links from. Click 'Ok'. Click on 'Subscribe' in the 'Announcement' portlet. Then in the feed list, click on 'Company Milestones'. This should bring you back to the intranet portal page and open this announcement directly.
In Appendix A, you will learn how to create ATOM feeds that will show the feed content in a fixed portal page and in a web page, instead of a portal. You will also learn how to create RSS feeds.
You have successfully added feeds to your existing web site. You are now ready to consume it directly in your web site.
2.2 Consume Feeds
In this section of the lab, you will learn how to consume or integrate any ATOM or RSS feed into your existing web sites. You will first use the 'Feed Reader' portlet for this, then you will use the WebSphere Portal Personalization resource collection to use ATOM feeds within Lotus Web Content Management.
__10. You will first consume your freshly created feed into the Feed Reader portlet.
__a. Click the '>' on the top right to open the portlet pallette.
__b. Search any portlet that starts with 'feed' and drag and drop this portlet to your page as shown:
__c. Now you need to configure it. Select 'Feed Settings'.
__d. Enter the Feed URL of your 'Announcement List' with anonymous access (connect and not myconnect)
http://portal.ibm.com:10040/wps/wcm/connect/Intranet+Web+Content+6.1.0/IntranetSite/Home/Announcements/AnnouncementsList?srv=cmpnt&source=library&cmpntname=Intranet+Web+Content+6.1.0/ATOM+Feed+Menu
You can find it again, by clicking on the 'Subscribe' link in the 'Announcement' portlet. The address of your new page is the link. Name it and give it a description. All other settings can be kept as default.
__e. This should give you the following content in your 'Feed Reader' portlet:
You have now successfully consumed a feed using the Feed Reader portlet in your portal site. Now you will use the WebSphere Portal Personalization resource collection to use ATOM feeds. In Appendix B, you will learn how to set up this resource collection. For your convenience, we have already set this up in the image.
__11. First build a feed rule for your own created ATOM feed.
__a. Go to the main portal, http://portal.ibm.com:10040/wps/myportal/, 'Applications' - 'Content' - 'Personalization' - 'Business Rules'.
__b. Click 'New' – 'Rule', name it 'Announcement' and enter your announcement URL (corrected for anonymous use, using “connect” instead of “myconnect”):
http://portal.ibm.com:10040/wps/wcm/connect/Intranet+Web+Content+6.1.0/IntranetSite/Home/Announcements/AnnouncementsList?srv=cmpnt&source=library&cmpntname=Intranet+Web+Content+6.1.0/ATOM+Feed+Menu
__c. Click 'Save' and 'Preview'. This should show the following
__12. Create a WCM Personalization component pointing to the rule.
__a. Go to 'Web Content Management' and verify that you are in the 'Intranet Web Content 6.1.0' library. Click 'New' – 'Component' – 'Personalization'.
In the 'Name' and 'Display Title' fields enter 'Announcement Personalization'. Then click 'Search' under 'Personalization Element' and select the 'Announcement' rule you just created.