Hướng dẫn đặt khung nhận xét của blog nằm cố định lên trên các nhận xét

Mặc định các nhận xét của người đọc và tác giả khi xuất bản luôn được đặt bên trên khung nhận xét, điều này hơi bất lợi nếu bài viết có nhiều nhận xét khi phải scroll chuột đến khung nhận xét. Tuy nhiên bạn có thể đặt khung nhận xét này nằm trên với thủ thuật đơn giản sau đây.

Các bước thực hiện:

Bước 1: Các bạn tìm <div class='comments-content'> thường thì nó sẽ nằm trong thẻ tag <b:includable id='threaded_comments' var='post'> với widget Blog1 version 1 và <b:includable id='threadedComments' var='post'> với widget Blog1 version 2

Các bạn chỉ cần để ý đến đoạn HTML như sau (hoặc tương tự):

<div class='comments-content'>

    <b:if cond='data:post.embedCommentForm'>

        <b:include data='post' name='threaded_comment_js' />

    </b:if>

    <div id='comment-holder'>

        <data:post.commentHtml />

    </div>

</div>

<p class='comment-footer'>

    <b:if cond='data:post.allowNewComments'>

        <b:include data='post' name='threaded-comment-form' />

        <b:else />

        <data:post.noNewCommentsText />

    </b:if>

</p>

Hình minh họa

Bước 2: Các bạn chỉ cần chú ý đoạn mình đánh dấu màu xanh và đỏ với màu xanh là phần nhận xét và màu đỏ là khung nhận xét, bây giờ bạn chỉ việc đưa màu đỏ lên trên màu xanh hay màu xanh xuống dưới màu đỏ là được.

Sau khi thay đổi thì nó sẽ có dạng như sau:

<p class='comment-footer'>

    <b:if cond='data:post.allowNewComments'>

        <b:include data='post' name='threaded-comment-form' />

        <b:else />

        <data:post.noNewCommentsText />

    </b:if>

</p>

<div class='comments-content'>

    <b:if cond='data:post.embedCommentForm'>

        <b:include data='post' name='threaded_comment_js' />

    </b:if>

    <div id='comment-holder'>

        <data:post.commentHtml />

    </div>

</div>

Hình minh họa

Bước 3: Fix lỗi cho các blog1 version 1 khi khung nhận xét lúc ở trên lúc ở dưới

Các bạn chỉ cần thay toàn bộ HTML của thẻ <b:includable id='threaded_comment_js' var='post'>

thành đoạn HTML phía dưới:

<script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
<b:template-script inline='true' name='threaded_comments'/>
<script type='text/javascript'>
blogger.widgets.blog.initThreadedComments(
<data:post.commentJso/>,
<data:post.commentMsgs/>,
<data:post.commentConfig/>);
</script>

Hình minh họa

Chúc các bạn thành công!

Nguồn: Việt BLogger