comment.html.twig in Drupal 10

Default theme implementation for comments.

Available variables:

• author: (optional) 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: (optional) Formatted date and time for when the comment was created. Preprocess functions can reformat it by calling DateFormatter::format() with the desired parameters on the 'comment.created' variable.
• changed: (optional) Formatted date and time for when the comment was last changed. Preprocess functions can reformat it by calling DateFormatter::format() with the desired parameters on the 'comment.changed' variable.
• permalink: Comment permalink.
• submitted: (optional) Submission information created from author and created during template_preprocess_comment().
• user_picture: (optional) The comment author's profile picture.
• status: Comment status. Possible values are: unpublished, published, or preview.
• title: (optional) 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; for instance, '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, optional):

• parent_comment: 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.
• commented_entity: Entity the comments are attached to.

See also

template_preprocess_comment()

File

core/modules/comment/templates/comment.html.twig

{#
/**
 * @file
 * Default theme implementation for comments.
 *
 * Available variables:
 * - author: (optional) 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:
 *   @code
 *   {{ content|without('field_example') }}
 *   @endcode
 * - created: (optional) Formatted date and time for when the comment was
 *   created. Preprocess functions can reformat it by calling
 *   DateFormatter::format() with the desired parameters on the
 *   'comment.created' variable.
 * - changed: (optional) Formatted date and time for when the comment was last
 *   changed. Preprocess functions can reformat it by calling
 *   DateFormatter::format() with the desired parameters on the
 *   'comment.changed' variable.
 * - permalink: Comment permalink.
 * - submitted: (optional) Submission information created from author and
 *   created during template_preprocess_comment().
 * - user_picture: (optional) The comment author's profile picture.
 * - status: Comment status. Possible values are:
 *   unpublished, published, or preview.
 * - title: (optional) 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; for instance, '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, optional):
 * - parent_comment: 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.
 * - commented_entity: Entity the comments are attached to.
 *
 * @see template_preprocess_comment()
 *
 * @ingroup themeable
 */
#}

<article{{ attributes.addClass('js-comment') }}>
  {#
    Hide the "new" indicator by default, let a piece of JavaScript ask the
    server which comments are new for the user. Rendering the final "new"
    indicator here would break the render cache.
  #}
  <mark class="hidden" data-comment-timestamp="{{ new_indicator_timestamp }}"></mark>

  {% if submitted %}
    <footer>
      {{ user_picture }}
      <p>{{ submitted }}</p>

      {#
        Indicate the semantic relationship between parent and child comments for
        accessibility. The list is difficult to navigate in a screen reader
        without this information.
      #}
      {% if parent %}
        <p class="visually-hidden">{{ parent }}</p>
      {% endif %}

      {{ permalink }}
    </footer>
  {% endif %}

  <div{{ content_attributes }}>
    {% if title %}
      {{ title_prefix }}
      <h3{{ title_attributes }}>{{ title }}</h3>
      {{ title_suffix }}
    {% endif %}
    {{ content }}
  </div>
</article>

Related topics

Theme system overview

Functions and templates for the user interface that themes can override.