Creating a WebCenter Sites Custom Attribute Editor

Sometimes we want to simplify the process of uploading of images associated with assets in WebCenter Sites and the best way to do that is to use specialized editors. We can add brand new editors or we can customize existing out-of-the box editors. Let’s assume that we have an asset that represents a newspaper article in our asset we have a media attribute (an associated image). We want to provide a simpler way for an author to select and add a image for our article.

For that we will create a custom asset editor based on provided IMAGEPICKER.

An attribute editor asset is made up of an XML field that describe the widget it represents. We have a choice for the XML: we can upload an XML file or paste the content of attribute editor XML description into a text field.

In our XML we are specifying values for attributes of PRESENTATIONOBJECT  and IMAGEPICKER element. For the PRESENTATIONOBJECT NAME attribute we are using the name of our editor ”DemoCustomImagePicker” and for

IMAGEPICKER we have:

ASSETTYPENAME with value "Demo_M " is the name of asset type representing the image.

ATTRIBUTETYPENAME with value "Demo_A" is the name of the attribute type used in asset

ATTRIBUTENAME with the value "file" is the name of the attribute type instance representing the binary content.

Second, we have to provide the attribute type for which this editor is provided. We want to allow user to choose an asset (an image asset) so "asset" is selected in the Attribute Type list. 

We are using out-of-the-box IMAGEPICKER, so we don’t have to modify presentationobject.dtd file.

Next we associate the editor with an attribute, in our case with “associatedImage” attribute. We select from the drop-down list “Attribute Editor” our “DemoCustomImagePicker” and save the updated object.

We can test now the editor by editing an asset of type DemoArticle. If we click on the “Browse” button a list of images is displayed and we can drag and drop an image in our Associated Image field. A thumbnail version of the image in media asset “file” attribute is also displayed.