Community Post page
Community Post page
The Community Post page template is rendered when a user navigates to https://{yoursubdomain}.zendesk.com/hc/{locale}/community/posts/{post_id}.
Available properties
| Name | Type | Description |
|---|---|---|
| post | object | A post object |
| topic | object | A topic object |
| comment_sorters | array | An array of filter objects. Useful for sorting the comments. See Sorters below |
| current_comment_sorter | object | The filter object of the current comment sorter |
| comments | array | An array of comment objects |
| promoted_articles | array | An array of promoted article objects |
| ticket_forms | array | An array of ticket form objects |
| help_center | object | A help_center object that holds information and settings about the current help center |
| settings | object | A settings object with custom settings for the current theme |
| signed_in | boolean | Whether the user is logged in or not |
| featured_posts | array | An array of featured post objects |
| brand | object | A brand object representing the current brand |
| user | object | A user object representing the current user |
Available helpers
You can use the following helpers in this page template. You can also use any built-in helpers, global helpers, or global advanced helpers.
| Name | Description |
|---|---|
| breadcrumbs | Breadcrumbs for the Community Post page. See breadcrumbs helper |
| pagination | Pagination links. See pagination helper |
| share | Sharing elements. See share helper |
| subscribe | A link to follow or unfollow new comments in the post. See subscribe |
| comment_callout | Partial rendering of the actions necessary to comment |
Available forms
You can add the following form to the Community Post page template:
| Name | Description |
|---|---|
| comment | A form to send a new post comment |
Use the form helper to insert it. See Form Helper.
Available identifiers
The following identifiers are available in this page:
| Identifier | Form | Field(s) | Description |
|---|---|---|---|
| body | comment | textarea, wysiwyg | Identifies a text field for post comments (use wysiwyg for rich content) |
| official | comment | label, checkbox | Identifies a checkbox field to mark a comment as official |
Sorters
Iterating through the comment_sorters array of filter objects adds the following links to the page:
| Link text | Action |
|---|---|
| Date | Sorts by most recent comment creation time in descending order |
| Votes | Sorts by highest vote sum in descending order |
Official comments are always given the highest priority and shown at the top.
Example
<nav class="sub-nav">{{breadcrumbs}}{{search scoped=true}}</nav><header class="page-header"><span class="post-actions">{{post.actions}}{{#with post.ticket}}<a href="{{url}}" target="_zendesk_lotus" class="escalation-badge">#{{id}}</a>{{/with}}</span><span class="post-to-community">{{link 'new_post' role='button'}}</span></header><div class="main-column"><article class="post {{#if post.featured}} post-featured {{/if}} {{#if post.pinned}} post-pinned {{/if}}"><div class="post-vote vote">{{vote 'up' class='vote-up' selected_class='vote-voted'}}<span class="vote-sum">{{post.vote_sum}}</span>{{vote 'down' class='vote-down' selected_class='vote-voted'}}</div><div class="post-container"><div class="post-header"><h1 title="{{post.title}}">{{post.title}}</h1><div class="post-info"><div class="post-avatar {{#if post.author.agent}} post-avatar-agent {{/if}}"><img src="{{post.author.avatar_url}}" alt="Avatar" /></div><div class="post-meta"><strong class="post-author" title="{{post.author.name}}">{{#link 'user_profile' id=post.author.id}}{{post.author.name}}{{/link}}</strong><div class="post-published meta">{{date post.created_at}}</div></div><div class="post-status">{{#if post.status}}<span class="post-{{post.status_dasherized}}">{{post.status_name}}</span>{{/if}}</div><div class="post-follow">{{subscribe}}</div></div></div><div class="post-body markdown">{{post.details}}</div><div class="post-share">{{share}}</div></div></article><div class="comment-sorter">{{#each comment_sorters}}<a aria-selected="{{selected}}" href="{{url}}">{{name}}</a>{{/each}}</div><h4 class="comment-heading">{{t 'comments_count' count=post.comment_count}}</h4><ul id="comments" class="comment-list">{{#each comments}}<li id="{{anchor}}" class="comment">{{#if official}}<div class="comment-bookmark"></div>{{else}}<div class="comment-vote vote">{{vote 'up' class='vote-up' selected_class='vote-voted'}}<span class="vote-sum">{{vote_sum}}</span>{{vote 'down' class='vote-down' selected_class='vote-voted'}}</div>{{/if}}<div class="comment-avatar {{#if author.agent}} comment-avatar-agent {{/if}}"><img src="{{author.avatar_url}}" alt="Avatar" /></div><div class="comment-container"><header class="comment-header"><strong class="comment-author" title="{{author.name}}">{{#link "user_profile" id=author.id}}{{author.name}}{{/link}}</strong>{{date created_at class='comment-published'}}{{#if official}}<span class="comment-official">{{t 'official_comment'}}</span>{{/if}}{{#if pending}}<span class="comment-pending">{{t 'pending_approval'}}</span>{{/if}}</header><div class="comment-body markdown">{{body}}</div><footer class="comment-footer"><span class="comment-actions">{{#with ticket}}<a href="{{url}}" target="_zendesk_lotus" class="escalation-badge">#{{id}}</a>{{/with}}{{actions}}</span></footer></div></li>{{/each}}</ul>{{pagination}}<div>{{comment_callout}}</div>{{#form 'comment' class='comment-form'}}<div class="comment-vote"></div><div class="comment-avatar">{{user_avatar class='user-avatar'}}</div><div class="comment-container">{{wysiwyg 'body'}}<div class="comment-form-controls">{{checkbox 'official'}}{{label 'official'}}{{input type='submit'}}</div></div>{{/form}}</div>