CODEWITHSUNDEEP
javascripthtmlcssgoogle-chromepush-notification
James Lee
James Lee

Reputation: 323

Customizing Web Push Notification (Google Chrome)

so I managed to implement a web push notification for Google Chrome using Google Project and Service Worker.

My question is how do I able to customize or decorate the push notification as the message box is plain. For instead, i would like to decorate it with html and css. 

 self.addEventListener('push', function(event) {
 console.log('Push message received', event);
 var title = 'Push message';
 event.waitUntil(
 self.registration.showNotification(title, {
 body: 'Please choose to like or reply      
  icon: 'images/icon.png',
  tag: 'my-tag',
  actions:[
     {action:"like", title: "Like"},
     {action:"reply", title: "⤻ Reply"}]
}));
});

Upvotes: 2

Views: 1701

Answers (1)

Vivek Khandelwal
Vivek Khandelwal

Reputation: 21

You can't add HTML and CSS, at least not yet. What you could do at best is use Emoji's and icons in the title, description and the action buttons but none of the browsers have this feature yet.

Upvotes: 2

Related Questions