This page describes the function of a widgetset, widgetset types provided by Magnolia and how you can use a custom widgetset.
A Vaadin WidgetSet is a GWT module that ties together client side component implementations used by a particular Vaadin application. It is the part of the client side terminal that creates components from UIDL messages generated by the server side. (WidgetSet – Vaadin)
Things important to know about widgetsets:
In any GWT or Vaadin application, there can be only one widgetset. Since Magnolia’s admin UI is a Vaadin application, Magnolia can have only one widgetset. Therefore, it should inherit all the widgetsets you intend to use.
A custom widgetset for Magnolia must always inherit Magnolia’s default
info.magnolia.widgetset.MagnoliaWidgetSetor any other widgetset which inherits from it.
A widgetset must always be GWT-compiled before you run your Web application, and it has to be recompiled every time the client-side code changes or when you add a new Vaadin add-on.
For further information about Vaadin client-side development and ways to compile the widgetset, see the Book of Vaadin or the GWT project website.
Magnolia provides the following widgetsets:
|Identifier||Description||Provided by the module|
Default Magnolia widgetset for CE bundles
Default Magnolia widgetset for DX Core bundles
In contrast to
MagnoliaProWidgetSet contains the
client widget code for
and content editor
modules. If you do not rely on these modules, you can use
Setting the widgetset property
The widgetset you intend to use has to be defined per webapp with the
magnolia.ui.vaadin.widgetset property. Change the following entry in
For CE bundles:
For DX Core bundles:
Preconfigured Magnolia webapps and bundles typically already come with a proper widgetset configuration.
Using a custom widgetset
To add custom widgets or Vaadin addons to your Magnolia app, you need to provide a new widgetset. This means that you need to compile the new widgetset and configure Magnolia to use it.
Your custom widgetset must inherit from a Magnolia’s widgetset.
Once your widgetset has been compiled, tell Magnolia to use it by
magnolia.ui.vaadin.widgetset property accordingly. The
expected value is a widgetset-qualified name in the format that Vaadin
expects, without the
.gwt.xml extension, for example
A recommended setup
The default Magnolia Vaadin widgetset is extracted out of the Magnolia UI project to its own module.
This module is brought in as a dependency of the bundle.
There are two key reasons for doing that:
Any of our Magnolia modules may bring its own client-side code or additional Vaadin add-ons.
We isolate the resource-intensive GWT compilation to a dedicated maven module, hence no longer affecting build time and stability of the Java code base.
The resulting module only consists of two files: the widgetset.gwt.xml file and the Maven POM — with appropriate settings for the vaadin-maven-plugin.
What this means for your project is that you can leverage the exact same approach to integrate Magnolia’s default widgetset with your custom client-side widgets or Vaadin add-ons. This helps keep your dependencies and client-side code in the modules where they belong, while giving you more flexibility to integrate third-party modules along the way.