Custom comment fields are rendered in the comment/comment-fragment.html file. You can only customize the appearance of comment fields when comments are saved in the project. Comment fields are rendered in the following code block:

<div th:if="${comment.customization}" class="comment-customization-fields">
    <div th:each="field : ${comment.customization.fields}"
        class="comment-field-chip">
       <b th:utext="${commentsDisplayUtils.escapeXml(field.name, '
', '<br>')}"></b>
       <b th:if="${field.showValue}" th:text="':'"></b>
       <span th:if="${field.showValue}" th:utext="${commentsDisplayUtils.escapeXml(field.value, '
', '<br>')}"></span>
    </div>
</div>

Hiding custom comment fields

You can hide custom comment fields in the exported document.

To hide custom comment fields

1. Open the <template_folder>/comment/comment-fragment.html file.
2. Find the custom comment field code block and remove it from the template.

Example of changing the appearance of custom comment fields

Let’s assume that you want to change the current appearance of custom comment fields in the exported document from chips to a simple HTML list.

To change the appearance of custom comment fields

1. Open the <template_folder>/comment/comment-fragment.html file.

2. Find the custom comment field code block and change it as displayed below:

   <ul th:if="${comment.customization}" class="comment-customization-fields"> <li th:each="field : ${comment.customization.fields}"> <b th:utext="${commentsDisplayUtils.escapeXml(field.name, ' ', '<br>')}"></b> <b th:if="${field.showValue}" th:text="':'"></b> <span th:if="${field.showValue}" th:utext="${commentsDisplayUtils.escapeXml(field.value, ' ', '<br>')}"></span> </li> </ul>

   
   

Changing the color of the custom comment field chip

You can change the default color of custom comment fields

To change the color of custom comment fields

1. Open the <template_folder>/comment/styles.html file.

2. Find the style tag with th:fragment="CommentStyles", locate the main-thread-comment div.comment-field-chip tag within, and change the property background-color: #336699; to any other desired color code:

   <style th:fragment="CommentStyles"> table.main-thread-comment div.comment-field-chip { background-color: #336699; … } … </style>