X

Best Practices from Oracle Development's A‑Team

WebCenter Navigation triggered from UCM Content

Introduction

There are number of posts out there explaining how to consume and display content from UCM in WebCenter Portal Framework or Spaces Application. This post deals with how to navigate from your UCM Data File to another WebCenter page.

Main Article

While migrating from Site Studio based website to Webcenter Portal (Content Presenter) based one you can reuse your Element and Region Definitions. However the links within the content pointing to another WebCenter page needs to be modified to conform to WebCenter standards, namely: Pretty Url and ADF Control State retention.
Unfortunately, currently there is no migration path to take your existing navigation structure from UCM to WebCenter Portal. You’ll have to review your UCM Navigation Model and manually create corresponding WebCenter Navigation model, splitting it into many navigation models according to your security needs.

Design Time (WebCenter Portal Framework)

To showcase the solution I created a small sample application with only 2 pages, named BlogSample. The first one is the Home page with an UCM data file displayed through Content Presenter. This data file has a link to Page 2.

Sample Application (Region Template, Content Presenter)

The first step is to open the default-navigation-model.xml file in JDeveloper and create an ExternalId url attribute in the page you want to navigate to. In our case it’s Page 2.

webcenter_navigation_triggered_from_ucm_1

I’ll name it page2.

webcenter_navigation_triggered_from_ucm_2

Just to clarify I have the region definition and region template info below.

Region Definition

webcenter_navigation_triggered_from_ucm_3

Title and Content are a plain text and wysiwyg element types respectively.

Region Template

<div> <div><!--$wcmElement("TITLE")--></div> <div><!--$wcmElement("CONTENT")--></div> </div>

Now add the link to Page 2 on the data file. Open Oracle Content Server and select the data file content information. From Content Actions, click on Edit Data File.

webcenter_navigation_triggered_from_ucm_4

The Site Studio Contributor window will pop up. I’ll select the Go to Page 2 and create a link.

webcenter_navigation_triggered_from_ucm_5

Notice that $wcUrl(‘ExternalId’) is how we link our contributor data file to Page 2 on WebCenter Portal app. In this case we have $wcUrl(‘page2’).

webcenter_navigation_triggered_from_ucm_6

Moving back to JDeveloper, we’ll drop the data file from our UCM connection into panelCustomizable in home.jspx, then select Content Presenter to render it.

webcenter_navigation_triggered_from_ucm_7

Once the Edit Task Flow Binding window pops up, you’ll see the datasource attribute already populated, where MyContentServer is the name of our UCM connection and DF_BLOG is the dDocName of our data file. Next, we’ll inform who the region template is in the templateView attribute, and put the true value for the regionTemplate attribute.

webcenter_navigation_triggered_from_ucm_8

Runtime (WebCenter Spaces & Portal)

Spaces already provide an ExternalId property when editing a Navigation item, which makes our lives a little bit easier.

webcenter_navigation_triggered_from_ucm_9

Regarding navigation inside the same UCM data file, there’s no need to change anything in your code. Content Presenter is smart enough to identify that you are making reference to another data file.

Shortcut to invoke Site Studio Contributor

There is a shortcut to invoke Site Studio Contributor from inside WebCenter. As you might know Ctrl + Shift + F5 invokes the Contributor in a Site Studio website, in WebCenter it’s Ctrl + Shift + C. Once you invoke the shortcut you should see a dotted blue line around your Content Presenter.

webcenter_navigation_triggered_from_ucm_10

Notice the toolbar on the top left. The edit button (pencil) invokes Site Studio Contributor window.

webcenter_navigation_triggered_from_ucm_11

To get back to your normal window, just press Ctrl +Shift + C again.
Another interesting shortcut is Ctrl +Shift + E. It takes you to the Editing Page mode.

webcenter_navigation_triggered_from_ucm_12

You can download the sample app BlogSample. Remember to change the UCM connection to your own Content Server and to recreate the region template, region definition and data files.

Be the first to comment

Comments ( 0 )
Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.Captcha

Recent Content