Oracle WebCenter Portal – Dynamic Page Styles

Ok so… Moving to MuleSoft doesn’t mean I’ll stop writing about Oracle, at least not for now.

This post should help some of you that still have nightmares when you hear the word Page Style in WebCenter Portal.

The problem?

They are not difficult to build, as they can be considered like “Templates” but once they get assigned to a Page, if using a common approach, you can’t change modify a Page Style and reflect the change to an existing page, unless you RECREATE the page.



Build dynamic Page Styles, one of the most easiest ways of doing this is using “Declarative Components“.


If you want to know more about Declarative Components please have a look here:


I’ll describe this solution for both, WebCenter Portal Framework and WebCenter Portal.

WebCenter Portal Framework

  1. Create your portal Application
  2. Create a Declarative Component
  3. Create a Page Style
  4. Reference the Declarative Component in your Page Style
  5. Create a Page based on the Page Style
  6. Modify the Declarative Component and test.

Panel Splitter




Panel Tab




For now I’m just going to give you an example of how a Declarative Component might look like:

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="" version="2.1" xmlns:f="" xmlns:af="">
  <af:componentDef var="attrs" componentVar="component">
    <af:panelTabbed position="above" id="dc_pt1" styleClass="AFStretchWidth" dimensionsFrom="auto">
      <af:showDetailItem id="Left" text="Tab Label 1" disclosed="true">
        <af:panelGroupLayout id="dc_pgl2">
          <af:facetRef facetName="facetLeft"/>
      <af:showDetailItem id="Center" text="Tab Label 2">
        <af:panelGroupLayout layout="scroll" xmlns:af="" id="dc_pgl1">
          <af:facetRef facetName="facetCenter"/>
    <!--af:panelSplitter id="dc_ps1" styleClass="AFStretchWidth">
      <f:facet name="first"/>
      <f:facet name="second"/>
      <component xmlns="">
          <description>Left Facet</description>
          <description>Center Facet</description>
          <description>Right Facet</description>

Let’s check the important parts:

  • Facets are important as there I will hold Composer components.
  • In the code shown, I have commented a pannelSplitter and I display a pannelTab instead.
    • The example is mainly to show you that the Page Style can be modified from a pannelSplitter to a pannelTab without recreating the whole page.

Now the Page Style:

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="" version="2.1" xmlns:f="" xmlns:h="" xmlns:af="" xmlns:cust="" xmlns:pe="">
  < contentType="text/html;charset=UTF-8"/>
    <af:document id="d1">
      <af:form id="f1">
        <af:panelGroupLayout id="pgl1" styleClass="AFStretchWidth" layout="vertical">
          <pe:pageCustomizable id="hm_pgc1" inlineStyle="width:100%;">
            <cust:panelCustomizable id="hm_pnc1" layout="scroll">
              <af:panelGroupLayout id="panelGroupLayout1" layout="vertical" styleClass="AFStretchWidth">
                <af:declarativeComponent id="decps" viewId="/components/psLayoutComponent.jsff">
                  <f:facet name="facetLeft">
                    <cust:panelCustomizable id="a_pnc1" layout="scroll" showTabAction="true">
                      <af:outputText value="I'm Facet One" id="ot1"/>
                  <f:facet name="facetCenter">
                    <cust:panelCustomizable id="a_pnc2" layout="scroll" showTabAction="true">
                      <af:outputText value="I'm Facet Two" id="ot2"/>
                      <af:calendar id="c1"/>
            <f:facet name="editor">
              <pe:pageEditorPanel id="pep1"/>

What the Page Style does, is to reference the Declarative Component and inside the facets it includes the panelCustomizable component for Composer.

Create the Portal Resource for the Page Style and run your application, create a new page using the new Page Style, add something in run time using Composer, then just change the Declarative Component and test it again, your modification should be directly reflected to your page without rebuilding the whole thing, IMPORTANT, remember to leave the reference to the facets.

What’s different for WebCenter Portal?

Just how you publish this change:

  1. You can use a shared library
  2. You can use wlst (importMetadata)

This will import any change done to the Declarative Component.

If you want more information regarding importMetadata:

WebCenter Specific


What a great day…. WebCenter Portal 12c is out

I couldn’t wait to share this news, after some years waiting for this version and after being part of the Beta Program is great to announce that the official release of Oracle WebCenter Portal 12c (12.2.1) is out:


Why is this so important?:

  • This version is based on ADF12c meaning: JSF2, Jersey 2, Oracle REST.
  • Performance was improved, average response time: 1s
  • Page Draft Mode!!!!!!!!!!!!!!!
  • New Content Task flows.
  • Alta mobile UI
  • Native HTML5 tag support

More to come in following posts.

WebCenter Patch

I have been out for some time, but wanted to share the new WebCenter Release, I’ll create another post to provide a personal feedback.
WebCenter Portal
What’s New:
WebCenter Content

What’s New:

Change visibility of Resources – WebCenter Portal

The main idea of this post is to help you locate the  “generic-site-resources.xml” file and modify its content.

WebCenter Portal can handle resources in 2 different ways:




Creating a resource is a topic I will talk in a different post.  What I will like to share with you is how to change the visibility of  new resources in Design Time.

A good example is a Content Template, whenever you create a Content Template in Design Time, this resource by default gets a visibility to False, you can change this in runtime, but if you’re developing to test is a pain to change this property every time you lose your MDS.

Lets create a dummy content template:

2013-10-28_2121 2013-10-28_2124

By default with this settings you’re have your content template not visible. To make it visible you have 2 options:

  1. Run your Portal,
    A.-  Go to admin section then content presenter,
    B.-  Look for your template and make it visible.

    The problem with this solution is that as mentioned before you’ll lose all your changes if you are running the Portal locally and you’re erasing your MDS every time you run the Portal.


  2. Edit the generic-site-resources.xml file.
    Just look for your template, in my case “” look for the tag “<resource>”  and modify the visible property from FALSE  to TRUE.
2013-10-28_21272013-10-28_2127_001 2013-10-28_2129

WebCenter Portal Framework PS7 small details (404)

It’s difficult to look for things that are not posted already, I’m sure I’ll start duplicating some of them, but meanwhile, I would like to start with 1 of the differences on “WebCenter Portal  Framework Application“.

Create a WebCenter Portal  Framework Application:

New Application PS7

It might look like nothing has changed, but  if you look closer to the files that were created you’ll notice a small change:

New Structure

A new file “error404.jsp” under a “jsp” folder was created. One of the “bugs” that was happening for WebCenter Applications, was related to the problem of session expiring and getting redirected to a 404, this was because the navigation URL was only valid for authenticated users or for a specific role, example:

For PS7 this is being solved from the “error404.jsp” file OTTB, this is already added to the web.xml to be taken for 404 errors:

404 Code

Similar to what we had in the Filter, the first validation is to check if the user is logged in, otherwise he will be sent to the Login screen, if the user is logged in by default you’re sent to the 404 error but you can extend this if needed.

Create a free website or blog at

Up ↑

%d bloggers like this: