Hide ProWritingAid’s Annoying Floating Icon Widget

Recent updates made over the summer of 2024 to ProWritingAid’s browser extension results in a floating ProWritingAid icon which won’t go away. The only way to turn it off through their settings is to disable the extension entirely. It’s especially useless when it shows up on webpages where you can’t even edit things!

Thankfully, hiding the icon while preserving ProWritingAid’s editing capabilities is quite simple and will only take you a couple minutes to set up.

I’ll give you two options, though there are plenty of other ways to do this. First, I’ll use an extension called “User JavaScript and CSS” which will allow us to target the widget and hide it using CSS. The second option will be to block it with uBlock Origin, which essentially does the same thing. But since uBlock origin is also an ad blocker, that kills two birds with one stone. You can likely follow similar instructions if you’re using other ad-blockers, but I can’t figure out instructions for every single ad blocker out there.

These instructions should work with nearly any Chromium based web browser such as Google Chrome, Microsoft Edge, Vivaldi, Brave, Arc, etc.

With User JavaScript and CSS

Begin by installing User JavaScript and CSS from the Chrome Web Store.

Then, click on the icon and create a new rule.

Give your rule a name, like “Annoying PWA Icon Blocker”. Then create a URL pattern.

The URL pattern defines what sites this rule is applied across. Since we want this rule to work on every website, use this pattern:

*://*/*Code language: JavaScript (javascript)

Then, on the right side of the screen where we add custom CSS. Add this:

pwa-extension-widget{
    display: none;
}Code language: CSS (css)

That is CSS styling telling the browser to hide the widget.

Your screen should look like this

Save the rule and reload a page where the PWA widget was being display. The annoying floating icon should be gone!

With uBlock Origin

If you’re using uBlock Origin, the ad blocker, you can target and remove the widget as if it were an advertisement.

Open the uBlock extension dashboard by clicking on the uBlock icon and selecting the button with the three gears.

In the dashboard, navigate to the “My filters” tab. Make sure my custom filters are enabled. Then, in the editor area, type:

##pwa-extension-widgetCode language: CSS (css)

Just like the screenshot.

Apply the changes and reload any pages with the widget. It should be gone!

I’m sure, eventually a setting change will make this guide obsolete. But for now, hope that helps!

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments