Copy link to clipboard
Copied
If I add a YouTube iFrame code to Adobe Muse, I can remove the YouTube logo and related videos by typing the code ?rel=0&modestbranding=1 inside the html code.
This way, when my videos play, instead of the YouTube logo showing in the player, it shows my own watermark which I've uploaded onto my YouTube channel. The only problem is, this iFrame isn't responsive.
If I want the YouTube video to be responsive, I can use the YouTube widget from the Widget Library under Socials. Here, there are options to turn off related videos and also Reduced Branding, which I assumed was the same as the modestbranding=1 solution I mentioned above. But instead, this option inserts a YouTube logo into the control bar of the player and doesn't allow my own watermark to show instead.
I've tried toggling the Reduced Branding option off and on but it still shows the Youtube logo either way.
Any thoughts on how I can fix or edit the widget to overcome this issue?
Any thoughts on how I can fix or edit the widget to overcome this issue?
There is no way to do this with the widget. The code for any widget can not be edited. Especially the code of the native Muse widget, which is integrated at the program level.
You can use html code to embed YouTube, making it responsive.
For example:
This part of the code is placed in the head.
<style>
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
...
Copy link to clipboard
Copied
Any thoughts on how I can fix or edit the widget to overcome this issue?
There is no way to do this with the widget. The code for any widget can not be edited. Especially the code of the native Muse widget, which is integrated at the program level.
You can use html code to embed YouTube, making it responsive.
For example:
This part of the code is placed in the head.
<style>
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe, .video-container object, .video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
Put this part of the code on the page.
<div class="video-container">
<iframe src="https://www.youtube.com/embed/riyqQmBHDgE?rel=0&modestbranding=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
Copy link to clipboard
Copied
Pavel, thank you. Works exactly as I need it to. Thank you, thank you, thank you.