How can I block popup videos on foxnews.com?
How can I block video popups on the foxnews.com site? The popups occupy the lower right corner of my screen, and, needless to say, are unwanted annoyances. The foxnews.com web site isn't the only internet news site that does this, I'm hoping that whatever settings help with the one site will help with others. Using 67.0.1 (64-bit) on a Windows 10 desktop computer. I'm a Firefox user, not a computer expert by any means.
Chosen solution
Try to add this to userContent.css:
@-moz-document domain(thehill.com){ div.player-container { display:none!important; } }Read this answer in context 👍 0
All Replies (10)
Go to the Mozilla Add-ons Web Page {web Link} (There’s a lot of good stuff here) and search for a good ad blocker.
You can look at the uBlock Origin extension
No luck with these blockers: Adblock Plus uBlock Origin Popup Blocker (strict) Popup Blocker Ultimate Poper Blocker AdBlock for Firefox
Looks like I learn to live with the distasteful popup videos or stop visiting the internet news sites that use them. The popup videos are not ads but, rather, news stories. I guess the site operator thinks readers like the popups. I find them annoying.
Thanks for the advice.
You can add code to the userContent.css file in the chrome folder in the profile folder.
@-moz-document domain(foxnews.com){ .featured.featured-video.sticky-video .contain { display: none !important; } }
It is not that difficult to create userContent.css if you have never used it.
The first step is to open the "Help -> Troubleshooting Information" page and find the button to access the profile folder.
You can find this button under the "Application Basics" section as "Profile Folder -> Open Folder". If you click this button then you open the profile folder in the Windows File Explorer. You need to create a folder with the name chrome in this folder (name is all lowercase). In the chrome folder you need to create a text file with the name userContent.css (name is case sensitive). In this userContent.css text file you paste the text posted.
In Windows saving the file is usually the only time things get more complicated because Windows can silently add a .txt file extension and you end up with a file named userContent.css.txt. To avoid this you need to make sure to select "All files" in the dialog to save the file in the text editor using "Save File as".
You need to close (Quit/Exit) and restart Firefox when you create or modify the userContent.css file.
Hello cor-el,
Your instructions are great and it appears to work! I've tried a number of screens on foxnews.com and no popup videos! Wonderful!!
Can I use the userContent.css file for the same purpose with other sites? For instance, thehill.com presents the same video popup nuisance. How would I add that site to the userContent.css file?
Thank you again!
I didn't notice a floating video window on that site when I did a quick test.
Can you post a link to a publicly accessible page (i.e. no authentication or signing on required)?
You normally use the Inspector to get the CSS selector of the outermost container and use this selector to hide the container.
Here are two sites that have a video popup as you scroll down the screen. And if you scroll back up the screen the popups go away. Not all news articles on thehill.com have popup videos.
https://thehill.com/homenews/senate/448054-senators-clinch-votes-to-rebuke-trump-on-saudi-arms-sale
Thank you.
Chosen Solution
Try to add this to userContent.css:
@-moz-document domain(thehill.com){ div.player-container { display:none!important; } }
The second snippet of code works as expected -- no more popup videos on thehill.com. Thank you for that.
It is regrettable that each web site must be analyzed and a few lines of custom code developed in order to block the popup videos. I looked at the links you provided above about the Inspector, CSS selector, etc. These waters are not for the faint of heart.
Your help is much appreciated.
You're welcome.
You can use these examples to check in the Inspector what containers are used. If you move up and down in the DOM tree then you quickly notice what is selected (highlighted) on the web page, so you can see when you leave the player container and then go down one tag. These tags usually have an ID or class name that you can use. You can add a display:none!important; rule under "This Element" in the right panel as a test.
element { display:none !important; }