Deliver an exceptional mobile web experience using WebSphere Portal and IBM Worklight, Part 6: Feed web content from IBM Web Content Manager to a Worklight mobile app

This article describes how you can develop an IBM® Worklight® mobile application that displays web content from an IBM WebSphere® Portal server, while leveraging the advantages of a web content management system such as IBM Web Content Manager. This article provides an example that displays web content feeds from IBM Web Content Manager in a hybrid mobile application created with IBM Worklight.

Vinod Appajanna (vinod_app@in.ibm.com ), Websphere Portal/WCM/Mobile-Portal-Accelerator Specialist, IBM

Vinod Appajanna is a Websphere Portal/WCM/Mobile-Portal-Accelerator Specialist at IBM (Mobile, Worklight integration, WEF, Portal integration with other products) and a Solution Architect. Vinod has around 9 Years experience in WebSphere Portal and mobile technology area. In this period he has played multiple roles including Product Architect, Solution Architect, IT Specialist, and Team/Project Lead, 4 years of experience in Design and Development of e-business application. In Recent months (since 8 months) he has been working on Worklight Portal integration work and has showcased some demos and sessions to Customers.



Stefan Hepper (shepper@us.ibm.com ), WCM Architect, IBM

Stefan Hepper is a WCM / Portal product architect and working on making portal and WCM an integrated user experience. Previous roles included being chief programmer for WebSphere Portal 6.1.5. and leading the Java Portlet Specifications JSR 168 and JSR 286. He is working in the portal area since 2001. Stefan is based in the IBM Silicon Valley Lab, USA.



12 February 2014

Introduction

This article describes how you can develop an IBM Worklight mobile application that displays web content from an IBM WebSphere Portal server. There are many reasons why you might want to deliver content to mobile devices via an explicit mobile application versus a more generic mobile-enabled web site, such as leveraging native device APIs or interacting with native device applications, such as the calendar. In such a case, you would still want to leverage all the advantages of a web content management system like IBM Web Content Manager, including the ability to version, review, and approve the content — not to mention re-use the same content for both the web site and the mobile application. This article describes a solution for displaying web content feeds from IBM Web Content Manager in a hybrid mobile application created with IBM Worklight.

Prerequisites

The solution described here uses:

  • IBM Websphere Portal V8.0
  • IBM Web Content Manager
  • IBM Worklight V6.0 or later. Before installing the Worklight environment, you must have this software installed properly and operational:
    • Eclipse 4.2.2
    • Android SDK 4.1.2 (API 16) on Eclipse
    • Oracle JRE 1.6.0 (required by Android SDK)

    The Worklight Server is installed as part of Eclipse. Depending on your environment, you might need to update eclipse.ini and change the port from 8080 to another value, such as 8085. The Worklight server automatically starts when you start Eclipse. You can update eclipse.ini file content with the -Dworklight_port set command.

See Resources for more information on setting up the Worklight development environment.


Solution overview

Building the solution described in this article involves these major steps:

  1. Expose the IBM Web Content Manager content as a feed.
  2. Create a Dojo-based hybrid mobile application using Worklight.
  3. Create a Worklight HTTP Adapter to fetch the IBM Web Content Manager feed content and unit test the same.
  4. Display feed data on a UI based on Dojo Mobile.
  5. Deploy and test the application.

Figure 1 depicts the flow of the sample application. The client application (on the mobile device) invokes a JavaScript™ procedure that internally calls the actual adapter on the Worklight Server. In turn, the adapter (based on JavaScript) calls the back end system (in this case, WebSphere Portal with the IBM Web Content Manager) to retrieve the feed. The feed that is retrieved (the result) is translated to JSON and is passed on to the client by the adapter to display using the UI. This solution enables you to centrally store and manage your HTML markup, images, and CSS files, and re-use them for your mobile applications.

Figure 1. Solution flow
Solution flow

Expose web content management content as a feed

Creating a feed source in IBM Web Content Manager involves performing these high level tasks:

  1. Select an appropriate site area as your feed source. The feed displays the content items in the site area you select.
  2. Create two text components, named CData Start and CData End. These components contain the following tags that enable rich text to display in your feeds: <![DATA[ and ]]>. You cannot add these tags to the menu component directly. For this reason, you create the text components with the tags and add the text components to the menu component. When you create the text components, you grant access to all users in the contributor role.
  3. Create a menu component that contains the XML for the feed. When you create the menu component, you grant access to all users in the user role.

