WebCenter Spaces – steps to change the template and skin

April 22, 2014

By: Andreja Sambolec – Application Consultant

Create a new template and skin

If you want to change the default template and skin for your Spaces application, the first step is to create a new template and skin based on the OOTB template which looks similar to the design you want, and apply them to the Spaces application.

In our example we want to have the menu on the top of the page so we created a new template based on the ‘WebCenter Spaces Top Navigation’ template.

 

You can create a new template and skin from the ‘Resources’ tab (Administration-> Spaces-> select Space and select ‘Edit space’).

You can apply your new template and skin using the General tab:

skins1

The default menu looks like this:

skins2

We want to have something like this:

skins3

And this is how the drop-down menu should look:

skins4

 Change the template

We need to change the template because the logo icon has to be on the left side of the menu.

The best way to find what has to be changed is:

  • Create a new portal or ADF application in jDeveloper
  • Create a new .jspx page
  • Copy the templates source code and paste to .jspx file

Now you can easy see the structure of the template and decide what to change.

  1. Using browser ‘Developer Tools’ you can find which component holds the menu:
    skins5
  2. Using jDeveloper you can see the <af:decorativeBox  id =‘db1’ > component  contains  the Global navigation menu and the logo. The component with id set to ‘pt_pgl4’ holds the Top navigation menu.
  3. We decided to replace decorativeBox component with panelGroupLayout component.
    1. Replace af:decorativeBox with af:panelGroupLayut
    2. Delete facet:center
    3. Set layout property for panelGroupLayout to ‘horizontal’
    4. Create two panelGroupLayout components inside of ‘db1’ to hold the logo icon and the menu
    5. Set layout to ‘vertical’ for the second panelGroupLayout
    6. Cut and paste <cust:panelCustomizable id=”pcust1″> inside of the first panelGroupLayout
    7. Cut and paste  <af:panelGroupLayout id=”gtbppgl3″> inside of the second panelGroupLayout
    8. Cut and paste  <af:panelGroupLayout id=”pt_pgl4″> inside of the second panelGroupLayout
    9. Delete the component with id ‘gtbppbl1’
      skins6

This is the result:
skins7

  1. Place the Search input box to the right side:
    1. Using Chrome Developer tool you can see that we need to change the component with id= ‘pcust2’  because this component holds the menu:
      skins8
    2. You will see that the task-flow is used for the search component and it’s placed as the first component inside of ‘pcust2 ‘ so we just need to move it to the last place:
      skins9

New order:
skins10

 

  1. Change Spaces logo using Spaces Settings tab
    skins12
  2. Search for ‘gtbrspmxi1’ component and change the width and the height property for af:image component to 74px and also change the source property to “#{WCPrepareImageURL[spaceContext.space[WCAppContext.currentScope.name].metadata.logo]['LOGO75']}”skins13

 

  1. Set the property ‘rendered’ to false for ‘gtbrspmxgl2’ (to hide the link next to logo icon)

The result:
skins14

Change the skin

Next we want to change the menus background color.

The background color for the global menu should be in white.

Steps to change:

  1. Using browser Developer Tool, check which style is used to apply this color

When we deselect the background image for .WCSiteTemplateBackground, .x1r4,

we don’t see the  background color  anymore  on the top of the page .
skins15

  1. So, open the source of your custom skin and add this:

.WCSiteTemplateBackground{

background-image:none;

}
skins16

When you are checking out the styles for some components, you will not see the name of the component but some code, for example, .x106 (the skin is compressed).

You can apply changes using those compressed names or if you know, for example, which component is used you can try with af|commandLink. You could also open the page fragment in jdeveloper and check which component and style class is used and use it in your skin to add changes.

 

Change the navigation model

We also want to add some new pages, so we are going to change the navigation model.

  1. Create a new one based on default one (you can check which model is currently used using the General tab when you are editing your spaces app)
    skins17
  2. Edit your newly created navigation model (add links for your pages – you can create pages later and update Path for links)
    skins18
    skins19
    skins20
  1. Select custom navigation model as the default one for your spaces app
    skins21
    skins22We currently don’t see any sub-menus, so next we are going to change the menu component in our template.

 

