D5 Creation Blog

Easily Disable Annoying Facebook Pop Up Notification Bubble

We manage some Facebook Pages and Groups which have more than 1 million fans, members. When an admin posts something in the facebook groups hundreds of pop up notification bubble appear in the left screen of the facebook website which is very annoying. Sometimes we try to close them but if we can't click on the cross sign the notification post appears. We tried to find out any available options in the facebook settings but, unfortunately, there is nothing in facebook to control these. We searched in internet and some facebook support topics came. No solutions were there. So, we tried to manage them from the browsers and we were successful.


Following this tutorial you can do these easily:

  • You can change any styling of a website in your browser
  • You can change the styling of your browser
  • You can disable advertisements from any site
  • You can show anything larger of smaller from any website
  • You can disable the facebook notification bubbles


The procedures are as follows:

1. Install the Stylish Extension/Add on in your Chrome and/or Firefox Browser

You can search, find and install the Stylish Extension/Add on in Chrome and/or Firefox browser easily. For Chrome you can find that from this link: https://chrome.google.com/webstore/category/extensions



For Firefox you can find that from this link: about:addons



After installing the Extension/Add on in your browser you will find an Icon in the top-right corner of your browser. If you click there you will find some options to add custom styling for any website. You need to know the primary knowledge of CSS techniques.


2. Find the CSS Class or ID for styling

You may know that there is a nice feature of Chrome. That is Inspect Element. You can press the right button of your mouse and find the Inspect or Inspect Element in the bottom of the Pop Up Menu.  You can also find the Inspect Element window pressing Ctrl+Shift+I

For the Facebook Group Notification Bubble the class is ._50d1


3. Point to the Icon and Select the Site

The Stylish Icon will appear in the top-right corner of the browser. You can select the Site URL from there and a new window will appear. Suppose we shall select facebook.com because we want to disable the facebook notification bubble



4. Set Custom Styling for the Class or ID

This is a pure CSS block box. Here you can use the CSS for the Class or ID you got previously by Inspect Elements. You can set the display property to none. If you add important! the style will be applied with priority. For the class ._50d1 we have added ._50d1 { display: none !important;  }




Thus the annoying Facebook Group Notification Bubble will not be shown anymore. This will work only the specific computer and specific browsers. You can also use the same technique to disable anything for any browser like advertisements. You can also increase/decrease the height, width, font size etc. for your readability


This tutorial can make your internet browsing experience pleasant

Comments are Closed