To create feed sources in IBM Web Content Manager:

  1. Log in to WebSphere Portal as an administrator.
  2. Navigate to Applications > Content > Web Content Management and select the appropriate library (web content), as shown in Figure 2.
    Figure 2. Select web content library
    Select web content library

    Click to see larger image

    Figure 2. Select web content library

    Select web content library
  3. Create a new text component named CData Start (Figure 3):
    • Select New > Component > Text.
    • In the Name and Display title fields, enter CData Start.
    • In the Text Element field, enter <![CDATA[.
      Figure 3. Create text component
      Create text component
    • Select the Properties tab and expand the Access section. Locate the Contributor role, and select the all available users drop-down arrow next to the Grant Contributor Access button in the User Defined column. A menu listing all available users displays (Figure 4).
    • Select [all users] from the menu. All users display beneath the Grant Contributor Access button in the User Defined column.
      Figure 4. Grant users access
      Grant users access
    • Select Save and Close.
  4. Create a new text component named CData End (Figure 5).
    1. Select New > Component > Text.
    2. In the Name and Display title fields, enter CData End.
    3. In the Text Element field, enter ]]>.
      Figure 5. Create second text component
      Create second text component
    4. Select the Properties tab and expand the Access section. Locate the Contributor role and select the all available users drop-down arrow next to the Grant Contributor Access button in the User Defined column. A menu listing all available users displays (Figure 6).
    5. Select [all users] from the menu. All users display beneath the Grant Contributor Access button in the User Defined column.
      Figure 6. Grant users access
      Grant users access
    6. Select Save and Close.
  5. Create a new menu component for the feed source (Figure 7).
    1. Select New > Component > Menu.
    2. In the Name and Display title fields, enter an appropriate name to help you identify the feed source. For example, ATOM Feed Menu.
    3. In the Description field, enter an appropriate description. For example, A menu that creates an ATOM feed for an existing site area.
    4. In the Menu Criteria section select Exclude current content from results and Location.
    5. In Location, clear the following fields if they are selected: Include ancestors and Include descendants.
    6. In the Further options section, select Current content and Merge selected site areas with included site areas.
      Figure 7. Create menu component
      Create menu component
    7. Add the appropriate feed XML to these fields (Figure 8):
      • Header
      • Result design
      • Footer

      The listings below show the complete XML code for creating Atom feeds for IBM Web Content Manager.

      Figure 8. XML for Atom feeds
      XML for Atom feeds
    8. Select the Properties tab and expand the Access section. Locate the User role and select the all available users drop-down arrow next to the Grant Contributor Access button in the User Defined column. A menu listing all available users displays (Figure 9).
    9. Select [all users] from the menu. The [all users] option displays beneath the Grant Contributor Access button in the User Defined column.
      Figure 9. Grant users access
      Grant users access
  6. Click Save to save the menu component.
  7. To preview the feed, click Preview. Select the appropriate library, site, and site area. A list of content items in the site area displays (Figure 10).
    Figure 10. Content in the site area
    Content in the site area
  8. Select a content item in the site area and click OK. The feed displays in your browser (Figure 11).
    Figure 11. Feed as it appears in browser
    Feed as it appears in browser
  9. The format of the feed URL is:

    http://server_name:port_number/wps/wcm/connect/library_name/site_name/site_area?srv=cmpnt&source=library&cmpntname= menu_componentname/

    For example:

    http://<host>:<port>/wps/wcm/connect/web+content/articles?srv=cmpnt&cmpntname=ATOM+Feed+Menu&source=library

    In this example, “articles” is the site area (this is the default site area that comes with the product) and "ATOM+Feed+Menu" is the menu item that was created above.

  10. If the feed does not display correctly in your browser, then:
    1. Ensure the URL contains the full server name, not "localhost." For example:

      http://my.server.name:port_number/

      .
    2. Remove “my” from "myconnect" in the URL, so that anonymous users can access the feed.

Listings 1 through 3 show the XML for creating Atom feeds for IBM Web Content Manager.

