Hướng dẫn hiển thị lượt xem bài viết cho Blogger mới nhất 2023

Nếu bạn đang tìm kiếm cách thêm bộ đếm lượt xem bài viết cho Blogger thì bạn đã đến đúng nơi. Hôm nay trong bài viết này, mình sẽ Hướng dẫn hiển thị lượt xem bài viết cho Blogger mới nhất 2023.

Lượt xem bài viết có tác dụng gì?

Lượt xem bài viết là hiển thị số lượt xem trên các bài viết trên blog của các bạn. Và chắc chắn có lợi ích là làm cho khách biết bài viết nào đang được mọi người quan tâm nhiều nhất để họ biết rằng bài viết đó thực sự hữu ích cho họ.

Các bước để hiển thị số lượt xem bài viết

Chỉ có ba bước đơn giản để thêm bộ đếm lượt xem bài đăng trong blogger. Tất cả các bước được giải thích rất rõ ràng dưới đây. Vui lòng làm theo các bước một cách cẩn thận vì nếu có một lỗi nhỏ, bộ đếm lượt xem bài đăng sẽ không hoạt động.

Bước 1. Thêm jQuery & Font Awesome

Lưu ý: Đây là bước tùy chọn, nếu Font Awesome & jQuery đã được cài đặt trên blog của bạn thì đừng thêm các mã này vào blog của bạn. 

Tìm mã <head> trên blog của bạn và đặt mã sau ngay sau mã <head>

<!-- Jquery Library and Font Awesome CDN --> 
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'/> <link crossorigin='anonymous' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css' integrity='sha256-46qynGAkLSFpVbEBog43gvNhfrOj+BmwXdxFgVK/Kvc=' rel='stylesheet'/>

Bước 2. Thêm JavaScript

Bây giờ hãy tìm kiếm mã </body> và dán các mã sau lên trên nó.

<script type='text/javascript'> jQuery.getScript("//cdn.firebase.com/js/client/2.3.2/firebase.js").done(function(){$.each($(".post-view[data-id]"),function(e,a){var i=$(a).parent().find("#postviews").addClass("view-load"),t=new Firebase("https://post-view-st.firebaseio.com/pages/id/"+$(a).attr("data-id"));t.once("value",function(e){var o=e.val(),d=!1;null==o&amp;&amp;((o={}).value=0,o.url=window.location.href,o.id=$(a).attr("data-id"),d=!0),i.removeClass("view-load").text(o.value),o.value++,"/"!=window.location.pathname&amp;&amp;(d?t.set(o):t.child("value").set(o.value))})})}); </script>

Bước 3. Thêm mã HTML

Thêm các mã sau ở trên vào <data:post.body/>.

Có thể có nhiều hơn một mã <data:post.body/> trong mẫu, vì vậy hãy thử từng mã một và xem nó có hoạt động không.

<b:if cond='data:view.isPost'><span class='post-view' expr:data-id='data:post.id'><i class="fa fa-eye" aria-hidden="true"></i> <span class='view-load' id='postviews'><i class='fas fa-spinner fa-pulse faa-fast'/></span> Views</span></b:if>

Lời Kết

Trên đây là tất cả về việc thêm bộ đếm lượt xem bài đăng trong blogger mà hôm nay mình chia sẻ tới các bạn. Mình hy vọng bài viết này là rất hữu ích cho bạn. Nếu có điều gì đó không rõ ràng hoặc có bất kỳ câu hỏi nào hãy để lại bình luận bên dưới.

Bài viết thuộc www.vozshare.com

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *