For better understanding, it's advisable to refer to both this documentation and the accompanying demo application. The demo application can be included during the installation of the component

1. Install the latest component version

Check the OutSystems Forge for the Multiline Truncation with Ellipsis component and ensure that the latest version is installed in your environment. If it's not installed, proceed with the installation. This component doesn't have any additional dependencies. You can also download and install the demo application at this time.

2. Manage your dependencies

Add a desired dependency in your module from MultilineTruncationwithEllipsis module through manage dependencies and choose the MultilineEllipsis Block.

3. Using the MultilineEllipsis block

Simply add the component to your screen, add your text to the BodyText placeholder and it's done.

Fill the block parameters:

None of the inputs are mandatory.

• HideLink [Boolean] - If true the link is hidden even if the text exceeds the lines define in the ClampLines input. Default: False;
• Animation [Animations identifier] - Defines the animation. Options: "none","slow","medium","fast";
• NumvisibleLines [integer] - Defines the total number of displayed lines when collapsed. Default: 3;
• LinkTextExpanded [text] - Text to be displayed on the button when the body text is expanded. Default: “show less”;
• LinkTextCollapsed [text] - Text to be displayed on the button when the body text is collapsed. Default: “show more”;

ExtendedClass [text]: Add custom style classes to the pattern. You define your custom style classes in you application using CSS.

Notes:

• No styles applied by default.
• If the truncation isn't applied the link won't be displayed.