Cookie-based Content Personalization within WebSphere Portal and IBM Web Content Manager

I’ve worked on numerous demos recently in which a use case was required to display personalization-based capabilities outside the context or need of an authenticated user.  I’ve typically been demoing and talking to this capability by having a set of checkboxes on a page that are rendered via a WCM taxonomy component that maps to a WCM taxonomy and categories in which the content to be personalized can also be associated with.  I’ve also created a custom application object (i.e. using Rational Application Developer) following the Personalization APIs that does the content filtering given the selected taxonomy categor(ies).  To do this, I’ve also written JavaScript which takes the selected taxonomy categor(ies) and puts them in an HTTP cookie and are then accessible to the Personalization application object, which returns the selected values to the PZN engine. This customization also uses AJAX to retrieve the personalized WCM content when a checkbox is clicked so that a page refresh is not required. I’ve provided some screen shots below of a recent customized demo I’ve done recently including this logic:

Customized Personalization:
(before selection)
Customized Personalization:
(after selection)
PZN-customization-before PZN-customization-after
Please feel free to reach out if you have any interest in setting up similar logic or you would like to see any of the code used, there’s quite a bit of it between the WCM components (i.e. HTML, Personalization, Taxonomy, etc.), JavaScript and Personalization Application Objects…

Visibility of the View / Edit Mode link within WebSphere Portal based on Authorization

I recently had a customer who wanted to secure access to the Edit Mode within WebSphere Portal v8.0.  Out-of-the-box, WebSphere Portal makes this link accessible to All Authenticated Portal Users, and since how to secure this link via authorization rules is not documented anywhere (at least that I could find), I did some digging around.  After some time, I finally found the answer I was looking for in one of the theme’s module JSPs (projectMenu.jsp to be exact).  Within the JSP it showed that there is a boolean being set based on the WCM REST SERVICE virtual resource which tells whether or not to show this link.  To change this, simply go to Portal Administration > Resource Permissions > Virtual Resources > WCM REST SERVICE, and remove the All Authenticated Portal Users member from the User role.

IBM Web Content Manager Social Media Publisher

IBM WCM Social Media Publisher (which I will refer to as SMP throughout) allows you to post and view (social) statistics of WCM content in a number of social channels, namely Facebook, Twitter, LinkedIn and IBM Connections.  I figured I’d blog about and document the steps I took to get it working.  I doubt there is any difference based on what I will be discussing, but I figured it was worth mentioning that I used a beta version of SMP for WCM v8. Let’s get started…

After installing SMP, you will notice a new WCM Library (“Social Configuration”) was created during the installation. This library contains the necessary components that are used by SMP. Before we start creating the necessary SMP components, I would recommend going into the Credential Vault Administration (through Portal Administration) and create a vault slot for each social network that you plan on configuring so that they’re available when needed. To do this, I simply created new vault slots using the Default Credential Segment, and when doing so, name it accordingly, click the “Vault slot is shared” checkbox, and enter the social network credentials. I got a bit held up at this step, so it is worth mentioning that these credentials are NOT the same credentials you use to authenticate with the social network, rather, they’re typically referred to as API keys (or something of the sort), in which you typically have to go into the developers section of the social media site and create a site or page that is associated with your user id and there will be an API key and password for the site / page (click here to see the Facebook site I created for SMP testing, and “like” it while you’re at it!).  While in the Credential Vault Administration, also create an additional vault slot with the name “socialPostUser“, again using the Default Credential Segment, and as a shared vault slot, enter the user id and password of a WCM administrator (i.e. wpadmin – I document why this is required below). Once you have a Credential Vault Slot created for each of the social media sites that you would like to publish too, you can now create the configurations within the Social Configuration library added during the installation of SMP.

To create a Social Network Configuration document, go to the WCM authoring portlet and navigate to Social Configuration > Content > ConfigDocs and create a new content item using the Social Network Configuration authoring template.  Within the authoring template, first set the Name and Title of the configuration and the Site Domain (portal instance URL).  Next, choose the Social Network in which the configuration is related too along with the credential slot (configured above) associated with the social network being configured. A Connections server (URL) is also required if creating am IBM Connections social network configuration. Click the Authorize button and make sure the authorization was successful.  If so, you’ll see a list of inputs (which will differ depending on the social network) in which you’ll want to map an Element for each that tells SMP the associated authoring template field to use when posting to the associated social network.  To associate an authoring template, go to the Mapped Authoring Template(s) and select an authoring template.  Finally, you can also choose any other Additional Settings suggested within the Social Network Configuration authoring template.

