Code hiển thị lượt xem bài viết đơn giản cho Blogspot

Thích Code | July 07, 2016 | Edit Post

Lướt web vô tình phát hiện được cách hiển thị số lượng xem bài viết hay hay, nên lấy về áp dụng cho Blogspot. Khách quan ban đầu test thì thấy load nhanh (chắc do lấy số liệu từ google - https://console.firebase.google.com/).

Lướt web vô tình phát hiện được cách hiển thị số lượng xem bài viết hay hay, nên lấy về áp dụng cho Blogspot. Khách quan ban đầu test thì thấy load nhanh (chắc do lấy số liệu từ google - https://console.firebase.google.com/).

Code hiển thị lượt xem bài viết đơn giản cho Blogspot

Chú ý: Chỉ nên dùng hiển thị số bài viết trong trang item, vì nếu bạn lạm dụng nhiều quá có thể gây tình trạng website load chậm.

HTML + CSS + JS
Code by ThichCode.NET

<b:if cond='data:blog.pageType == "item"'>
    <style>
        .viewers .loading {
            display: inline-block;
            width: 20px;
            height: 20px;
            background: transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgleuqfcQMF8BdcgfrCrs4tjxch9RPAziG_9lPMWkld_RLb3bHu0McuORIA7Nh_Lauk0I6RFToQcwlABSXdD4z2QTjduZMucdYzTd8ozkk14drm5tDNMBCRWPuX_7y0y9W2HyvE3V4PfoMM/s1600/loader.gif') no-repeat 0 0;
            vertical-align: middle
        }
    </style>
    
    
    <span class='viewers label-info' expr:id='data:post.id'> <span class='loading'></span> lượt xem</span>
      
    <script src='http://cdn.firebase.com/v0/firebase.js' type='text/javascript'></script>
    <script type='text/javascript'>
        //<![CDATA[
        // Hàm xử lý số lượt xem
        $(function() {
            var a = $(".viewers");
            a.each(function() {
                var n = $(this).attr("id"),
                    /*
                     đây là project đã được tạo sẵn, nếu bạn không thích thì 
                     tạo mới tại https://console.firebase.google.com/ 
                    */
                    e = new Firebase("project-1915249200075701329.firebaseio.com/" + n);
                e.once("value", function(n) {
                    var i = n.val();
                    null == i ? i = 1 : "/" != window.location.pathname && i++, e.set(i), a.children("span").removeClass("loading").html(i)
                })
            })
        });
        //]]>
    </script>
</b:if>

Thích Code | July 07, 2016 | Edit Post

8 comments:

NADNovember 7, 2016 at 5:07 AM
Hay đấy, để thử xem sao :)
NADNovember 7, 2016 at 5:09 AM
Ko biết nó có khớp với thống kê of blogger ko nhỉ
Du lịch Việt NamDecember 29, 2016 at 4:29 PM
Hay thiệt luôn. Nhưng bổ code này vào đoạn nào bác hướng dẫn chi tiết với
Le Minh TriJune 4, 2017 at 11:15 PM
Nó quay vòng tròn riếc ko hiện lượt xem là sao vậyy
Le Minh TriJune 4, 2017 at 11:18 PM
Nó quay vòng tròn riếc ko hiện lượt xem là sao vậyy
Nhabep9xJuly 27, 2021 at 12:16 AM
Các sản phẩm mà Bếp Phương Đông cung cấp cho khách hàng đó chính là:
- Các sản phẩm bếp: Bếp từ, Bếp ga, Bếp hồng ngoại,...
- Các sản phẩm máy hút mùi: Máy hút mùi cổ điển , Kính cong, Độc lập, ...

ThichCode.NET

My blog

articles about technology, tricks, programming, ... from practical experience.

Code hiển thị lượt xem bài viết đơn giản cho Blogspot

8 comments:

Most read

Latest