Javascript

Magnific PopupでYouTubeに関連動画を表示させない方法

magnific-popup

Youtube の動画をLightboxのようなモーダルウィンドウで表示できるMagnific Popup。
レスポンシブ・デザインに対応しているので便利です。

Magnific Popup

Magnific PopupでYouTubeの関連動画を表示させない必要がありました。
普通に関連動画を非表示にするためには、通常、URLの後に、?rel=0を追加すればいいのですが、Magnific Popupでパラメータをつけると、動画が自体が表示されません。

YouTube限定になりますが、下記のJavaScriptにすれば、関連動画が表示されません。

<script>
jQuery(window).load(function(){
    jQuery('a[href*="youtube.com/watch"]').magnificPopup({
       type: 'iframe',
           iframe: {
               patterns: {
                   youtube: {
                       index: 'youtube.com', 
                       id: 'v=', 
                       src: '//www.youtube.com/embed/%id%?rel=0&autoplay=1'
                    }
               }
           }   
     });      
});
</script>

参考

Unable to remove related videos in youtube

-Javascript