The next step is another area in which I initially got stuck. As you recall, while creating the credential vault slots, I also suggested creating the “socialPostUser” vault slot. There is a custom workflow action within the Social Configuration WCM library that needs to be added to your workflow / stage in order to trigger the publishing of content to a social network.  This custom workflow action utilizes a credential vault with a name of socialPostUser (by default), hence the reason we created this vault slot above.  This valut slot can be named anything you wish, but again, by default, this is the vault slot name it looks for.  To change the name of the vault slot it looks for, the Social Configuration library also contains a Text Component (within Social Configuration > Components) named Global Settings Reference. This text component contains all of the configurable properties within SMP, you’ll see a property within this text component called “actions.post.credentialvault“, and this is where you would set the vault slot name of your choosing. Take a look at the other configurable properties while within this component and change any you wish while here (you’ll see by default, the entire text component is commented out, be sure to uncomment if you’re going to use this). Going back to the custom workflow action I mentioned, this step would only be required if you wanted content to be automatically published to a social network during a workflow stage change. For example, since I tested using the CTC, I went into the CTC Process Library > Workflow Items > Workflow Stages and within the Templated Publish Stage, I added the Social Configuration Library’s “Post to All” custom action to the Run on Entering Stage property.  This suggests that when a CTC content item that uses a SMP mapped authoring template is published, it will also publish the content to the configured social networks.  I will add that this is not the only way in which content can be published to a social network.  If you do not wish to automatically promote WCM content to a social network when it is published, ignore the step of adding the custom workflow stage to the workflow, and you’ll see when you go into a content item that was published using an SMP mapped authoring template, the content item will contain an element named Social Network Information that allows you to post to each of the individually configured social networks, including the ability to view analytics based information if this has also been configured.  Here is a screen shot of a content item containing the Social Network Information:
social-content
And here is a screen shot of this content published the the Facebook page I created: (the link is referenced above)
wcm-facebook

That is about all the configuration that I personally did to get SMP working. It works pretty well and demos even better. There are many more configurations possible and much more documentation within the Portal wiki that describes in further detail both the information that I’ve documented here as well as much more.  Finally, here is the link to the SMP documentation.

As always, feel free to reach out with any questions…

Community Pages in WebSphere Portal

Community pages are a great new feature within WebSphere Portal v8.x that allows you to bring the collaborative capabilities provided by IBM Connections into your WebSphere Portal environment.  The added benefit is that it allows you to add these collaborative capabilities in the context of other (portlet) applications, such as web content, forms, enterprise applications and/or any portlet application.  Once configured with IBM Connections, when creating a new Portal page, you have the option to associate that page with a Community within IBM Connections. After the page is created, when adding a Connections portlet to the page, it automatically recognizes the context of the Community (based on the Community association in which the page was created) and renders the appropriate Connections service-related content. The portlets currently available to be used with Community pages are the Activity Stream, Library, Profiles (i.e. members), Tags, Bookmarks, Forums, Blogs, Wikis and Activities.  You can also use social rendering portlets within a community page.

Here is a sample screen shot of a Community page from a recent demo I put together:

allstate-agent-community

Introduction to Responsive Web Design in WebSphere Portal

As a Technical Sales Specialist focusing on IBM’s Digital Experience portfolio, I often do WebSphere Portal and WCM demos.  With all the interest in mobility, mobile capabilities are one of the key features I love to demo!  Until recently, I would typically demo the Mobile Experience or mobile theme capabilities while showing a portlet or two, perhaps containing WCM content tailored for mobile device viewing. The introduction of responsive theme support in the latest version(s) of WebSphere Portal has made the mobile capabilities that much easier to demo while it also tends to get the audience engaged in the demo (at least in my experiences).  That’s not to say I no longer demo the Mobile Experience, but I now like the ability to demo both the Mobile Experience as well as the responsive design to show the breadth of capabilities (and the latest announcement of Worklight integration capabilties will only make this story that much better). When it was initially released for Portal v7, I used a demo based on the fictitious “Lotus Company” Portal, but the responsive theme could not be applied to just any Portal instance. Since the release of Portal v8, there is a beta release release of the (CTC) responsive theme that is said to be a part of the next release of the Content Template Catalog (v4). The flexibility of this (beta) release of the responsive design theme has been great in that it can be applied to the latest release of the CTC and then customized as I typically do for Portal and WCM demos. The customization that I usually do for a demo involves creating a new “style” (a single CSS file I use to override the standard Portal style classes) for the theme, add that style to the styles.json file in theme, and then apply that “style”. I’ve also had to make changes to one of the standard responsive theme CSS files (theme.css) in order for the media queries (the basis of how responsive design works) to be triggered on an orientation change of the iPad, which I typically use to demo mobile capabilities. I’ve also played around with some of CSS classes in the theme.css so that some of the page and column layouts display a little a bit better.  Feel free to reach out with questions around the details of any of the changes I’ve had to make.  In the meantime, here’s a quick look at a Portal instance with the beta responsive design theme and a couple of different styles I created for recent demos…

Landscape Orientation Portrait Orientation
(Notice the change to the navigation and page layout)