Change the Top Menu

 

  1. Using the browser Developer Tool, you can see the menu is placed in the component with id  ‘T:spcNavPanel’.

Search for this component in your template file and you can see a region (task-flow) is used to display the menu.

We are going to replace this region with this code (loop through the navigation model and its children):

  <div class=menu>

    <c:set var=”navNodes”    value=”${navigationContext.defaultNavigationModel.listModel['startNode=/, includeStartNode=false']}” scope=”session”/>

    <ul id=topnav>

      <c:forEach var=”menu” varStatus=”vs” items=”${navNodes}”>

        <li><a href=“/webcenter${menu.goLinkPrettyUrl}”> ${menu.title}</a>

           <c:if test=”${not empty menu.children}”>

             <div class=“submenu”><table width=100%><tr><td>

                <ol class=“blocks-four-up”>

                <c:forEach var=”child” items=”#{menu.children}”>

                 <li>

<p><a href=“/webcenter${child.goLinkPrettyUrl}”>

${child.title}

</a></p>

                 <c:if test=”${not empty child.children}”>

                 <ol>

                 <forEach var=”child1″ items=”#{child.children}”>

                 <li><a href=/webcenter${child1.goLinkPrettyUrl}”>

${child1.title}

</a></li>

                 </c:forEach>

                 </ol>

                 </c:if>

                 </li>

                 </c:forEach>

                 </ol>

              </td></tr></table></div>

            </c:if>

         </li>

      </c:forEach>

    </ul>

  </div>

 

You can find the meaning of EL expressions related to Navigation in this   document:

http://docs.oracle.com/cd/E23943_01/webcenter.1111/e10148/jpsdg_app_els.htm#CHDCBJGJ

 

 

  1. Add this to your skin:

 

.menu ul#topnav{

margin-top: 18px;

padding: 0;

float: left;

width: 880px;

position: absolute;

list-style: none;

position: relative;

font-size: 1.2em;

background:url(http://1-ps.googleusercontent.com/h/www.htmldrive.net/edit_media/2010/201007/20100728/Horizontal%20Subnav/images/xtopnav_s.gif.pagespeed.ic.v1mnjAEAt5.webp) repeat-x;

}

.menu ul#topnav li .submenu{  

padding: 15px 0;

position: absolute;

left: 0; top:35px;

display: none;

width: 760px;

background: #282828;;

color: #fff;

z-index:1;

-moz-border-radius-bottomright: 5px;

-khtml-border-radius-bottomright: 5px;

-webkit-border-bottom-right-radius: 5px;

-moz-border-radius-bottomleft: 5px;

-khtml-border-radius-bottomleft: 5px;

-webkit-border-bottom-left-radius: 5px;

}

.menu ul#topnav li{

float: left;

list-style: none;

}

.menu ul#topnav li:hover.submenu{

display:block;

}

.menu ul#topnav li a {

padding: 10px 15px;

display: block;

text-decoration: none;

color: #f0f0f0;

}

.menu.blocks-four-up{

list-style: none;

position:relative:;

}

.menu.blocks-four-up>li {

float: left;

width: 25%;

}

.menu#topnav.blocks-four-up>li ol li{

float: none;

}

.menu ul#topnav li .submenu a {

padding: 10px 0;

display: inline;

color: #f0f0f0;

text-decoration: none;

}

 

  1. To display four (4) submenus in one row, we have to use nth-child selector. If we include the selector in our skin file it’s not going to work, so we can just add it to the template:

<af:resource type=”css”>

.blocks-four-up>li:nth-child(4n+1)

{clear:left;}

</af:resource>

The result:
skins23

 

Next, we want to display the ‘More Info’ menu at the bottom.

How do we know which menu we are going to use as a bottom menu?  We can add some attribute (menuType) to the menu using the navigation model:

skins24

Change the template :

<c:forEach var=”child” items=”#{menu.children}”>

<li>

<c:if test=”${child.attributes.menuType != ‘bottom’}”>

    <p>

    <a href=/webcenter${child.goLinkPrettyUrl}>${child.title}</a>

    </p>

<c:if test=”${not empty child.children}”>

<ol>

    <c:forEach var=”child1″ items=”#{child.children}”>

    <li>

    <a href=/webcenter${child1.goLinkPrettyUrl}>

    ${child1.title}</a>

    </li>

    </c:forEach>

</ol>

</c:if>

</c:if>

<c:if test=”${child.attributes.menuType == ‘bottom’}”>

    <c:set var=”bottomMenu” value=”${child}” scope=”session”/>

</c:if>

</li>

</c:forEach>

</ol>

<p class=“menu_bottom_title”>

 ${bottomMenu.title}

</p>

<ul class=“menu_botom_links”>

<c:forEach var=”child1″ items=”#{bottomMenu.children}”>

    <li>

    <a href=“/webcenter${child1.goLinkPrettyUrl}”>

    ${child1.title}</a>

    </li>

</c:forEach>

</ul>

 

Add/change this to the skin:

.menu ul#topnav li  .submenu.menu_bottom_title{

clear: both;

margin: 0 8px .5em 12px;

padding: .75em 27px 0;

border-top: 1px solid #5e5f62;

font-weight: normal;

font-size: 1.230769em;

line-height: 1.125;

}

.menu.blocks-four-up>li ol{

-webkit-padding-start: 0;

}

.menu.blocks-four-up>li {

float: left;

width: 25%;

padding-bottom: 5px;

}

skins25

Using the same directions, we are going to add some images on the right side of the menu:

  • Create a new link and add attribute ‘menuType’ with value set to ‘image’.
  • Add attribute ‘imageUrl’ with the value which points to your image:
    skins26

Change your template (apply changes related to image in red color):

<td width=85%><ol class=blocks-four-up>

<c:forEach var=”child” items=”#{menu.children}”>

    <li>

    <c:if test=”${ child.attributes.menuType != ‘bottom’ &amp;&amp; child.attributes.menuType != ‘image’}”>

        <p><a href=/webcenter${child.goLinkPrettyUrl}> ${child.title}</a></p>

    <c:if test=”${not empty child.children}”>

    <ol>

    <c:forEach var=”child1″ items=”#{child.children}”>

        <li>

        <a href=/webcenter${child1.goLinkPrettyUrl}> ${child1.title}</a>

        </li>

    </c:forEach>

    </ol>

    </c:if>

    </c:if>

    <c:if test=”${child.attributes.menuType == ‘bottom’}”>

        <c:set var=”bottomMenu” value=”${child}” scope=”session”/>

    </c:if>

    <c:if test=”${child.attributes.menuType == ‘image’}”>

        <c:set var=”linkimage” value=”${child.attributes.imageUrl}” scope=”session”/>

    </c:if>

    </li>

    </c:forEach>

    </ol>

    <p class=menu_bottom_title> ${bottomMenu.title} </p>

    <ul class=menu_botom_links>

    <c:forEach var=”child1″ items=”#{bottomMenu.children}”>

        <li>

        <a href=/webcenter${child1.goLinkPrettyUrl}> ${child1.title}</a>

        </li>

    </c:forEach>

    </ul>

</td>

<td width=“15%” valign=“top”><img src=“${linkimage}”/></td> 

 

 

Finally, we want the submenu to cover the entire page.

To do this:

  1. Create a new div container as child of ‘pt_pgl5’ component:

<af:panelGroupLayout id=”pt_pgl5″ layout=”vertical” styleClass=”WCSiteTemplateBackground”>

            <div id=submenu/>

<af:panelGroupLayout id=”pt_pbl1″ layout=”vertical” inlineStyle=”width:#{attrs.templateFixedWidth}px;margin:0px auto;padding-top:8px;”>

 

We are going to clone the submenu in a mouse over action with this container.

  1. Add javascript to the template:

<af:resource type=“javascript>

