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