Tạo widget thống kê tuyệt đẹp cho blogspot/blogger

Tài liệu
Tạo widget thống kê tuyệt đẹp cho blogspot/blogger
Chuyên mục
Người đăng
Đăng vào
Chào các bạn hôm nay mình sẽ hướng dẫn cho các bạn tạo widget thống kê tuyệt đẹp cho blogger. Và cái này mình lấy ý tường từ Juno_okyo's Blog
Demo thống kê cho blogger

HƯỚNG DẪN CÁCH LÀM:

Để thực hiện thêm tiện ích này bạn cần Đăng nhập vào blogger -> Bố cục -> Thêm tiện ích HTML sau đó sử dụng đoạn code dưới đây
<style>
section.widget_info_blog{padding:0!important;overflow:hidden;background:transparent!important;border-radius:3px 3px 0 0!important}
.feau{height:120px;background:#00a7d0;font-size:23px;color:#fff;padding:0;text-decoration:none}
.feau h3{margin-top:0;margin-left:10px;margin-bottom:5px;font-size:25px;font-weight:500;text-shadow:0 1px 1px rgba(0,0,0,.2);
}
.feau p{font-size:16px;margin-left:10px}
.title-blog{padding:10px}
.logo-widget img{max-height:90px;border:3px solid #fff;border-radius:50%;margin-top:-40px;margin-left:calc(50% - 40px)}
.info{float:left;width:100%;background:#fff;min-height:101px;margin-top:-45px}
.col-widget{float:left;width:33%;height:35px;font-size:15px;color:#23282d;margin-top:45px;text-align:center}
.col-widget h5{margin:0;padding:0;font-weight:600;font-size:16px}
</style>
<div class="feau">
<div class='title-blog'>
<h3>Star Bình Blog</h3>
<p>Share Tips & Tricks</p>
</div>
</div>
<div class="logo-widget"> <img src="https://4.bp.blogspot.com/-EwIbmmll-as/Wg_66B--i_I/AAAAAAAACUs/GsjASB1VLlUUA1gq8J_mucFY989JQ7L_wCLcBGAs/s1600/R6pT0pj%2B%25281%2529.jpg" width='90' height='90' draggable='false' oncontextmenu='return false'/> </div>
<div class="info">
    <div class="col-widget so-bai">
        <h5><script style="text/javascript">
            function showpostcount(json) {
                document.write(parseInt(json.feed.openSearch$totalResults.$t, 10));
            }
        </script>
        <script src="/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script></h5>
<span>POST</span>
    </div>
    <div class="col-widget so-comment">
        <h5><script style="text/javascript">
            function numberOfComments(json) {
                document.write(json.feed.openSearch$totalResults.$t);
            }
        </script>
        <script src="/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></h5>
<span>COMMENTS</span>
    </div>
    <div class="col-widget so-cau-hoi">
        <h5><script type="text/javascript">
            var startTime = new Date();

            function currentTime() {
                var a = Math.floor((new Date() - startTime) / 100) / 10;
                if (a % 1 == 0) a += ".0";
                document.getElementById("endTime").innerHTML = a;
            }
            window.onload = function() {
                clearTimeout(loopTime);
            }
        </script>
        <script type="text/javascript">
            document.write('<span id="endTime">0.0</span>');
            var loopTime = setInterval("currentTime()", 100);
        </script></h5>
<span>LOAD</span>
    </div>
</div>
Sau đó lưu tiện ích lại và quay lại trang chủ xem kết quả.

TIỆN ÍCH THỐNG KÊ TRÊN BAO GỒM :

- Tổng bài viết
- Tổng số bình luận
- Thời gian tải trang
Chúc bạn thành công!

Hiện có bình luận

Thông báo
Dịch vụ tăng tương tác bán hàng trên Instagram, tăng auto like bài viết, hình ảnh video, tăng lượt theo dõi (follower) nick Instagram. Xem ngay »
Xong