Halo博客,评论插件可能不会显示的问题

编辑 / 发布于2025-08-09 / 更新于2025-08-09 / 阅读 1

问题

自己写的主题,发现某些文章评论插件消失了,这种情况都出现在文章内容较长的时候,评论插件的区域变成了下面的内容

<div id="comment-pos">
<div id="comment-content-halo-run-Post-1e6e7818-3d0d-4366-9613-562f03f35351"></div>
<script>
CommentWidget.init(
"#comment-content-halo-run-Post-1e6e7818-3d0d-4366-9613-562f03f35351",
{
group: "content.halo.run",
kind: "Post",
name: "1e6e7818-3d0d-4366-9613-562f03f35351",
size: 20,
replySize: 10,
withReplies: false,
withReplySize: 5,
useAvatarProvider: false,
avatarProvider: "gravatar",
avatarProviderMirror: "",
avatarPolicy: "anonymousUser",
captchaEnabled: false,
}
);
</script>
</div>

相对于正常的评论区域缺少了

<comment-widget></comment-widget>

原因及解决方法

如果评论元素的 height 或者 width 被挤压了成 0了,<comment-widget></comment-widget>就不会被添加了,所以文章长的页面可能出现这个问题。

可以给父元素设置一个最小 height 和 width ,后面就正常了

.comment-min-size{
    min-height: 10px;
    min-width: 10px;
}
<div id="comment-pos" class="comment-min-size" th:if="${haloCommentEnabled}" >
<halo-comment group="content.halo.run" 
kind="Post"
th:attr="name=${post.metadata.name}"
colorScheme="'light'"/>
</div>