Skip to content

Conversation

@error9098x
Copy link
Contributor

Description

Enable muted autoplay for the YouTube video in the docs “Watch & Learn” section to improve UX. Autoplay is requested via YouTube URL params (required by modern browser policies), and the redundant autoPlay attribute is removed.

  • Affected file: next-cloudinary/docs/components/Video/Video.js
  • Affected page: /cldimage/basic-usage → “Watch & Learn”

Before vs After

Before (no autoplay) After (muted autoplay)
Video becomes visible but doesn’t start Video begins playing muted when visible

Code change

--- a/next-cloudinary/docs/components/Video/Video.js
+++ b/next-cloudinary/docs/components/Video/Video.js
@@ -56,13 +56,12 @@ export const Video = ({
         >
           <iframe
             title={title}
             width={width}
             height={height}
-            src={`https://www.youtube.com/embed/${videoId}?feature=oembed`}
+            src={`https://www.youtube.com/embed/${videoId}?feature=oembed&autoplay=1&mute=1&playsinline=1`}
             frameBorder="0"
             allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
             allowFullScreen
-            autoPlay
           />
         </div>
       ) : (

No new dependencies.

Issue Ticket Number

Fixes #640

Type of change

  • Fix or improve the documentation
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

Checklist

  • I have followed the contributing guidelines of this project as mentioned in CONTRIBUTING.md
  • I have created an issue ticket for this PR
  • I have checked to ensure there aren't other open Pull Requests for the same update/change?
  • I have performed a self-review of my own code
  • I have run tests locally to ensure they all pass
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes needed to the documentation

@vercel
Copy link

vercel bot commented Oct 29, 2025

@error9098x is attempting to deploy a commit to the Cloudinary DevX Team on Vercel.

A member of the Team first needs to authorize it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] Docs video doesn’t autoplay in “Watch & Learn” section

1 participant