16

There is one website that I like, but with a comment section that super annoys me. I want to block the div that holds the comments permanently, across pages, in Google Chrome.

For a temporary deletion, I can just remove the node using Chrome's Web Developer Tools. But how to remove it forever?

How can I do that? I bet Adblock does not help me, nor do good intentions. Even if I try, I end up skimming through the comments which is not good for my mental health. Hint: It's a sports website with very low-quality comments.

So here is the virtual example:

  • SITE: www.sportsrumours.com
  • DIV to block: <div class="comments">All annoying comments go here</div>
  • The DIV is the same on all pages of www.sportsrumours.com
Improve this question

4 Answers 4

Reset to default
31

For this kind of thing, I normally recommend the Stylus Add-on for chrome.

Browse to the site when you have installed the add-on and go to:

Stylus (Icon) > Write Style for > Click on the part of the URL you'd like the div to disappear on.

Use a code similar to the following to hide the div:

.comments {display: none !important;}

Save (CMD+S), and you should notice the div is now hidden

Improve this answer
2
15

You can use Adblock Plus chrome or firefox extension. When enabled, click its extension icon and then click "Block element". Then you can click an element in the page that you want blocked.

Adblock Plus will then block that element each time it is found.

Improve this answer
6
  • 4
    Dunno why this was downvoted. Adblockers have supported blocking elements for a very long time now. So if you can create a rule for it in Stylish, you can block it using Adblock Plus or uBlock Origin, because they support CSS selectors.
    – Daniel B
    Commented Dec 23, 2016 at 17:28
  • 1
    Nice! Used AdBlock Plus for many years but never noticed that neat feature. Sometimes I get those "duh" moments ;-)
    – deryb
    Commented Mar 20, 2018 at 22:00
  • 2
    WOW! Great tip. Thank you. With Adblock Plus you can easily remove any element you wish.
    – HomTom
    Commented Jun 26, 2018 at 9:16
  • 3
    Much easier than the accepted solution
    – Owen
    Commented Sep 25, 2018 at 13:32
  • 1
    This was soo easy! Also sharing @deryb's "duh" moment! Definitely the best answer :).
    – theforestecologist
    Commented May 27, 2020 at 15:40
1

You can use Stylebot chrome extension. After installing go to the website, open Stylebot and use the arrow-tool for selecting the DIV. Then look for Layout and visibility and click on hide. The DIV will disappear and the change will be persisted. Of course, you can undo that whenever you want.

Improve this answer
1
  • 1
    Stylebot did not seem to work for me. Stylish recommended in the other anwer works great.
    – Tim Swast
    Commented Feb 18, 2016 at 18:19
1

In addition to Adblock (mentioned by Andrew) this also works with uBlock Origin. I clicked the element picker (eyedropper), selected the element, and then clicked the create button. Poof, gone!

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .