Addons

HOWTO: Add a New Widget to the Default Summary Layout - JSF UI

Updated: September 26, 2024

JSF UI Deprecation
This requires to have the JSF UI addon installed on your server that is deprecated since Nuxeo Platform LTS 2019.
Please refer to the Web UI documentation.

This how-to explains how to insert a new widget to the default Summary layout so that's displayed on all document Summary pages.

Make sure that the Nuxeo JSF UI target package is checked in your project's Application Definition to get all the needed features in Nuxeo Studio.

A widget type enables to display actions. It takes advantage of the fact that actions needing different kinds of rendering can now be mixed up even if they're using the same category. This widget type makes it possible to display a list of actions, but also to include some widget types rendering.

Since the default summary layout contains four widgets displaying actions, it is possible to pile up widgets in them. The available action categories are:

  • SUMMARY_PANEL_TOP to add widgets on top of default summary (takes the whole panel width, empty by default),
  • SUMMARY_PANEL_LEFT for left zone,
  • SUMMARY_PANEL_RIGHT for right zone,
  • SUMMARY_PANEL_BOTTOM for bottom zone (takes the whole panel width, empty by default).

Here is the definition of the widget referencing actions for the SUMMARY_TOP_LEFT category:

<extension target="org.nuxeo.ecm.platform.forms.layout.WebLayoutManager"
  point="widgets">

  <widget name="summary_panel_left" type="summary_current_document_custom_actions">
    <handlingLabels>true</handlingLabels>
    <labels>
      <label mode="any"></label>
    </labels>
    <properties widgetMode="any">
      <property name="category">SUMMARY_PANEL_LEFT</property>
      <property name="subStyleClass">summaryActions</property>
    </properties>
  </widget>

</extension>

Default widgets (presenting the document relations, status, publications, etc...) are contributed to one of these zones, with orders separated by 100 (check out the explorer to get a complete overview, beware that addons may contribute to these zones already).

Here is a sample contribution to add a widget to the left widget panel:

<extension target="org.nuxeo.ecm.platform.forms.layout.WebLayoutManager"
  point="widgets">

  <widget name="summary_note_text" type="richtext_with_mimetype">
    <fields>
      <field>note:note</field>
      <field>note:mime_type</field>
    </fields>
    <properties mode="view">
      <property name="translatedHtml">
        #{noteActions.translateImageLinks(field_0)}
      </property>
      <property name="cssClass">note_content_block</property>
    </properties>
  </widget>

</extension>

<extension target="org.nuxeo.ecm.platform.actions.ActionService"
  point="actions">

  <action id="summary_note_text" type="widget" order="100">
    <category>SUMMARY_PANEL_LEFT</category>
    <properties>
      <property name="widgetName">summary_note_text</property>
    </properties>
    <filter-id>hasNote</filter-id>
  </action>

</extension>

This contribution will add the widget named summary_note_text to the summary layout when current document is a note (see filter named hasNote). The action order will make it possible to change the order of appearance of this new widget in comparison to other "action widgets" defined in the same category.