Hide Feedly Sponsored Content in Chrome

Posted by

I have been using Feedly (https://feedly.com) as my RSS reader for some time now and recently they have started injecting sponsored content into the news feeds on their web site.

If the sponsored content (AKA ads) were anywhere else on the page I would deal with it as the price to pay for using the service. But the ads are randomly inserted into Feedly’s article lists and are designed to look like articles, which disrupts my reading flow. I poked around at the underlying code and found that it wouldn’t be difficult to hide the ads using a little bit of JavaScript and CSS.

The Chrome Inspector shows that each item in the list of articles is a div  with a entry CSS class named “entry”. Actual articles have an “id” attribute while, conveniently, the ads don’t. So, inserting a CSS rule that will set any div  tags with an “entry” class and no id attribute to display:none  will hide the ads.

A small bit of JavaScript run on the page will insert a style tag into the HTML document with the rule that will hide the ads.

var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '#feedlyPersona div.entry:not([id]) { display:none }';
document.getElementsByTagName('head')[0].appendChild(style);

In Chrome, I used the Custom JavaScript for websites extension which runs custom JavaScript on any web site. It is entirely possible that if Feedly makes any changes to their web site that this hack will stop working, but since it’s meant for my personal use it’s not a big deal. The small amount of code can most likely be modified to work with whatever changes are made.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.