Listing 1. XML for the Header field
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<feed xmlns="http://www.w3.org/2005/Atom">
  <title></title>
  <updated><HistoryCmpnt context="current" type="content" field="lastmodifieddate" 
	format="yyyy-MM-dd'T'hh:mm:ss'Z'"/></updated>
  <author> <name><Element context="current" type="content" key="Author"/>
	</name></author>
  <generator uri="http://www.ibm.com/software/lotus/products/webcontentmanagement">
	Lotus Web Content Management</generator>
Listing 2. Design for each menu search result
<entry>
    <title type="text"><IDCmpnt context="autoFill" type="content" field="title"/>
	</title>
    <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><Element context="autoFill" type="content" key="Contact"/></name>
    </author>
</entry>
Listing 3. XML for the Footer field
</feed>

This article assumes that webcontent is accessed by anonymous users. To set the anonymous user permission in the administration screen, navigate to Administration > Web Content Libraries > Set permissions Web Content (key icon next to the library) and add anonymous user role to User.


Create a Worklight project

To create a new Worklight project:

  1. In Eclipse, select File > New > Worklight Project (Figure 12).
    Figure 12. Create Worklight project
    Create Worklight project
  2. Select Hybrid Application, enter the name of the project (in this example, WorklightApp), and click Next (Figure 13).
    Figure 13. Select hybrid application
    Select hybrid application
  3. Select Add Dojo Toolkit option and click Finish (Figure 14). Dojo is selected here because the application is based on Dojo. You can select any other available JavaScript framework as well, such as JQuery or Sencha Touch.
    Figure 14. Select framework
    Select framework

Figure 15 shows the project you created.

Figure 15. Project created
Project created

Click to see larger image

Figure 15. Project created

Project created

Create the HTTP adapter

With a Worklight adapter, you can connect and fetch the data from various back end systems (such as a database, HTTP-based sources, IBM Cast Iron®, and so on). Here, you are using an HTTP-based adapter to connect to WebSphere Portal and read an IBM Web Content Manager feed. Worklight Adapters are server-side components that send the request to the back end, and the data received (XML/HTML markup) is converted into JSON format (if it is not already in JSON format). An XSLT file is also a part of the adapter framework that can be used to convert the incoming data into JSON format. Figure 16 shows the end-to-end flow.

Figure 16. Worklight Adapter flow
Worklight Adapter flow

The steps below show how to create a Worklight Adapter for reading an IBM Web Content Manager feed.

  1. Right-click on the adapter folder and select New > Worklight Adapter (Figure 17).
    Figure 17. Create new Worklight adapter
    Create new Worklight adapter

    Click to see larger image

    Figure 17. Create new Worklight adapter

    Create new Worklight adapter
  2. Select the Project name you just created and the Adapter type (HTTP Adapter), and enter the adapter name (Figure 18). Click Finish.
    Figure 18. Name adapter
    Name adapter

    These steps create the adapter files (JavaScript/XSL files) to be deployed on the Worklight Server. The files are mainly:

    • adapters/wcm/filtered.xsl: Converts the incoming feed to JSON format.
    • Adapter configuration XML: wcm.xml in this case; contains the port number, hostname, and procedure name of the back end portal system from where the feed needs to be retrieved.
    • Implementation file: adapters/wcm/wcm-impl.js in this case; contains the code for calls to the back end system.
  3. Change the procedure name in the wcm.xml and wcm-impl.js files to getContentsFiltered and getContents, and Save (optional). In this example, the default names are changed (Figure 19).
    Figure 19. Change procedure names
    Change procedure names

    Click to see larger image

    Figure 19. Change procedure names

    Change procedure names
  4. Open your adapter configuration file; in this case, wcm.xml file. Change the protocol domain and the port name of the wcm feed URL (Figure 20).
    Figure 20. Change protocol and port names
    Change protocol and port names

    Click to see larger image

    Figure 20. Change protocol and port names

    Change protocol and port names
  5. Open filtered.xsl (under adapter/wcm/). Copy the code in Listing 4 and replace the contents of filtered.xsl with this code (Figure 21). The filtered.xsl will parse the in coming wcm feed (XML) and convert the same to JSON.
    Listing 4. filtered.xsl
    <xsl:stylesheet version="1.0"
    	xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    	xmlns:a="http://www.w3.org/2005/Atom">   
    
    	<xsl:output method="text"/>
     
    		<xsl:template match="/">
    			{
    			'items': [
    			<xsl:apply-templates select="a:feed/a:entry"/>
    				]
    			}
    		</xsl:template>
     
    		<xsl:template match="a:feed/a:entry">
    			{
    			'title': '<xsl:value-of select="a:title"/>',
    			'pubDate': '<xsl:value-of select="a:updated"/>',
    			'description': '<xsl:value-of select="a:summary"/>',
    			'link': '<xsl:value-of select="a:id"/>'
    			},
    	</xsl:template>
      
    </xsl:stylesheet>
    Figure 21. New filtered.xml file
    New filtered.xml file

    Click to see larger image

    Figure 21. New filtered.xml file

    New filtered.xml file

