Is there a way to set the modestbranding and color of a YouTube video element in Webflow, either through the UI or via custom code?

TL;DR
  • Access YouTube video in Webflow, replace with an Embed element, and insert custom HTML with desired parameters.
  • Configure YouTube URL with parameters like modestbranding=1 and color=white in the Embed element.
  • Publish and test the site to ensure customization and compatibility.

To modify the modestbranding and color attributes of a YouTube video in Webflow, you will need to use custom code, as these options are not available directly through the Webflow UI. Here's how you can do it:

​

1. Access the Embed Element in Webflow

  • Locate your YouTube video element within your Webflow project.
  • Replace it with an Embed element, allowing you to insert custom HTML.

​

2. Configure the YouTube Embed URL

  • Replace the default YouTube URL with one that includes desired parameters like modestbranding and color.
  • Example format: https://www.youtube.com/embed/VIDEO_ID?modestbranding=1&color=white

​

3. Add the Custom Code

  • In the Embed element, input your custom HTML like:

  ```html

  <iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID?modestbranding=1&color=white" frameborder="0" allowfullscreen loading="lazy"></iframe>

  ```

  • Replace VIDEO_ID with the actual ID of your YouTube video.

​

4. Ensure Parameter Inclusion

  • Make sure parameters like modestbranding=1 (which hides the YouTube logo) and color=white are included in the URL.
  • Note that color only affects the video player’s control bar and can either be red or white.

​

5. Publish and Test Your Site

  • Publish your site to see the customizations in effect.
  • Test on different devices and browsers to ensure compatibility.

​

Summary

To set the modestbranding and color of a YouTube video in Webflow, embed the video using an Embed element with custom URL parameters like modestbranding=1 and color=white. This customization is done via custom HTML in Webflow's Embed element.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
How can I make smaller images on my Webflow portfolio pages expand to a larger scale when clicked on, like a pop-up window?
Has anyone else noticed and/or found a solution to the issue in Webflow where changing categories on the main blog page while on a paginated page of the "All" category results in staying on the same paginated page?
How can I change the font color of every even item in a Webflow collection list?
Is it possible to create a client dashboard in Webflow where they can upload content via a form to update the CMS of the main site? If so, how can this be done?
Why did the checkout button disappear after connecting PayPal and enabling checkout on my Webflow website?
Is there someone who can resolve the issue with my student discount not applying using my school-provided .com email address that is linked to my Webflow account?
How can I create a cookie alert message with a closing button on my website's homepage using Webflow?
How can I make my Webflow modal scrollable on small screens without affecting the scrollability of the content behind it?
How do I customize the language switch button from Weglot in Webflow?
How can I prevent the "mailto" function in Webflow from opening an empty new tab along with the email client?
How can I center my CTA button on my hero image in Webflow? I have a flexbox as the parent element (my hero image), but the button is not centered underneath the hero text.
Can an ID be set on a parent node of a Rich Text Field in Webflow?
How can I create a slider effect on Webflow?
How can I add ad-hoc HTML tables in my CMS Richtext content in Webflow without the need for clients to edit HTML markup directly?
How can I create a dropdown that pushes other elements down the page like the one shown in this Webflow gif?
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?
How can I implement a ThreeJS script as a background for my Webflow project using custom code?
How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?
Can Webflow be used to create a "blob" elements effect in the header of a website using custom code or JavaScript?