Knowledge Base
Published Jul. 2, 2025

How to create a fragment with a removable image

Written By

Ahmed Abdin

How To articles are not official guidelines or officially supported documentation. They are community-contributed content and may not always reflect the latest updates to Liferay DXP. We welcome your feedback to improve How To articles!

While we make every effort to ensure this Knowledge Base is accurate, it may not always reflect the most recent updates or official guidelines.We appreciate your understanding and encourage you to reach out with any feedback or concerns.

Issue

  • Is it possible to create a reusable fragment with different elements like the "Card Fragment" (headings, image, paragraph, button), but create it in such a way that there is a placeholder image that an end-user can change or remove? 

Environment

  • Liferay DXP 7.4

Resolution

  • While the default card fragment probides functionality to change an image, you cannot remove/hide the image completely. As such, you can pursue this functionality using Fragment Compositions.
  • If you create a composition with the following, you can replicate the card fragment with individual items that can be removed as needed: a surrounding container, an image, a heading text, a paragraph, and a link.
  • To create a composition: 
    • 1. Go to a content page and create the desired layout using Liferay's site builder tools. 
    • 2. Select the surrounding container's ellipsis menu and click Save as Composition. Please see attached video illustration: fragmentcomp.mp4
  • As an alternate solution, you can also implement a custom fragment to achieve this. Please see the attached "collections-20220919133540153.zip" of two customized fragments "testfrag1" and "testfrag2".
    • Please note that these are fragment samples that should be used carefully at your own discretion. Liferay Support is not compatible with customization cases.
 
Did this article resolve your issue ?

Knowledge Base