Cách thêm bộ đếm lượt xem vào giao diện Plus UI Blogger

Bài viết cùng chuyên mục:

Bạn đang muốn theo dõi số lượt xem bài viết trên blog Blogger của mình? Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách thêm bộ đếm lượt xem tự động vào giao diện Blogger, giúp bạn và độc giả nắm được mức độ phổ biến của nội dung. Hãy làm theo từng bước và xem cách thêm tính năng hữu ích này vào blog của bạn dễ dàng như thế nào. Hãy bắt đầu thôi!

Việc thêm bộ đếm lượt xem tự động vào giao diện Blogger của bạn là một quy trình đơn giản, có thể thực hiện chỉ trong vài bước. Dưới đây là hướng dẫn chi tiết: 

 

1. Tạo cơ sở dữ liệu trên Google Firebase

Để bắt đầu, hãy tạo một dự án mới trên Google Firebase bằng cách truy cập trang Firebase Console và nhấp vào "Tạo Dự án". Sau đó, nhập tên dự án mong muốn và nhấp vào "Tiếp tục" để tiếp tục. [Kiểm tra Hình ảnh] 

Sau khi tạo tên dự án, hãy giữ nguyên cài đặt mặc định và nhấp vào "Tiếp tục". Để cấu hình cài đặt Google Analytics, hãy nhấp vào "Chọn tài khoản" và chọn tài khoản Google Analytics đang sử dụng, sau đó nhấp vào "Tiếp tục".

Bây giờ hãy nhấp vào tạo dự án và sẽ mất vài giây.

Bây giờ hãy nhấp vào Tiếp tục.

Tuyệt vời! Dự án của bạn đã sẵn sàng để sử dụng. Bây giờ hãy nhấp vào Cơ sở dữ liệu thời gian thực.

Nhấp vào Tạo Cơ sở dữ liệu. Và chọn bất kỳ Vị trí Cơ sở dữ liệu nào. Tôi đang chọn Hoa Kỳ (us-central01). Sau đó, chọn chế độ khóa và nhấp vào Bật.

Bây giờ hãy nhấp vào quy tắc. [Xem hình ảnh]

Sau đó xóa toàn bộ mã quy tắc và dán mã quy tắc bên dưới vào phần quy tắc. [Xem hình ảnh]

Quy tắc Mã JSON

{
   "quy tắc" : {
     ".read" : đúng ,
     "BlogID_ 00000000000000000000 " : {
       ".read" : đúng ,
       " $post_id " : {
         ".write" : "newData.exists() && (data.exists() ? newData.val() == data.val() + 1 : newData.val() == 1)" ,
         ".validate" : "newData.isNumber() && newData.val() % 1 === 0.0 && newData.val() <= 99999999"
      }
    }
  }
}

Đừng quên thay đổi BlogID. Thay BlogID bằng BlogID của bạn

2. Thiết lập mẫu Blogger

Bây giờ hãy mở trình soạn thảo tệp xml của chủ đề Blogger và tìm realViews. Mã trông như bên dưới.

lượt xem thực tế: {
  databaseUrl: "" ,
  viết tắt: "sai" 
}

Bây giờ hãy thêm URL cơ sở dữ liệu vào trong dấu ngoặc kép. Đồng thời đổi chữ viết tắt flasethành true. Sau đó, mã sẽ trông như thế này.

lượt xem thực tế: {
  databaseUrl: "https://xxxxxxx-xxx-xxx-default-rtdb.asia-southeast1.firebasedatabase.app" ,
  viết tắt: "true" 
}

Vậy là xong! Lưu mẫu và kiểm tra xem bộ đếm lượt xem có hoạt động không bằng cách truy cập URL hoặc bài viết trên trang web của bạn.

Phần kết luận

Tóm lại, việc thêm bộ đếm lượt xem theo thời gian thực vào giao diện Blogger có thể được thực hiện bằng cách sử dụng JavaScript và API Blogger. Quy trình này bao gồm việc tạo một hàm JavaScript để lấy số lượt xem hiện tại và cập nhật bộ đếm trên trang, sau đó gọi hàm bằng trình lắng nghe sự kiện trên trang. Ngoài ra, bạn cũng cần thiết lập khóa API Blogger để truy cập dữ liệu số lượt xem. Quy trình này có thể nâng cao chức năng của giao diện Blogger và mang lại trải nghiệm người dùng hấp dẫn bằng cách hiển thị số lượt xem hiện tại trên một bài đăng hoặc trang.