Truncate Display Text
When customizing Discovery Search templates, there may be times when the content you want to display is too long to display.
For example, suppose you performed a text extraction of an onboarding PDF document using Shinydocs Cognitive Toolkit. You wouldn’t want to display the entire page of text in the search result. Instead, you want to truncate or trim the text for the result card template.
Discovery Search already does this in the default template for the fullText field, but you can truncate or trim the text for any custom field.
Open the Templates menu
Click Edit for the template you want to update
Add
data-truncate="n"(where n equals the number of characters you want to display) to the HTML tag of the field you want to trim[optional] Search for a document to preview the changes
Click Save changes
Example
If you have index fields that have a lot of text (for example, comments), with over 1249 characters, it would look like this:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id commodo metus, in elementum orci. Quisque arcu nunc, tincidunt ut est at, faucibus pharetra ligula. Aliquam aliquam urna felis, maximus euismod mi gravida a. Nam egestas varius pellentesque. Donec vitae ultrices lectus. Vivamus urna risus, auctor vel massa sed, efficitur maximus nulla. Pellentesque efficitur lacus eget tellus bibendum, consectetur lobortis magna fermentum. Praesent eu urna vel ligula ullamcorper tempor. Nam porttitor arcu eros, eu condimentum quam feugiat nec. Praesent egestas nibh non diam venenatis consectetur. Nulla sapien ante, fringilla in mattis ut, efficitur eget erat. Mauris purus dolor, tincidunt nec tincidunt ac, ullamcorper quis nisi.
Fusce ornare, risus et lobortis dictum, lacus justo porta enim, eget hendrerit elit velit nec urna. Praesent ultrices ante nibh, eget blandit risus volutpat ut. Morbi ut augue in massa pellentesque feugiat a sit amet ligula. Praesent pharetra ipsum vel consequat aliquet. Nulla fringilla, dolor eu vehicula venenatis, libero mauris bibendum nisi, eget placerat tortor erat ut nulla. Nunc congue turpis sit amet magna efficitur, at mattis sapien finibus. Integer interdum nisl quis augue condimentum eleifend.
With data-truncate, you can set the maximum characters to display. In this case, we’ve selected to trim the content to 300 characters.
<div class="result-preview text-wrap-row" data-truncate="300">{{result.Document.Source.comments}}</div>Result
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id commodo metus, in elementum orci. Quisque arcu nunc, tincidunt ut est at, faucibus pharetra ligula. Aliquam aliquam urna felis, maximus euismod mi gravida a. Nam egestas varius pellentesque. Donec vitae ultrices lectus. Vivamus u…