Hướng dẫn cài đặt Widget “push notification” của OneSignal cho blogspot


Push notification là gì ?

Push notification là những tin nhắn do server đẩy xuống client thông qua một cổng cloud message nào đó rồi từ cổng này sẽ thông báo xuống máy chúng ta là có thông báo mới và hiển thị chúng. Chính vì vậy nên phải có internet thì mới push notification được.


Tại sao sử dụng Push Notification ?

- Gửi thông báo với người dùng của bạn ngay trên trình duyệt trong thời gian hiện tại
- Tiếp cận người dùng của bạn ở mọi nơi trên web.
- Xây dựng hệ thống thông báo mà không cần phải xây dựng một ứng dụng cho điện thoại
- Nhận được tỷ lệ nhấp chuột cao hơn email. Và nhiều lượt truy cập trang hơn.

Push Notification có thể hoạt động trên môi trường nào ?

- Chrome for Web
- Chrome fof Andriond
- FireFox for Web

Browser push notification.

Tương tự như push notification, browser push notification sẽ gửi request xuống browser thông qua một cổng cloud message nào đó (gọi là endpoint) để hiển thị thông báo.


Trong bài viết này mình sẽ hướng dẫn các bạn sử dụng plugin “OneSignal” để cài đặt browser push notification.


ĐĂNG KÝ TÀI KHOẢN ONESIGNAL

Đầu tiên là chúng ta cần phải đăng ký một tài khoản tại OneSignal.

Các bạn có thể đăng ký mới hoặc đăng nhập bằng những mạng xã hội thông dụng như:

- Github
- Google
- Facebook

Mình thì mình sử dụng Tk google cho tiện.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

TẠO APP VÀ SETUP

Sau khi đã có tài khoản trên OneSignal, bước tiếp theo là tạo ra một app trên OneSignal để chúng ta có thể cấu hình được Plugin mà chúng ta đã cài trước.


Sau khi chọn “add a new app”, bạn hay chọn platform mà bạn cần muốn config, ở đây chúng ta sẽ chọn Web Push.


Trong mục App Settings:

Choose Integration: mục chọn cách mà chúng ta sẽ cài đặt cho website để kết nối đến server của OneSignal, ở đây chúng ta sử dụng Blogspot do đó các bạn hãy chọn Website Builder.

Site Setup:

- Site name: Tên hiển thị OneSignal trên website.
- Site url: địa chỉ website mà bạn cần cài đặt OneSignal.
- Default icon url: icon hiển thị cho OneSignal khi chạy trên website.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

Permission Prompt Setup: là phần setup hiển thị cho OneSignal. Ở đây thì mình add luôn cả hai dạng này.

Có hai dạng hiển thị Notification khi người dùng truy cập vào website:


- Slide Prompt
- Subscription Bell

Welcome Notification: Là phần hiển thị thông báo khi người dùng đã đăng ký nhận thông tin website thành công.


Sau khi đã hoàn thành điền thông tin và cài đặt trong phần App Setting hoàn tất.

Bước tiếp theo là chúng ta sẽ config cho riêng trình duyệt Safari, để cấu hình riêng cho trình duyệt này, các bạn chỉ việc bất nút configure và điền tên miền vào, hệ thống sẽ tự sinh ra Web ID.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

TỔNG KẾT:

Việc cài đặt “push notification” sẽ giúp bạn tương tác với nhiều người dùng hơn, sẽ giúp cho blog của bạn chuyên nghiệp hơn và có lượng tương tác chất lượng hơn rất nhiều so với việc sử dụng email notification thông thường.

Nếu các bạn có thắc mắc đừng quên để bình luận bên dưới, mình sẽ giải đáp mọi thắc mắc cho các bạn.

NGUỒN THAM KHẢO: Mastercode


Push notification là gì ?

Push notification là những tin nhắn do server đẩy xuống client thông qua một cổng cloud message nào đó rồi từ cổng này sẽ thông báo xuống máy chúng ta là có thông báo mới và hiển thị chúng. Chính vì vậy nên phải có internet thì mới push notification được.


Tại sao sử dụng Push Notification ?

- Gửi thông báo với người dùng của bạn ngay trên trình duyệt trong thời gian hiện tại
- Tiếp cận người dùng của bạn ở mọi nơi trên web.
- Xây dựng hệ thống thông báo mà không cần phải xây dựng một ứng dụng cho điện thoại
- Nhận được tỷ lệ nhấp chuột cao hơn email. Và nhiều lượt truy cập trang hơn.

Push Notification có thể hoạt động trên môi trường nào ?

- Chrome for Web
- Chrome fof Andriond
- FireFox for Web

Browser push notification.

Tương tự như push notification, browser push notification sẽ gửi request xuống browser thông qua một cổng cloud message nào đó (gọi là endpoint) để hiển thị thông báo.


Trong bài viết này mình sẽ hướng dẫn các bạn sử dụng plugin “OneSignal” để cài đặt browser push notification.


ĐĂNG KÝ TÀI KHOẢN ONESIGNAL

Đầu tiên là chúng ta cần phải đăng ký một tài khoản tại OneSignal.

Các bạn có thể đăng ký mới hoặc đăng nhập bằng những mạng xã hội thông dụng như:

- Github
- Google
- Facebook

Mình thì mình sử dụng Tk google cho tiện.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

TẠO APP VÀ SETUP

Sau khi đã có tài khoản trên OneSignal, bước tiếp theo là tạo ra một app trên OneSignal để chúng ta có thể cấu hình được Plugin mà chúng ta đã cài trước.


Sau khi chọn “add a new app”, bạn hay chọn platform mà bạn cần muốn config, ở đây chúng ta sẽ chọn Web Push.


Trong mục App Settings:

Choose Integration: mục chọn cách mà chúng ta sẽ cài đặt cho website để kết nối đến server của OneSignal, ở đây chúng ta sử dụng Blogspot do đó các bạn hãy chọn Website Builder.

Site Setup:

- Site name: Tên hiển thị OneSignal trên website.
- Site url: địa chỉ website mà bạn cần cài đặt OneSignal.
- Default icon url: icon hiển thị cho OneSignal khi chạy trên website.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

Permission Prompt Setup: là phần setup hiển thị cho OneSignal. Ở đây thì mình add luôn cả hai dạng này.

Có hai dạng hiển thị Notification khi người dùng truy cập vào website:


- Slide Prompt
- Subscription Bell

Welcome Notification: Là phần hiển thị thông báo khi người dùng đã đăng ký nhận thông tin website thành công.


Sau khi đã hoàn thành điền thông tin và cài đặt trong phần App Setting hoàn tất.

Bước tiếp theo là chúng ta sẽ config cho riêng trình duyệt Safari, để cấu hình riêng cho trình duyệt này, các bạn chỉ việc bất nút configure và điền tên miền vào, hệ thống sẽ tự sinh ra Web ID.


"Click vào để xem ảnh gốc với chất lượng tốt hơn"

TỔNG KẾT:

Việc cài đặt “push notification” sẽ giúp bạn tương tác với nhiều người dùng hơn, sẽ giúp cho blog của bạn chuyên nghiệp hơn và có lượng tương tác chất lượng hơn rất nhiều so với việc sử dụng email notification thông thường.

Nếu các bạn có thắc mắc đừng quên để bình luận bên dưới, mình sẽ giải đáp mọi thắc mắc cho các bạn.

NGUỒN THAM KHẢO: Mastercode

M_tả
M_tả

Không có nhận xét nào: