Tạo thông báo đẩy trên trình duyệt khi chuyển Blog sang https cho các tên miền tùy chỉnh

Một tin rất vui gần đây cho cộng đồng người chơi blog đó là Blogger chính thức hỗ trợ giao thức https cho các Blog đang gắn tên miền tùy chỉ...

Một tin rất vui gần đây cho cộng đồng người chơi blog đó là Blogger chính thức hỗ trợ giao thức https cho các Blog đang gắn tên miền tùy chỉnh. Việc cài đặt rất đơn giản chỉ cần đăng nhập Blogger qua địa chỉ http://ift.tt/1ePrhz0 sau đó chuyển tới phần cài đặt bật Tính khả dụng của HTTPS chuyển từ Không sang Có đợi ít phút làm mới lại trình duyệt khi nút Chuyển hướng HTTPS sáng lên thì bật sang Có là xong.
Sau khi đã chuyển địa chỉ Blog sang giao thức bảo mật https thì một trong những điều đầu tiên bạn cần nghĩ đến đó là tạo thông báo đẩy trên trình duyệt. Lưu ý thông báo chỉ xuất hiện trong trình duyệt FireFox và các trình duyệt lấy mã nguồn Chorme.

Vẫn là bài cũ soạn lại dựa trên dịch vụ OneSignal tuy nhiên chúng ta có điều chỉnh javascript chp phép chỉ xuất hiện hộp thông báo bên dưới địa chỉ https bên góc trái trình duyệt thay xuất hiện biểu tượng hình cái chuông dưới góc phải.

Các bước thực hiện như sau

1. Truy cập địa chỉ https://onesignal.com chọn mục Web Push bấm GET STARTED

2. Đăng ký mới hoặc đăng nhập dựa vào tài khoản có sẵn của các dịch vụ Github, Google, Facebook, mình sử dụng Github cho nhanh

3. Trong bảng điều khiển chọn Add a new app

4. Đặt tên cho App rồi bấm Create tạo mới

5. Chọn mục Web Push rồi nhấn Next ở màn hình tiếp theo

6. Trong mục Site Setup điền tên, địa chỉ Blog và link logo

7. Trong mục Prompt Setup các bạn nhấn chọn ADD A PROMPT sau đó cứ để nguyên chọn SAVE lưu lại

8. Mục Welcome Notification các bạn giữ nguyên hoặc có thể chỉnh sửa tùy thích

9. Bước này chọn SAVE lưu lại

10. Khi trình duyệt chuyển qua trang mới các bạn tìm đến mục COPY CODE các bạn chỉ cần lấy phần appId thôi

11. Các bạn lấy appId ghép vào đoạn script dưới đây

<link href='/manifest.json' rel='manifest'/>
<script async='' src='http://ift.tt/2a5fPBx'></script>
<script>
var OneSignal = window.OneSignal || [];
OneSignal.push(function() {
OneSignal.init({
appId: "tên appId",
autoRegister: true,
notifyButton: {
enable: false,
},
});
});
</script>