Composing and Migrating Fragments

So far, you’ve learned about about creating fragments and configuring them to dynamically render content on pages. As Clarity builds familiarity with Liferay’s out-of-the-box fragments and develops their own, they need a strategy for managing these components efficiently. This includes quickly saving and reusing compositions, as well as easily migrating their custom fragments and compositions between sites and environments. Fortunately, Liferay supports both of these requirements.

Creating Reusable Compositions

One of the most powerful characteristics of Liferay fragments is the ability to combine them into complex compositions. You can then save these compositions and reuse them like any other fragment. This significantly reduces manual labor and empowers users to build complex page elements without writing code.

Compositions begin with a container fragment. Then, you can add, configure, and arrange any fragment you want inside that container. Once finished, you can save the container’s contents as a cohesive, reusable composition. This structured approach provides the framework for designing complex page layouts efficiently.

Alternatively, you could attempt to build an entire page as a single, custom fragment. However, this would result in unwieldy HTML, CSS, and JavaScript, requiring specialized developer intervention for maintenance. Furthermore, such a monolithic fragment would lack reusability beyond its initial page.

Effective page design beings with identifying the most basic components you need for building your page. Then, you should create individual fragments for each of these components, if an OOTB option doesn't already exist. Next, you should assemble these fragments into your preferred layout and save any layouts you plan to reuse as compositions.

With this design philosophy, you can reuse your basic fragments and compositions on other pages in your site. It also ensures your fragments are more maintainable and accessible, so that non-technical designers can take an intuitive drag-and-drop approach to page design.

Migrating Fragments Between Sites

In addition to composing fragments for reusability within a site, Liferay provides import and export capabilities for migrating fragments between sites. In the fragments UI, your components are organized into fragment sets according to their usage or functionality. You can export individual fragments or fragment sets as ZIP files, which can then be imported into different sites in your Liferay instance.

It is possible to share fragments among all your sites by adding them to the global site. However, as stated in Module 2, this approach is not recommended because fragments cannot be restricted from a given site without removing them from the global site entirely. Make use of the import and export features to share your fragments and fragment sets securely between sites.

Conclusion

Composition is the foundational framework for designing fragments and building pages in Liferay. Leveraging compositions makes your design workflows more efficient and more sustainable by encouraging the reuse of components. You can fully maximize reusability by using platform native import and export features to migrate fragments between sites.

Next, you’ll help Clarity further enhance their Contact Us page by importing a new fragment.