Update client side HTML and JavaScript files

In this section, you will create a UI using the Dojo Mobile framework and update the client side JavaScript code for calling the adapter created in the previous section to read the feed and display the same on the UI.

  1. WorklightApp.html (under app\WorklightApp\common directory) is the index file for the sample application. Open the file and copy and replace it with the content of Listing 5. This code contains the Dojo library import statements and UI (dojox.mobile.View, dojox.mobile.ListItem) for displaying the feed contents and JavaScript files (WorklightApp.js) for reading the feed and populating the UI.

    The UI can be constructed by dragging and dropping widgets in the Dojo Mobile Widgets palette, shown in Figure 22.

    Listing 5. WorklightApp.html file
    <!DOCTYPE html> 
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<meta name="viewport" content="width=device-width, initial-scale=1, 
    			maximum-scale=1, user-scalable=no" />
    		<title>WorklightApp</title>
    		<link rel="shortcut icon" href="images/favicon.png" />
    		<link rel="stylesheet" href="css/reset.css" />
    		<link rel="stylesheet" href="css/WorklightApp.css" />
    				
    		<script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>
        	<script type="text/javascript" data-dojo-config="isDebug: false, async: true, 
    			parseOnLoad: true, mblHideAddressBar: false" src="dojo/dojo.js"></script>
    		<meta name="apple-mobile-web-app-capable" content="yes">
    	</head>
    	<body id="content" style="display: none">
    		
    		<div id="mainView" data-dojo-type="dojox.mobile.View">
    			  <h1 data-dojo-type="dojox.mobile.Heading">Feed</h1>
    			  <ul data-dojo-type="dojox.mobile.RoundRectList">
    			  <li data-dojo-type="dojox.mobile.ListItem" 
    				data-dojo-props="transition:'slide',dir:'1',
    				url:'wcm.feed.dojo.html'" 
    				onclick="loadWCMFeedsFiltered()" icon="images/feed.png">
    				Go To WCM Feed</li>
    			  </ul>
    		</div>
    
    		<!-- application UI goes here -->
    		<script src="js/initOptions.js"></script>
    		<script src="js/WorklightApp.js"></script>
    		<script src="js/messages.js"></script>
    		
    	</body>
    </html>
    Figure 22. Construct UI
    Construct UI

    Click to see larger image

    Figure 22. Construct UI

    Construct UI
  2. Create a new HTML file called wcm.feed.dojo.html (under app\WorklightApp\common directory) with the contents of Listing 6. This file gets invoked when a user clicks on the individual feed entries. The feed details are displayed on this page. The feed details can be images or text that is part of the feed.
    Listing 6. wcm.feed.dojo.html
    <div data-dojo-type="dojox.mobile.ScrollableView" id="wcmMainFeedView" selected="true" 
    style="overflow-x: hidden; overflow-y: hidden; top: 0px; visibility: visible">
    	<h1 data-dojo-type="dojox.mobile.Heading" back="Back" fixed="top" 
    		moveTo="mainView">WCM Feed</h1>
    	<ul id="wcmfeedList" dojoType="dojox.mobile.EdgeToEdgeList"></ul>
    </div>
    <div data-dojo-type="dojox.mobile.ScrollableView" id="wcmFeedDeatilView">
    	<h1 data-dojo-type="dojox.mobile.Heading" back="Back" fixed="top" 
    		moveTo="wcmMainFeedView">Feed Detail</h1>
    	<div id="wcmfeedDetail" class="feedDetail"></div>
    </div>
    Figure 23. Add feed to application
    Add feed to application

    Click to see larger image

    Figure 23. Add feed to application

    Add feed to application
  3. WorklightApp.js (under app\WorklightApp\common\js folder) is the client side JavaScript file and contains the application code that calls the adapter procedures that reside at the server to fetch the feed. This file also reads the response and constructs some part of the UI by reading the response. The wlCommonInit() function (Figure 24) is invoked automatically once the Worklight framework initialization finishes. Application specific code can be added inside this function; loadWCMFeedsFiltered() is the one that contains it.
    Figure 24. wlCommonInit() function
    wlCommonInit() function

    Click to see larger image

    Figure 24. wlCommonInit() function

    wlCommonInit() function

