file comment.html.twig

Theme override to display a comment.

Available variables:

  • author: Comment author. Can be a link or plain text.
  • content: The content-related items for the comment display. Use {{ content }} to print them all, or print a subset such as {{ content.field_example }}. Use the following code to temporarily suppress the printing of a given child element:
  {{ content|without('field_example') }}
  
  • created: Formatted date and time for when the comment was created. Preprocess functions can reformat it by calling format_date() with the desired parameters on the 'comment.created' variable.
  • changed: Formatted date and time for when the comment was last changed. Preprocess functions can reformat it by calling format_date() with the desired parameters on the 'comment.changed' variable.
  • permalink: Comment permalink.
  • submitted: Submission information created from author and created during template_preprocess_comment().
  • user_picture: The comment author's profile picture.
  • status: Comment status. Possible values are: unpublished, published, or preview.
  • title: Comment title, linked to the comment.
  • attributes: HTML attributes for the containing element. The attributes.class may contain one or more of the following classes:

    • comment: The current template type; e.g., 'theming hook'.
    • by-anonymous: Comment by an unregistered user.
    • by-{entity-type}-author: Comment by the author of the parent entity, eg. by-node-author.
    • preview: When previewing a new or edited comment.

The following applies only to viewers who are registered users:

  • unpublished: An unpublished comment visible only to administrators.
  • title_prefix: Additional output populated by modules, intended to be displayed in front of the main title tag that appears in the template.
  • title_suffix: Additional output populated by modules, intended to be displayed after the main title tag that appears in the template.
  • content_attributes: List of classes for the styling of the comment content.
  • title_attributes: Same as attributes, except applied to the main title tag that appears in the template.
  • threaded: A flag indicating whether the comments are threaded or not.

These variables are provided to give context about the parent comment (if any):

  • comment_parent: Full parent comment entity (if any).
  • parent_author: Equivalent to author for the parent comment.
  • parent_created: Equivalent to created for the parent comment.
  • parent_changed: Equivalent to changed for the parent comment.
  • parent_title: Equivalent to title for the parent comment.
  • parent_permalink: Equivalent to permalink for the parent comment.
  • parent: A text string of parent comment submission information created from 'parent_author' and 'parent_created' during template_preprocess_comment(). This information is presented to help screen readers follow lengthy discussion threads. You can hide this from sighted users using the class visually-hidden.

These two variables are provided for context:

  • comment: Full comment object.
  • entity: Entity the comments are attached to.

File

