Reply Forms
Meerkat supports nested replies with optional depth limits.
#Server-rendered replies
Each comment in {{ meerkat:comments }} has a recursive children collection.
To render a thread recursively:
1{{ meerkat:comments }}
2 {{ partial:comment }}
3{{ /meerkat:comments }}
1<s-meerkat:comments>
2 @include('partials.comment')
3</s-meerkat:comments>
Then in the partial (comment.antlers.html or comment.blade.php):
1<article id="comment-{{ id }}">
2 <strong>{{ author_name }}</strong>
3 <div>{{ comment_html }}</div>
4
5 {{ if has_replies }}
6 <div class="replies">
7 {{ children }}
8 {{ partial:comment }}
9 {{ /children }}
10 </div>
11 {{ /if }}
12</article>
1<article id="comment-{{ $id }}">
2 <strong>{{ $author_name }}</strong>
3 <div>{!! $comment_html !!}</div>
4
5 @if (count($children ?? []))
6 <div class="replies">
7 @foreach ($children as $child)
8 @include('partials.comment', $child)
9 @endforeach
10 </div>
11 @endif
12</article>
#Linking to a reply form
#One reply form for the page
Render the form once at the bottom of the thread. Link Reply buttons with a query string that fills the ids field:
1{{ meerkat:comments }}
2 <article id="comment-{{ id }}">
3 <div>{{ comment_html }}</div>
4 <a href="?reply_to={{ id }}#comment-form">Reply</a>
5 </article>
6{{ /meerkat:comments }}
7
8<div id="comment-form">
9 {{ meerkat:form }}
10 <input type="hidden" name="ids" value="{{ get:reply_to | default:'' }}">
11 ...
12 {{ /meerkat:form }}
13</div>
1<s-meerkat:comments>
2 <article id="comment-{{ $id }}">
3 <div>{!! $comment_html !!}</div>
4 <a href="?reply_to={{ $id }}#comment-form">Reply</a>
5 </article>
6</s-meerkat:comments>
7
8<div id="comment-form">
9 <s-meerkat:form>
10 <input type="hidden" name="ids" value="{{ request('reply_to', '') }}">
11 ...
12 </s-meerkat:form>
13</div>
#JavaScript inline replies
Meerkat includes an optional replies.js bundle that clones the main form after a user selects a comment. Enable it with {{ meerkat:replies_to }}; no asset publishing is required:
1{{ meerkat:replies_to }}
2
3{{ meerkat:comments }}
4 <article id="comment-{{ id }}">
5 <div>{{ comment_html }}</div>
6 <a href="#" data-meerkat-form="reply" data-meerkat-reply-to="{{ id }}">Reply</a>
7 </article>
8{{ /meerkat:comments }}
9
10{{ meerkat:form }}
11 ...
12{{ /meerkat:form }}
1<s-meerkat:replies_to />
2
3<s-meerkat:comments>
4 <article id="comment-{{ $id }}">
5 <div>{!! $comment_html !!}</div>
6 <a href="#" data-meerkat-form="reply" data-meerkat-reply-to="{{ $id }}">Reply</a>
7 </article>
8</s-meerkat:comments>
9
10<s-meerkat:form>
11 ...
12</s-meerkat:form>
The script:
- Opens a cloned form beside the selected reply control.
- Sets
idsto the parent comment ID. - Closes the form from an element with
data-meerkat-form="cancel-reply".
To use a different template for the reply form than the main form, mark a separate form with data-meerkat-form="comment-reply-form":
1{{ meerkat:form }}
2 ...
3{{ /meerkat:form }}
4
5<div style="display:none">
6 {{ meerkat:form data-meerkat-form="comment-reply-form" }}
7 ...
8 {{ /meerkat:form }}
9</div>
1<s-meerkat:form>
2 ...
3</s-meerkat:form>
4
5<div style="display:none">
6 <s-meerkat:form data-meerkat-form="comment-reply-form">
7 ...
8 </s-meerkat:form>
9</div>
#Threading depth
Set the maximum reply depth with config('meerkat.publishing.max_reply_depth'). For example, 3 permits three reply levels below a top-level comment. Set null or 0 for unlimited depth.
Meerkat enforces the limit for:
- Front-end submissions
- Control Panel replies
current_user.can_reply
Use can_reply to hide reply controls at the depth limit:
1{{ meerkat:comments }}
2 ...
3 {{ if current_user:can_reply }}
4 <a href="?reply_to={{ id }}">Reply</a>
5 {{ else }}
6 <a href="?root={{ id }}">View this conversation →</a>
7 {{ /if }}
8{{ /meerkat:comments }}
1<s-meerkat:comments>
2 ...
3 @if ($current_user['can_reply'])
4 <a href="?reply_to={{ $id }}">Reply</a>
5 @else
6 <a href="?root={{ $id }}">View this conversation →</a>
7 @endif
8</s-meerkat:comments>
#Display order of replies
The order_by parameter sorts root comments only. Direct replies remain in chronological order.
The /children/{parent_id} API endpoint uses the same oldest-first order.
#Paginate long reply threads
Paginate large reply trees through the public API:
1GET /api/meerkat/threads/{thread_id}/children/{parent_id}?per_page=10
See API endpoints: children for response and pagination details.