An Easy Way to Hide Related YouTube Videos from Other Channels Popping Up After Videos Play In Divi
When a video finishes playing in the Divi Video module, the default YouTube behavior is to show related suggested videos to the user, which are often meant to take you to other channels.
There are several reasons why you would want to hide related YouTube video suggestions from popping up on your Divi website. The point of a website is not to distract the user with YouTube, but rather to provide some sort of information relevant to the website and brand. I have found that this solution does 1 of 2 things. Sometimes I find that it completely removes any related videos, and other times it will show a few from my own channel only. Either way, this is much better and well worth the 40 seconds it takes to implement.
I’m here to save the day and provide a super simple solution that will hide YouTube related videos in Divi. This works for me very well, and like my other Divi tutorials, you’ll be surprised how easy this is to implement on your Divi website!
Note: Please be aware that the method described in this tutorial no longer hides all related YouTube videos. Instead, it now hides videos from other channels, while still displaying related videos from your own channel. This change means that you’ll only see videos related to your own content, rather than a broader range of related videos.
▶️ Please watch the video above to get all the exciting details! 👆
1. Add A Custom CSS Class To the Video Module
The first step is to add a custom CSS class to any of your video modules where you want to hide the related YouTube videos. The reason we add this class is to target specific video modules on your site.
Go to the Video module settings>Advanced tab>CSS Classes & IDs toggle>and paste “pa-hide-related-videos” into the CSS Class input field.
2. Add Some jQuery Code To Modify the YouTube Video URL
The second step in this tutorial to hide related YouTube videos in Divi is to add a jQuery snippet to your website. This snippet connects to the custom class added in step #1 and handles the functionality of adding a special extension to the YouTube video URL. This is what hides the related videos from other channels and only will allow YouTube to show videos from your own channel.
Where To Paste The jQuery Code
1. Divi Assistant
If you are using our Divi Assistant plugin, simply paste the code in the jQuery tab in the custom code window in the Divi Visual Builder.
2. Child Theme
If you are using a child theme, paste this code into the scripts.js file (don't forget to remove the <script> tags at the beginning and end). If you don't have a child theme, you can generate a child theme directly on your site or download our free child theme.
3. Divi Theme Options Integration
Otherwise, paste this code in your Divi>Theme Options>Integrations tab in the "Add code to the < head > of your blog" code area.
If you need help understanding where to paste the code, please check out our complete guide about where to add custom code In Divi.
<script>
jQuery(document).ready(function($ ) {
// add '&rel=0' to end of all YouTube video URL's
// to prevent displaying related videos
$('.pa-hide-related-videos iframe').attr( "src", function( i, val ) {
return val + '&rel=0';
});
});
</script>OPTIONAL: Make It Global Sitewide
If you want this feature to take effect in any Divi Video module on your entire site then it’s easier to target them all at once.
This global method eliminates the need to add the custom CSS class from step #1, so if you are using this second jQuery snippet, be sure to skip step #1 above.
<script>
jQuery(document).ready(function($ ) {
// add '&rel=0' to end of all YouTube video URL's
// to prevent displaying related videos
$('.et_pb_video iframe').attr( "src", function( i, val ) {
return val + '&rel=0';
});
});
</script>
I saw the most comments saying it wasn’t working, but decided to give a try anyhow. It worked great! I used the global solution and pasted it in Divi Theme Options. I couldn’t believe it – actually makes the splash screen return. No related videos at all!
Hi Erik,
That’s great to hear! I feel like YouTube always changes this too. Thanks for sharing!
Hi Nelson, I could use you rehlp because I’m really stumped – while I’m sure your code works and adds the snippet after the video links, the snippet itself it does not want to work for me – even if I add the ‘&rel=0’ in an embed code manually, I can still see the suggested videos at the end. I’ve tried Divi support but they are useless in this case and I’m at my wits end. The videos are lower on the site attached – respectively an art gallery and vineyard tour. Any ideas?
Hi Karo!
Thanks for reporting the issue. It seems the code is not compatible with the latest version of Divi. We’ll update it and let you know soon!
Hate to add another “does this work?” comment – but I’m not getting the global one to work and I’m thinking maybe Google has changed things so this method no longer works? I’ll try the css class version and see if I have any more luck.
I’m using the Divi Video Slider Module, and I can see &rel=0 in the source code, but I still see related videos at the end of the video.
Here’s a link to a screenshot showing what I’m seeing: https://app.screencast.com/CDRunGDlMHnoo
When the video is paused, I don’t see related videos.
Are you sure this still works in 2024?
Hi Jules!
Are there any JS errors in the console? If not, share the URL of the page.
Hello Nelson,
Can’t get this to work on either version of the jQuery. I have left the first jQuery code in place on the page – https://jackadamsauthor.com/the-lambeth-walk/
If you could take a look at this for me it would be much appreciated.
Many thanks,
Barrie
Hi Barrie,
I don’t see any video on your link. Could you let me know where that is?
FYI, the global one doesn’t work.
Hi Asit,
It does indeed work. In fact, this page is the best example of it. I’m not sure why it would not work for some and not others.
It doesn’t work
Don’t play the lottery today then. It works for the rest of us.