function showSubmenu(e){

var childrens = e.parentNode.children;

var  len = childrens.length;

document.getElementById(submenu).innerHTML =;

for (i = 0; i &lt; len; i++) {

if(childrens[i].className==submenu){

newNode=childrens[i].cloneNode(true);

document.getElementById(submenu).appendChild(newNode);

}

}}

</af:resource>

 

  1. Add onMouseOver event to the link

<a href=/webcenter${menu.goLinkPrettyUrl}     onmouseover=showSubmenu(this)>

 

  1. Add this to css:

.menu ul#topnav li:hover.submenu{

display:none;

}

div#submenu.blocks-four-up>li ol li{

float: none;

}

div#submenu.blocks-four-up>li {

float: left;

width: 25%;

padding-bottom: 5px;

}

div#submenu.blocks-four-up{

list-style: none;

position:relative:;

}

div#submenu.blocks-four-up>li ol{

-webkit-padding-start: 0;

}

div#submenu.menu_bottom_title{

clear: both;

margin: 0 8px .5em 12px;

padding: .75em 27px 0;

border-top: 1px solid #5e5f62;

font-weight: normal;

font-size: 1.230769em;

line-height: 1.125;

}

div#submenu div{

padding: 15px 0;

position: relative;

left: 0;

width:1000px;

display: block;

background: #282828;

color: #fff;

margin: 0 auto;

 

}

 

div#submenu  {

width:100%;

top: 90px;

position: absolute;

z-index: 3;

background: #282828;

}

 

div#submenu li{

margin-bottom: .3076923em;

}

 

div#submenu p a{

font-weight:bold

}

 

div#submenu p {

margin-bottom: 3px;

}

div#submenu a{

padding: 10px 0;

display: inline;

color: #f0f0f0;

text-decoration: none;

}

 

div#submenu div>ol {

min-height: 109px;

list-style: none;

}

div#submenu div>ol ol {

padding:0px;

list-style: none;}

div#submenu div>table tr td ol ol {

padding:0px;

list-style: none;

}

skins28

You also need to add an event to clear the container when exiting from the submenu.

Those are the basic steps to change the template and skin of your Portal application.

Using a browser Developer Tool enables you to discover which component has to be changed or what to change in your skin.

 

Any questions? Feel free to contact us.

 

 


Connect with TEAM at Collaborate14 in Las Vegas

April 1, 2014

Las Vegas, NV – Venetian and Sands Expo Center

April 7th – April 11th

Want to learn how to deliver enterprise video inside WebCenter Portal and retain ownership of your content?

Want to learn how to utilize the digital asset management power of WebCenter Content with ATG Web Commerce?

Want to find low-cost, fast ROI implementations of WebCenter solutions?

Resolve all the questions you have about Oracle WebCenter and Enterprise Content Management by joining TEAM at  Collaborate 2014 in Las Vegas, NV. April 7th-11th. Stop by our booth #1348 on Main Street for our product demonstrations, talk with our WebCenter Experts, and be sure to catch our customer presentation from Faribault Foods:

 

Session: 724 

Title: Solving Enterprise Content Management for Small Business: Faribault Foods

Time: Wed, Apr 09, 2014 (02:00 PM – 03:00 PM)  

Level 3, San Polo 3502

 

For scheduled times and locations look here.

Collaborate 2014

April 7th-11th

Venetian and Sands Expo Center

Las Vegas, NV

Set up a time to speak with members of TEAM at Collaborate.

 


WebCenter CK Editor Customization – WebCenter Portal

February 18, 2014

By: Andreja Sambolec – Application Consultant

For creating new blogs or wikis, the WebCenter CK Editor (text editor) is used. Using CK Editor we have options to edit text, add tables, embed images and videos…

In this demonstration we are going to embed video.

You can edit the HTML and add the <iframe> component, but it will be deleted after saving changes or switching between tabs.

To avoid this, we customized the task-flow which contains this editor.

The page fragment we changed is
oracle.webcenter.doclib.view.jsf.taskflow.richTextEditor.editHTML.jsff.

We figured that the problem is caused by the converter added to <rte:editor> component so we deleted it (No other problems arise because of those changes):

<rte:editor id=”rte value=”#{pageFlowScope.rte.HTMLTextArea}”
converter=”#{pageFlowScope.rte.HTMLConverter}” />

Next we wanted to have an icon for embedding videos to enhance and simplify the user experience.

embedvideo

When a user clicks on the icon a list of videos will be displayed inside of a dialog box:

ckeditor

When a user clicks on the OK button, the video should be added as part of the iframe in the editor.

The Tag Library used for this component is rte-taglib.jar, we need change this library.

Changed files are:

  • ckeditor.js (add new plugin)

j.video={init:function(m){m.addCommand(‘video’, new a.dialogCommand(‘video’));m.ui.addButton(‘Video’,{label:m.lang.video,icon:this.path+’images/video_qualifier.png’,command:’video’});a.dialog.add(‘video’, this.path + ‘dialogs/video.js’);}};j.add(‘video’, j.video);

  • config.js (declare a new plugin):

config.extraPlugins = ‘wclinkexist,wclinknew,wcimage,video,snippet,tools’; config.toolbar_WC = [ …. ['WCLinkExist','WCLinkNew','WCImage','Video','-'], …. ];

  • Lang/en.js (new labels for the video plugin)

…..

video : ‘Embed Video’,

videodialog :

{

title                   : ‘Select video’,

},

……

To display the video dialog, we created a new plugin and added it to the plugins folder

(META-INF\adf\oracle\webcenter\doclib\rte\jsLibs\ckeditor\plugins\video).

‘video’ folder contains two subfolders: ‘images’ folder (contains icon image to open the dialog  box) and ‘dialog’ folder (contains dialog.js file with logic to display videos and create <iframe>  in the editor when closing the dialog box)

Now to add some content inside of the dialog box and pass some value to the editor, you can check the source of other plugins as help (I used the Colordialog plugin).

This is the code snippet to add <iframe> in the editor when the user clicks on the OK button:

var dialog = this,

data = {},

iframe = c.createElement( ‘iframe’ ),

div = c.createElement(‘div’);

obj.commitContent( data );

div.setAttribute(‘class’, ‘video’);

iframe.setAttribute( ‘src’, ‘urlValue’);

iframe.setAttribute( ‘width’, ’620′ );

iframe.setAttribute( ‘width’, ’349′ );

iframe.setAttribute( ‘frameborder’, ’0′);

iframe.appendTo(div);

a.insertElement(div);

This was done in WebCenter Portal 11.1.1.8 but is compatible with 11.1.1.7 and 11.1.1.6., as well.

If you have any questions, or would like to talk to someone from TEAM, contact us!


TEAM integrates ATG/Endeca with WebCenter Content – For the best commerce experience

February 5, 2014

 

 

To schedule a personal demonstration – contact us!


Secure content makes the world go ’round

January 29, 2014

By: Korey Berg  - Marketing Coordinator

(originally published on the Oracle WebCenter Blog)

Secure content makes the world go ‘round. Research documents, schematics, patent drawings, business plans, human resource documents, etc. are constantly being passed between contributors and owners. This sensitive information could fall into the wrong hands if mishandled or transferred insecurely, compromising employees and employers. To protect these types of content, Oracle offered the application Information Rights Management.

Information Rights Management (IRM) was an Oracle Fusion Middleware application that controlled access to important, private documents and emails through encryption allowing rights access across an organization. Though it served its purpose admirably, the IRM offering was really just a secure application through which material was viewed on the client end – it didn’t handle any distribution from the repository to the client. Now, with Oracle’s sun-setting of IRM, there is a gap to be filled for the secure distribution of content.

With Secure Content Publisher for WebCenter Content, TEAM is providing a solution integrated with an ECM repository for secure content distribution and a multi-platform interface through which to view it. We’ve partnered with Qumu (formerly Rimage), a leader in secure content distribution, and developed a synthesis between the distribution stream and the WebCenter Content repository.

The Secure Content Publisher offering is composed of 3 pieces: content management, rights management and secure distribution. The pieces integrate as follows:

