X

Best Practices from Oracle Development's A‑Team

Rendering native documents in Content Presenter

Introduction

One of the great features of WebCenter Content is the ability to convert many different formats of desktop publishing documents into HTML.  It uses the Dynamic Converter feature to convert native formats into very controlled HTML using well-defined conversion templates.  I've covered some creative ways to use this conversion before such as using the jQuery Data Table plug-in.

Main Article

Well, when using Content Presenter in WebCenter Spaces and Portal, it doesn't inherently use Dynamic Converter.  If you select a native document such as a Microsoft Word document, it will use one of the default templates such as the ‘Default View’ where it will display the document details and a link to download the document.

Default template view

And if you create a standard Content Presenter template, it’s only going to let you display the metadata for the document.  If it was a data file, it would know how to pull in the XML elements.  But with a native Word document, none of the content is going to come through.

So the way around this is to have a Content Presenter template that calls a Site Studio Region Template that is designed to do the dynamic conversion on the document.  The following are the steps to set this up.

In Site Studio Designer, create a Conversion Definition asset and add a conversion.

Conversion Definition

The conversion can be simple which is what I describe as a “best guess” type of conversion to HTML.  Or you can specifically pick a dynamic converter Rule that’s been established or you can pick the specific GUI and Layout templates to use.
Create a Region Definition.  The Region Definition does not need any elements.  It’s only needed so that the Region Template can be created.

Region Definition

Create a Region Template based on the Region Definition.  In the Region Template, add this code to use the Conversion Definition to do the dynamic conversion to HTML:

<!--$wcmDynamicConversion("Basic","conversionsDefinitionDocName=CD_MAIN")-->

Notice that the first parameter references the conversion name from our definition.  And the second parameter references the Content ID of our Conversion Definition.  Also make note of the Content ID of the Region Template.  That will be referenced in the next step.Because of an issue with translating the paths to images that may be in the native document and exported, client scripting can be used to resolve the correct paths.  This is what should be added below the dynamic conversion line:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type='text/javascript'> var baseUrl = '<!--$if isTrue(UseSSL)-->https://<!--$else-->http://<!--$endif--><!--$HttpServerAddress--><!--$HttpWebRoot-->'; <!--$finishPath=strSubstring(outputDirectory, strIndexOf(outputDirectory, 'weblayout')+10)--> var weblayoutPath<!--$targetdID--> = '<!--$finishPath-->'; $(window).load(function() { // Handler for .load() called. $('img[src*="<!--$targetdID-->"]').each(function(i) { var src = $(this).attr("src"); var totalLength = src.length; var imageFileName = src.substring(23,totalLength-3); $(this).attr("src", baseUrl + weblayoutPath<!--$targetdID--> + imageFileName); }); }); </script>


This script will loop through all of the img tags within the converted document and replace them with the proper URL to the converted image.

Region Template

Now in JDeveloper, create a WebCenter Portal application and create a Content Presenter template.   This is done by creating JSF Page Fragment.  Enter this for the code:<?xml version='1.0' encoding='UTF-8'?>

<jsp:root version="2.1" xmlns:jsp="http://java.sun.com/JSP/Page"             xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:cmf="http://xmlns.oracle.com/webcenter/content/faces" xmlns:f="http://java.sun.com/jsf/core"> <dt:contentTemplateDef var="node"> <af:panelGroupLayout layout="scroll" id="regionDefPanel" rendered="#{(not empty node.primaryProperty) }"> <dt:contentTemplate node="#{node}" id="docNameText" view="RT_NATIVE_DOCUMENT" regionTemplate="true"/> </af:panelGroupLayout> </dt:contentTemplateDef> </jsp:root>


Notice that the view parameter for dt:contentTemplate is set to the Content ID of the Region Template created in the step prior.  This will render the content using the Region Template.  You will also want to establish the Page Data Binding Definition in order to export the resource.

Content Presenter Template

Create a Portal Resource from in.  For the Content Repository Name and Content Type, leave these as wildcards.  If you try to associate these to the Region Definition, Content Presenter will assume the file is a data file and not work correctly.

Export portal resource

Export the template as a portal resource.

Export Resource

In WebCenter's Administration -> Resources, import as a Content Presenter resource.  Then set it to be Shown.

Resources Shown

Now when you Browse to your native document in Content Presenter, you can select the ‘NativeDocument’ template for display.

Select Template

That's it.  Now when you page is rendered, you should now see the HTML version of your document displayed in your Content Presenter taskflow.

Final Conversion

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