需要使用 iFrame API 隐藏 YouTube 品牌

Posted 2023-02-24

技术标签:

【中文标题】需要使用 iFrame API 隐藏 YouTube 品牌【英文标题】：Need to hide YouTube Branding with iFrame API 【发布时间】：2018-05-18 18:38:38 【问题描述】：

我正在使用 YouTube iFrame API 在我的自定义播放器（javascript 播放器）中加载视频。我需要隐藏 Youtube 品牌，但是在 ios 设备上，它会显示带有以下参数的徽标：

playerVars:

    'fs':1,
    'autoplay' : 0,
    'showinfo' : 0,
    'rel' : 0,
    'controls' : videoControls,
    'cc_load_policy' : 0,
    'color':'white',
    'modestbranding' : 1,
    'iv_load_policy' : 3,
    'loop':inv_loop,
    'wmode': 'transparent',
    'playlist':playlist,
    'playsinline':1

如果我将“showinfo”保持为 1，它会隐藏徽标，但会显示视频标题、分享和稍后观看图标以及广告。

有什么方法可以使用 iFrame API 隐藏两者（YouTube 徽标和上传者信息与广告）？

谢谢！

【问题讨论】：

【参考方案1】：

我隐藏了除播放/暂停按钮之外的所有内容。

我设法以负边距做到这一点。

检查下面的代码 -

<!DOCTYPE html>
<html>
    <style type="text/css">
        #offset
            position: absolute;
            top: -300px;
            bottom: -300px;
            right: 0;
            left: 0;
            background-color: black;
            z-index: 12;
        

        #payer-container
            height: 450px;
            width: 800px;
            overflow: hidden;
            position: relative;
            z-index: 1;
        

        
    </style>

    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <script src="https://www.youtube.com/iframe_api"></script>
    </head>

    <body>
        <div id="payer-container">
            <div id="offset">
                <div id="youTubePlayerDOM"></div>
            </div>
        </div>
    </body>

    <script type="text/javascript">
        
        var player;

        function onYouTubeIframeAPIReady() 

            
            player = new YT.Player('youTubePlayerDOM', 
                height: '100%',
                width: '100%',
                playerVars: 
                    "autoplay": 0,
                    "controls": 0,
                    "enablejsapi": 1,
                    "video_id": "QswsUQNDW_U"
                
            );
        

    </script>
</html>

注意：

如果需要，您应该必须手动创建控制器。视频的纵横比是固定的。

【讨论】：

【参考方案2】：

你可以加modestbranding=1

此参数允许您使用不显示 YouTube 徽标的 YouTube 播放器。将参数值设置为 1 以防止 YouTube 徽标显示在控制栏中。请注意，当用户的鼠标指针悬停在播放器上时，一个小的 YouTube 文本标签仍会显示在暂停视频的右上角。

showinfo=0 将删除标题栏

取值：0或1。该参数的默认值为1。如果将参数值设置为0，则播放器在视频开始播放前不会显示视频标题和上传者等信息。

另外，我认为 YouTube 不允许您完全删除他们的名称/徽标。

【讨论】：

如果您再次阅读该信息，我已经将“modestbranding”保持为 1。问题是，在 iOS 设备中，它在播放视频时仍然显示 youtube 品牌。 showinfo=0 和moderatebranding=1 这个组合不适用于iOS 设备。

以上是关于需要使用 iFrame API 隐藏 YouTube 品牌的主要内容，如果未能解决你的问题，请参考以下文章