secure content publisher workflow

  • Items are managed in WebCenter Content
    • Establish contributor security, digital asset management processes and content workflows for approval.
  • Once released in WebCenter Content, material can be published to the distribution portal
    • Content is encrypted before it is transferred to the portal by the publisher application.
  • Once in the portal, access is provided, configured, and revoked on a user-by-user basis
    • Access policies can be configured based on date ranges, number of views, viewing periods or prerequisites.
  • Based on access rights and invitations, users download the secure content viewing software for Mac, Windows, iOS or Android, which provides access to the content “channels” set up for  various streams of information.

Watch this video to learn more and to view a demonstration.

For a personal demonstration, or to start enabling your business to share content securely, contact us today!


WebCenter Portal – Access to WC Spaces Services over REST running on Oracle VM from your Mobile Application

December 18, 2013

By: Andreja Sambolec – Application Consultant

Developing ADF Mobile application – accessing WC services running on VM

If you are using the Oracle SOA Suite/BPM Suite VirtualBox Appliance (Pre-Built Developer VM for Oracle VM VirtualBox) and want to start developing an ADF Mobile application accessing WC Spaces REST services running on this VM, you have to make sure:

  • Your mobile device and local machine have access to the same wireless network
  • NAT is selected as the available network mode on your VM

portal1

  • To check Port Forwarding

potral2

Now you can access WebCenter Spaces from your mobile device or from your local machine using IP address of your local machine: http://192.168.1.33:8888/rest/api/resourceIndex

In your ADF Mobile application, create a new connection:

portal3

If you want use programmatic approach for Spaces REST Service invocation, use the following:

RestServiceAdapter restServiceAdapter = Model.createRestServiceAdapter();
restServiceAdapter.clearRequestProperties();
restServiceAdapter.setConnectionName(“WCRest”);
restServiceAdapter.setRequestType(RestServiceAdapter.REQUEST_TYPE_GET);
String theUsername = “weblogic”;
String thePassword = “welcome1″;
String userPassword = theUsername + “:” + thePassword;
String encoding = new sun.misc.BASE64Encoder().encode(userPassword.getBytes());
restServiceAdapter.addRequestProperty(“Authorization”, “Basic ” + encoding);
restServiceAdapter.addRequestProperty(“Accept”, “application/json; charset=UTF-8″);
restServiceAdapter.addRequestProperty(“Content-Type”, “application/json; charset=UTF-8″);

restServiceAdapter.setRetryLimit(0);

restServiceAdapter.setRequestURI(“/rest/api/resourceIndex”);

try {

System.out.println(restServiceAdapter.send(“”));

} catch (Exception e) {

e.printStackTrace();

}

Using ADB tool and command adb logcat, you can see the part of the response as a result of the command System.out.println(restServiceAdapter.send(“”)):