The listings below are application specific code that is part of loadWCMFeedsFiltered function. (This code is available in the download material included with this article.)

Listing 7 shows the procedure WL.Client.ivokeProcedure being invoked from the client to fetch the feed. The procedure will accept the adapter name and the IBM Web Content Manager feed URL. Change the IBM Web Content Manager feed URL as appropriate. See Expose web content management content as a feed

Listing 7. WL.Client.ivokeProcedure
var invocationData = {
                                adapter: "wcm",
                                procedure: "getContentsFiltered",
// change the url according to what you have created   
// Format: /wps/wcm/connect/library_name/site_name/site_area?srv=cmpnt&source=library
		&cmpntname= menu_componentname/   
      parameters: [' wps/wcm/connect/web+content/Articles?srv=cmpnt&cmpntname=Articles+
		List&source=library']
};
                                                                                
WL.Client.invokeProcedure(invocationData, {
                                onSuccess: lang.hitch(this, loadFeedsOK), 
                                onFailure: lang.hitch(this, loadFeedsFAIL…
});

The code in Listing 8 loops through the individual items in the feed and displays the same at HTML dom node wcmfeedList.

Listing 8. Display feed
var feedList = registry.byId("wcmfeedList");

array.forEach(feeds, lang.hitch(this, function(feed,i) {
	var itemHtml = domConstruct.create("div", {innerHTML:
	"<div class='feedTitle' index='" + i + "'>" + feed.title + 
	"</div><div class='pubDate'>"+ feed.pubDate+"</div>"
	});

	var itemCfg = {icon:""};
	itemCfg["class"] = "mblVariableHeight";
	itemCfg.noArrow = false;
	itemCfg.rightIcon = "mblDomButtonBlueCircleArrow";
	var item = new dojox.mobile.ListItem(itemCfg, itemHtml);
	//Connect event
	on(item.domNode,"click",lang.hitch(this,this.displayFeed));
	feedList.addChild(item); 
	}), this);

The code in Listing 9 is invoked when the user clicks on any of the feed items. It displays the feed details for the item clicked. The information is attached to dom node wcmfeedDetail in wcm.feed.dojo.html.

Listing 9. Display feed item details
displayFeed = function(evt) {

var prog = dojox.mobile.ProgressIndicator.getInstance();
dom.byId("wcmMainFeedView").appendChild(prog.domNode);
prog.start();

var q = query("div[index]",evt.currentTarget);
	console.log("Query: "+q);
var selectedIndex = domAttr.get(q[0],"index");

var feedDetail = feeds[selectedIndex].description;	
	dom.byId("wcmfeedDetail").innerHTML = feedDetail;

	query("#wcmfeedDetail a").forEach(function(node, index, nodelist){
			domAttr.set(node, "target","_blank");
	});
	var mainView = registry.byId("wcmMainFeedView");
	mainView.performTransition("wcmFeedDeatilView",1,"slide");

	prog.stop();

Deploy adapter and Worklight application

This section describes how you can deploy the adapter and Worklight application separately, and also how you can unit test just the adapter application.

  1. Right-click on the folder wcm under the adapter folder and select Run As > Deploy Worklight Adapter (Figure 25).
    Figure 25. Open wcm folder
    Open wcm folder

    Click to see larger image

    Figure 25. Open wcm folder

    Open wcm folder
  2. Unit test the adapter (Figure 26).
    Figure 26. Testing adapter
    Testing adapter

    Click to see larger image

    Figure 26. Testing adapter

    Testing adapter
  3. Right-click on the WorklightApp folder under apps and select Run As > Build All and Deploy to deploy the Worklight application (Figure 27).
    Figure 27. Run application
    Run application

    Click to see larger image

    Figure 27. Run application

    Run application
  4. Right-click on the Worklight project and select New > Worklight Environment to test a particular environment (Figure 28).
    Figure 28. Test different environment
    Test different environment

    Click to see larger image

    Figure 28. Test different environment

    Test different environment
  5. Select the relevant environments and click Finish. Repeat step 3 for building the application (Figure 29).
    Figure 29. Select environments to test
    Select environments to test

    Click to see larger image

    Figure 29. Select environments to test

    Select environments to test

Remember that you can view the deployment or build status for the adapter or the Worklight application in the console, as shown in Figure 30.

Figure 30. Build status in console
Build status in console

Click to see larger image

Figure 30. Build status in console

Build status in console

Testing

  1. Go to the Worklight console and click on the Android line (Figure 31).
    Figure 31. Select Android
    Select Android

    Click to see larger image

    Figure 31. Select Android

    Select Android
  2. You can add multiple devices using the Add device option (Figure 32).
    Figure 32. Select Android devices
    Select Android devices

    Click to see larger image

    Figure 32. Select Android devices

    Select Android devices
  3. To run the application on the Android simulator, right-click on the application and select Run As > Android Application (Figure 33). The running application in shown in Figure 34.
    Figure 33. Run Android app
    Run Android app

    Click to see larger image

    Figure 33. Run Android app

    Run Android app
    Figure 34. Android app running in simulator
    Android app running in simulator

To run the sample application included with this article:

  1. Download the sample project provided and import (existing project as workspace) into the Eclipse location where you have Worklight installed.
  2. Optionally (if dojoLib project is not in the workspace), create a new library project called dojoLib (required for the samples). Navigate to File > Properties > DojoToolkit > New Dojo Library, and name the library dojoLib. Click Finish.
  3. Right-click the Worklight project (app\WorklightWCMStoreApp) and select Build All.
  4. Run the Android application.

Conclusion

This article described how you can display web content, such as HTML markup, images, or CSS files that are stored and managed in the IBM Web Content Manager and delivered via IBM WebSphere Portal in a hybrid mobile application using IBM Worklight. Other articles in this series discuss solutions for leveraging web content fused into a mobile application, and look at leveraging native capabilities within your WebSphere Portal theme, configuring authentication between Worklight and WebSphere Portal, and augmenting your IBM Rational Application Developer and IBM Web Experience Factory portlets using Worklight.


Download

DescriptionNameSize
Sample projectWorklightApp.zip4.1 MB

Resources

Learn

Get products and technologies

Discuss

Comments

developerWorks: Sign in

Required fields are indicated with an asterisk (*).


Need an IBM ID?
Forgot your IBM ID?


Forgot your password?
Change your password

By clicking Submit, you agree to the developerWorks terms of use.

 


The first time you sign into developerWorks, a profile is created for you. Information in your profile (your name, country/region, and company name) is displayed to the public and will accompany any content you post, unless you opt to hide your company name. You may update your IBM account at any time.

All information submitted is secure.

Choose your display name



The first time you sign in to developerWorks, a profile is created for you, so you need to choose a display name. Your display name accompanies the content you post on developerWorks.

Please choose a display name between 3-31 characters. Your display name must be unique in the developerWorks community and should not be your email address for privacy reasons.

Required fields are indicated with an asterisk (*).

(Must be between 3 – 31 characters.)

By clicking Submit, you agree to the developerWorks terms of use.

 


All information submitted is secure.

Dig deeper into Mobile development on developerWorks


  • Bluemix Developers Community

    Get samples, articles, product docs, and community resources to help build, deploy, and manage your cloud apps.

  • Mobile weekly

    Innovations in tools and technologies for mobile development.

  • DevOps Services

    Software development in the cloud. Register today to create a project.

  • IBM evaluation software

    Evaluate IBM software and solutions, and transform challenges into opportunities.

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Mobile development, WebSphere
ArticleID=962013
ArticleTitle=Deliver an exceptional mobile web experience using WebSphere Portal and IBM Worklight, Part 6: Feed web content from IBM Web Content Manager to a Worklight mobile app
publish-date=02122014