templates/content/comment.html.twig
View source
  1. {#
  2. /**
  3. * @file
  4. * Theme override to display a comment.
  5. *
  6. * Available variables:
  7. * - author: Comment author. Can be a link or plain text.
  8. * - content: The content-related items for the comment display. Use
  9. * {{ content }} to print them all, or print a subset such as
  10. * {{ content.field_example }}. Use the following code to temporarily suppress
  11. * the printing of a given child element:
  12. * @code
  13. * {{ content|without('field_example') }}
  14. * @endcode
  15. * - created: Formatted date and time for when the comment was created.
  16. * Preprocess functions can reformat it by calling format_date() with the
  17. * desired parameters on the 'comment.created' variable.
  18. * - changed: Formatted date and time for when the comment was last changed.
  19. * Preprocess functions can reformat it by calling format_date() with the
  20. * desired parameters on the 'comment.changed' variable.
  21. * - permalink: Comment permalink.
  22. * - submitted: Submission information created from author and created
  23. * during template_preprocess_comment().
  24. * - user_picture: The comment author's profile picture.
  25. * - status: Comment status. Possible values are:
  26. * unpublished, published, or preview.
  27. * - title: Comment title, linked to the comment.
  28. * - attributes: HTML attributes for the containing element.
  29. * The attributes.class may contain one or more of the following classes:
  30. * - comment: The current template type; e.g., 'theming hook'.
  31. * - by-anonymous: Comment by an unregistered user.
  32. * - by-{entity-type}-author: Comment by the author of the parent entity,
  33. * eg. by-node-author.
  34. * - preview: When previewing a new or edited comment.
  35. * The following applies only to viewers who are registered users:
  36. * - unpublished: An unpublished comment visible only to administrators.
  37. *
  38. * - title_prefix: Additional output populated by modules, intended to be
  39. * displayed in front of the main title tag that appears in the template.
  40. * - title_suffix: Additional output populated by modules, intended to be
  41. * displayed after the main title tag that appears in the template.
  42. * - content_attributes: List of classes for the styling of the comment content.
  43. * - title_attributes: Same as attributes, except applied to the main title
  44. * tag that appears in the template.
  45. * - threaded: A flag indicating whether the comments are threaded or not.
  46. *
  47. * These variables are provided to give context about the parent comment (if
  48. * any):
  49. * - comment_parent: Full parent comment entity (if any).
  50. * - parent_author: Equivalent to author for the parent comment.
  51. * - parent_created: Equivalent to created for the parent comment.
  52. * - parent_changed: Equivalent to changed for the parent comment.
  53. * - parent_title: Equivalent to title for the parent comment.
  54. * - parent_permalink: Equivalent to permalink for the parent comment.
  55. * - parent: A text string of parent comment submission information created from
  56. * 'parent_author' and 'parent_created' during template_preprocess_comment().
  57. * This information is presented to help screen readers follow lengthy
  58. * discussion threads. You can hide this from sighted users using the class
  59. * visually-hidden.
  60. *
  61. * These two variables are provided for context:
  62. * - comment: Full comment object.
  63. * - entity: Entity the comments are attached to.
  64. *
  65. * @see template_preprocess_comment()
  66. * @see uikit_preprocess_comment()
  67. *
  68. * @ingroup uikit_themeable
  69. */
  70. #}
  71. {%
  72. set classes = [
  73. 'uk-comment',
  74. 'uk-visible-toggle',
  75. parent ? 'uk-comment-primary',
  76. ]
  77. %}
  78. <li>
  79. <article{{ attributes.addClass(classes) }}>
  80. <header class="uk-comment-header uk-position-relative">
  81. <div class="uk-grid-medium uk-flex-middle" uk-grid>
  82. {% if user_picture %}
  83. <div class="uk-width-auto">{{ user_picture }}</div>
  84. {% endif %}
  85. <div class="uk-width-expand">
  86. <h4 class="uk-comment-title uk-margin-remove">{{ title }} <span class="uk-text-muted uk-hidden-hover" uk-icon="link"></span></h4>
  87. <p class="uk-comment-meta uk-margin-remove-top">{{ submitted }}</p>
  88. {#
  89. Hide the "new" indicator by default, let a piece of JavaScript ask the
  90. server which comments are new for the user. Rendering the final "new"
  91. indicator here would break the render cache.
  92. #}
  93. <mark class="uk-badge uk-label uk-float-right uk-hidden hidden" data-comment-timestamp="{{ new_indicator_timestamp }}"></mark>
  94. </div>
  95. {#
  96. Indicate the semantic relationship between parent and child comments for
  97. accessibility. The list is difficult to navigate in a screen reader
  98. without this information.
  99. #}
  100. {% if parent %}
  101. <p class="visually-hidden">{{ parent }}</p>
  102. {% endif %}
  103. <span class="uk-hidden">{{ permalink }}</span>
  104. </div>
  105. <div class="uk-position-top-right uk-position-small uk-hidden-hover">
  106. {{ content.links }}
  107. </div>
  108. </header>
  109. <div{{ content_attributes.addClass('uk-comment-body') }}>
  110. {% if title %}
  111. {{ title_prefix }}
  112. <h3{{ title_attributes.addClass('uk-hidden') }}>{{ title }}</h3>
  113. {{ title_suffix }}
  114. {% endif %}
  115. {{ content|without('links') }}
  116. </div>
  117. </article>
  118. </li>

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.

Log in