{“version”:”11.1.1.6.0″,”resourceType”:”urn:oracle:webcenter:
resourceindex”,”links”:[{“href”:”http://192.168.1.33:8888/rest/api/discussions/forums?utoken=FJnkGqA-W6YrfhjgagLvMj_AJapY_w**&#8221;,”template”:”http://192.168.1.33:8888/rest/api/discussions/forums?startIndex={startIndex}&itemsPerPage={itemsPerPage}&utoken=FJnkGqA-W6YrfhjgagLvMj_AJapY_w**”,”resourceType”:”urn:oracle:webcenter:discussions:forums”,”capabilities”:”urn:oracle:webcenter:read”},{“href”:”http://192.168.1.33:8888/rest/api/preferences/general?utoken=FJnkGqA-W6YrfhjgagLvMj_AJapY_w**&#8221;,”resourceType”:”urn:oracle:webcenter:preferences:general”,”capabilities”:”urn:oracle:webcenter:read”},{“href”:”http://192.168.1.33:8888/rest/api/spaces/siteresources?utoken=FJnkGqA-W6YrfhjgagLvMj_AJapY_w**&#8221;,”template”:”http://192.168.1.33:8888/rest/api/spaces/siteresources?projection={projection}&q={q}&utoken=FJnkGqA-W6YrfhjgagLvMj_AJapY_w**”,”resourceType”:”urn:oracle:webcenter:spaces:siteresources”,”capabilities”:”urn:oracle:webcenter:read”},{“href”:”http://192.168

After the above verification of access to WebCenter Spaces REST Services you can continue with development.

Running into trouble? Want to have a chat with members from TEAM? Contact us here.


DevOps and Content Management

December 11, 2013

By: Raoul Miller – Enterprise Architect

You may have been hearing a lot about DevOps recently and are wondering what it is and whether it’s something applicable to WebCenter or any other form of Content Management technology.

Like many other recent technology concepts, the actual definition is somewhat fluid but the name comes from the conjunction of development and operations.  The idea being that developers, testers and IT staff (operations) need to work much more closely together to accelerate release cycles and make the technical side of the business much more responsive to customer demands and changing markets. The Wikipedia page on DevOps gives some of the history of the concept and provides these helpful illustrations of what it entails:

figure1

Figure 1: DevOps within IT groups

figure 2Figure 2: Agile vs. Waterfall methodology and change cycles

As figure 2 shows, the main idea is that a DevOps approach to software development and management is a direct analog to the agile project approach – in that technical staff can be much more responsive and can lower overall project risk when making rapid small changes rather than infrequent major changes.  The key here is that agility and responsiveness (achieved through automation and aligning the different groups within IT) is a clear competitive advantage in the current dynamic and evolving business environment.  This is why so many large software companies are now using or testing this approach.

So far, so good – but how does this relate to Content Management and how is this different from what you have been doing for many years?  To answer the former, the goal of a Content Management team working in a DevOps setting is to make frequent changes to meet customer demands.  Obviously this must be done cautiously and professionally and within the bounds of the system.  Modifying the metadata and security models within a document management system is not something to be done lightly; while changing user profiles, adding new dropdown choices, updating the UI are all perfect candidates for rapid release cycles in response to user feedback.  A records management system (due to its strict audit controls and external compliance obligations) may gain less from a DevOps approach than a customer experience management system which needs to evolve rapidly to meet changing needs.  So, like so many useful concepts in our evolving world, IT professionals must choose which systems are best suited to the new approach and which tools and aspects of DevOps are suitable to be adopted by their teams and their business.

How is this different from what you’ve been doing? Looking at release and update cycles in a different way and on different time scales forces changes in standard operating procedures.  And this is one of the great advances.  Increased agility and increased pace of release has made the use of automated configuration and deployment tools much more prevalent.  WebCenter has always been scriptable and able to be installed using scripts for many years. But there are now a number of extremely useful tools that allow DevOps teams to manage these processes much more repeatedly and rapidly (essential for consistency between environments and successful loads).

Steve O’Grady of Redmonk wrote an excellent post last week on the relative popularity of the major configuration management tools.  Puppet and Chef are currently the leaders in the space with Ansible and Salt following closely behind and quickly catching up.  All four are open source platforms with enterprise editions and support available.  I’ve worked most directly with Puppet and Chef, and in both cases the additional features available to enterprise users are definitely worth the investment.  Detailed description of how and when to use these configuration management tools is beyond the scope of this post, but I encourage you to download and check out the various applications and versions and find one that works best for you:

There are links to the community versions of each application on the various company pages too.

IBM has a helpful landing page on the topic; regrettably Oracle seems to be a little behind the curve relative to IBM, although there was an article in the Oracle Architect magazine earlier in the year and some internal blog posters are getting up to speed.  Enterprise Manager / Grid Control, especially in 12c versions, does have some of the automation features discussed above, but is in no way a substitute for Puppet or Chef.

My interest in this area was piqued through the excellent writing of the various Redmonk staff and I highly recommend their blog posts and conferences. The applicability of these technologies to Oracle and WebCenter in particular was clearly illustrated by the work of Oracle ACE Edwin Biemond here, here and here.  He is clearly the expert in this field.

Have more questions? Want to have a chat with someone from TEAM? Contact us here.


Follow

Get every new post delivered to your Inbox.

Join 53 other followers