Title: mb.YTPlayer for background videos
Author: pupunzi
Published: <strong>2012年5月7日</strong>
Last modified: 2023年9月14日

---

プラグインを検索

![](https://ps.w.org/wpmbytplayer/assets/banner-772x250.jpg?rev=1775485)

このプラグインは **WordPress の最新3回のメジャーリリースに対してテストされていま
せん**。もうメンテナンスやサポートがされていないかもしれず、最新バージョンの WordPress
で使用した場合は互換性の問題が発生する可能性があります。

![](https://ps.w.org/wpmbytplayer/assets/icon.svg?rev=1544312)

# mb.YTPlayer for background videos

 作者: [pupunzi](https://profiles.wordpress.org/pupunzi/)

[ダウンロード](https://downloads.wordpress.org/plugin/wpmbytplayer.3.3.8.zip)

 * [詳細](https://ja.wordpress.org/plugins/wpmbytplayer/#description)
 * [レビュー](https://ja.wordpress.org/plugins/wpmbytplayer/#reviews)
 *  [インストール](https://ja.wordpress.org/plugins/wpmbytplayer/#installation)
 * [開発](https://ja.wordpress.org/plugins/wpmbytplayer/#developers)

 [サポート](https://wordpress.org/support/plugin/wpmbytplayer/)

## 説明

A Chrome-less Youtube® video player that let you play any YouTube® video as background
of your WordPress® page or post.
 You can activate it for your home page from the
settings panel (no license needed) or on any post or page using the short code (
need the [Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL))
as described in the Reference section of the settings.

If you prefer to use a Vimeo video you can take a look at [mb.VimeoPlayer WordPress plug-in](https://wordpress.org/plugins/wp-vimeoplayer/)

note:
 If you don’t want ADs on your background video and you are the owner of it
you can disable this on your Youtube channel as explained here: http://candidio.
com/blog/how-to-remove-ads-from-your-youtube-videos .

 * demo: [See the Youtube background video in action!](http://pupunzi.com/mb.components/mb.YTPlayer/demo/demo.html)
 * video: [See a short video tutorial](http://www.youtube.com/watch?v=lTW937ld02Y)
 * pupunzi blog: [Go to my blog](http://pupunzi.open-lab.com)
 * pupunzi site: [Go to my site](http://pupunzi.com)

This plug in has been tested successfully on:

 * Chrome 11+, Firefox 7+, Opera 9+ on Mac OsX, Windows and Linux
 * Safari 5+ on Mac OsX
 * IE7+ on Windows (via Adobe Flash player)

### To set your homepage background video:

 1. Go to the mbYTPlayer settings panel (you can find it under the “settings” section
    of the WP backend.
 2. set the complete YT video url
 3. set all the other parameters as you need.

You can also set it by placing a shortcode in the home page via the YTPlayer shortcode
window ([Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL)).

You can open it by clicking on the YTPlayer button in the top toolbar of the page
editor.

### To set a video as background of a post or a page:

Use the editor button or write the below shortcode into the content of your post
or page ([Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL)):

[mbYTPlayer url=”http://www.youtube.com/watch?v=V2rifmjZuKQ” ratio=”4/3″ mute=”false”
loop=”true” showcontrols=”true” opacity=1]

 * @ url = the YT url of the video you want as background
 * @ ratio = the aspect ratio of the video 4/3 or 16/9
 * @ mute = a boolean to mute the video
 * @ loop = a boolean to loop the video on its end
 * @ showcontrols = a boolean to show or hide controls and progression of the video
 * @ opacity = a value from 0 to 1 that set the opacity of the background video
 * @ id = The ID of the element in the DOM where you want to target the player (
   default is the BODY)
 * @ quality:
    - small: Player height is 240px, and player dimensions are at least 320px by
      240px for 4:3 aspect ratio.
    - medium: Player height is 360px, and player dimensions are 640px by 360px (
      for 16:9 aspect ratio) or 480px by 360px (for 4:3 aspect ratio).
    - large: Player height is 480px, and player dimensions are 853px by 480px (for
      16:9 aspect ratio) or 640px by 480px (for 4:3 aspect ratio).
    - hd720: Player height is 720px, and player dimensions are 1280px by 720px (
      for 16:9 aspect ratio) or 960px by 720px (for 4:3 aspect ratio).
    - hd1080: Player height is 1080px, and player dimensions are 1920px by 1080px(
      for 16:9 aspect ratio) or 1440px by 1080px (for 4:3 aspect ratio).
    - highres: Player height is greater than 1080px, which means that the player’s
      aspect ratio is greater than 1920px by 1080px.
    - default: YouTube selects the appropriate playback quality.

### mb.YTPlayer Plus

With the [Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL)
you’ll get:

 * Remove the water-mark from the video
 * Set the video opacity
 * Set the video quality
 * Set the video aspect ratio
 * Set the video start point
 * Set the video end point
 * Show the control bar
 * Choose the full screen behavior
 * Set the starting audio volume
 * Choose if the video should start mute or not
 * Choose if the video should loop
 * Add a raster image over the video
 * Track the video views on Google Analytics
 * Choose if the player should pause if the windows blur
 * Add any YTPlayer video as background of any page or as backgraund of any element
   of your page enabling the short-code editor.
 * Use the YTPlayer to display a clean Youtube video as player (via short-code).

### What about mobile

The mb.YTPlayer now works on mobile devices!
 The video starts as soon the device
screen is touched.

## スクリーンショット

 * [[
 * The settings panel.
 * [[
 * You can add a video as background or targeted to a DOM element in any page or
   post by inserting a shortcode ([Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL))
   generated via the editor button.
 * [[
 * The shortcode editor ([Plus version](https://pupunzi.com/wpPlus/go-plus.php?plugin_prefix=YTPL)).

## インストール

Extract the zip file and upload the contents to the wp-content/plugins/ directory
of your WordPress installation, and then activate the plugin from the plugins page.

## FAQ

### I’m using the plug in as background video and I can see the control bar on the bottom but the video doesn’t display

Your theme is probably using a wrapper for the content and it probably has a background
color or image. You should check the CSS and remove that background to let the video
that is behind do display correctly.

### Does it work on mobile devices

Yes! the only difference is that the background video starts once the device scrin
is touched after the page has been loaded.

### I would have an image on the background before the video starts and after the video end; how can I do?

The simplest way is to add an image as background of the body via CSS.

### I set the video quality to hd1080 but it doesn’t display at this quality; why?

The video quality option is just a suggestion for the Youtube API; the video is 
served by Youtube with the quality that best fits the bandwidth and the display 
size according to that setting.

### The video stops some seconds before the real end; why?

To prevent the display of the “play” button provided by the Youtube API the video
intentionally stops some seconds before the end; if you are the owner of the video
I can suggest to make it a little bit longer (about 3/4 seconds).

### I love your plugin! What can I do to help?

Creating and supporting this plugin takes up a lot of my free time, therefore I 
would highly appreciate if you could take a couple of minutes to write a review.
This will help other WordPress users to start using this plugin and keep me motivated
to maintain and support it. You can also make a donation to support my work!

## 評価

![](https://secure.gravatar.com/avatar/c5a5c374a7b759036099a4c19dd1d336f6cf0c87af13d932f1d2b7b1c09edb30?
s=60&d=retro&r=g)

### 󠀁[Shortcode generator is in old classic WP TinyMCE!!](https://wordpress.org/support/topic/shortcode-generator-is-in-old-classic-wp-tinymce/)󠁿

 [momo-fr](https://profiles.wordpress.org/momo-fr/) 2023年10月4日

I just purchased the PLUS version and I see that the shortcode generator is only
present in the old Classic editor (nothing in the Classic Gutenberg block). It’s
a shame not to follow the evolution of WordPress. Be careful, this is a huge limitation
which makes the plugin almost unusable.

![](https://secure.gravatar.com/avatar/43a3969ededcb3ffcc0ce0ebbdc6cdb459694ec8b1d439521d3d9dd971e47ae9?
s=60&d=retro&r=g)

### 󠀁[Who wants someone elses email address shown on their website?](https://wordpress.org/support/topic/who-wants-someone-elses-email-address-shown-on-their-website/)󠁿

 [r9000](https://profiles.wordpress.org/r9000/) 2020年5月3日 6 replies

I understand having to pay extra for access to some settings, but displaying your
email address on every page of my website with no option to hide it is crossing 
the line. Who would want this? It makes the free version worthless and nothing more
than a demo.

![](https://secure.gravatar.com/avatar/f39422c1770cd60835f4414b7b9df15316864481256dc6ef83c1987d9bbdc689?
s=60&d=retro&r=g)

### 󠀁[Perfect for Divi](https://wordpress.org/support/topic/perfect-for-divi/)󠁿

 [Billarga](https://profiles.wordpress.org/billarga/) 2019年10月1日

Great plugin and support!

![](https://secure.gravatar.com/avatar/a9375aa935a2727a2928903af67837d90cc8ed90a36b75953cb4e1851b3d7f6a?
s=60&d=retro&r=g)

### 󠀁[Video just loops and loops](https://wordpress.org/support/topic/video-just-loops-and-loops/)󠁿

 [mrrobot](https://profiles.wordpress.org/mrrobot/) 2019年2月23日

Very simple to use and set up. For some reason the video default setting is set 
to loop. Maybe this is to annoy people to upgrade to pro, since that is the only
way to easily disable it. I suggest using a different player.

![](https://secure.gravatar.com/avatar/a5380413d7ea5052c8f10fc4c2026dd68f488c6a04770d52b4cb04609e422763?
s=60&d=retro&r=g)

### 󠀁[don’t work](https://wordpress.org/support/topic/dont-work-278/)󠁿

 [sielwolf](https://profiles.wordpress.org/sielwolf/) 2019年2月10日 1 reply

some js problem :-/ Uncaught TypeError: Cannot read property ‘1’ of null at getYTPVideoID(
jquery.mb.YTPlayer.js?ver=3.2.4:40) at HTMLDivElement.<anonymous> (jquery.mb.YTPlayer.
js?ver=3.2.4:424) at Function.each (jquery.js?ver=1.12.4:2) at a.fn.init.each (jquery.
js?ver=1.12.4:2) at a.fn.init.buildPlayer (jquery.mb.YTPlayer.js?ver=3.2.4:336) 
at (index):132

![](https://secure.gravatar.com/avatar/2e9b0d17b5d59d05b4a591312949559f227c2153c6854995481bd118a9e9f874?
s=60&d=retro&r=g)

### 󠀁[Stable, flexible and easy](https://wordpress.org/support/topic/stable-flexible-and-easy/)󠁿

 [eselsmann](https://profiles.wordpress.org/eselsmann/) 2018年5月5日

I searched a while to find a way to enable YouTube video backgrounds which play 
also on mobile devices. This Plugin-In is great. I also purchased pro, which is 
absolutely worth it.

 [ 28件のレビューをすべて表示 ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/)

## 貢献者と開発者

mb.YTPlayer for background videos はオープンソースソフトウェアです。以下の人々が
このプラグインに貢献しています。

貢献者

 *   [ pupunzi ](https://profiles.wordpress.org/pupunzi/)

“mb.YTPlayer for background videos” は1ロケールに翻訳されています。 [翻訳者](https://translate.wordpress.org/projects/wp-plugins/wpmbytplayer/contributors)
のみなさん、翻訳へのご協力ありがとうございます。

[“mb.YTPlayer for background videos” をあなたの言語に翻訳しましょう。](https://translate.wordpress.org/projects/wp-plugins/wpmbytplayer)

### 開発に興味がありますか ?

[コードを閲覧](https://plugins.trac.wordpress.org/browser/wpmbytplayer/)するか、
[SVN リポジトリ](https://plugins.svn.wordpress.org/wpmbytplayer/)をチェックするか、
[開発ログ](https://plugins.trac.wordpress.org/log/wpmbytplayer/)を [RSS](https://plugins.trac.wordpress.org/log/wpmbytplayer/?limit=100&mode=stop_on_copy&format=rss)
で購読してみてください。

## 変更履歴

#### 3.3.8

Bug fixing.

#### 3.3.7

Fixed a fatal bug with the mb.ideas menu.

#### 3.3.6

Feature: Updated to the latest js script.

#### 3.3.5

Feature: Defined a better behaviour If you’ve set the autoplay option of a video
that has the audio active: Instead of starting the video at the first user interaction
with the page, now the video start playing mute and the audio is activated with 
the first user interaction.
 Feature: The plugin now supports the https://www.youtube-
nocookie.com host to remove the Youtube cookies.

#### 3.3.4

Bug Fix: With the latest maOS Big Sur system update the User Agent has been changed
and the OS detection was failing on Safari causing a blocking error.

#### 3.3.3

Updated: with the latest mb.YTPlayer.js (3.3.4) that fixes a bug for mobile devices.

#### 3.3.2

Updated with the latest mb.YTPlayer.js (3.3.3) that fixes a bug if the wrong YT 
API key is used.

#### 3.3.1

Bug fix: there was a bug if the server was not allowing content from external urls.

#### 3.3.0

Bug fix: On mobile Chrome browser the size of the background video was broken on
orientation change.

## メタ

 *  バージョン **3.3.8**
 *  最終更新日 **3年前**
 *  有効インストール数 **1,000+**
 *  WordPress バージョン ** 3.0またはそれ以降 **
 *  検証済み最新バージョン: **6.3.8**
 *  言語
 * [English (US)](https://wordpress.org/plugins/wpmbytplayer/)、[Italian](https://it.wordpress.org/plugins/wpmbytplayer/).
 *  [プラグインを翻訳](https://translate.wordpress.org/projects/wp-plugins/wpmbytplayer)
 * タグ
 * [full background](https://ja.wordpress.org/plugins/tags/full-background/)[HTML5](https://ja.wordpress.org/plugins/tags/html5/)
   [video](https://ja.wordpress.org/plugins/tags/video/)[video player](https://ja.wordpress.org/plugins/tags/video-player/)
   [youtube](https://ja.wordpress.org/plugins/tags/youtube/)
 *  [詳細を表示](https://ja.wordpress.org/plugins/wpmbytplayer/advanced/)

## 評価

 5つ星中4.1つ星

 *  [  20 5-星レビュー     ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/?filter=5)
 *  [  1 4-星レビュー     ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/?filter=4)
 *  [  1 3-星レビュー     ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/?filter=3)
 *  [  1 2-星レビュー     ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/?filter=2)
 *  [  5 1-星レビュー     ](https://wordpress.org/support/plugin/wpmbytplayer/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/wpmbytplayer/reviews/#new-post)

[すべてのレビューを見る](https://wordpress.org/support/plugin/wpmbytplayer/reviews/)

## 貢献者

 *   [ pupunzi ](https://profiles.wordpress.org/pupunzi/)

## サポート

意見や質問がありますか ?

 [サポートフォーラムを表示](https://wordpress.org/support/plugin/wpmbytplayer/)

## 寄付

このプラグインが今後も改善できるよう応援しませんか ?

 [ このプラグインに寄付 ](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=DSHAHSJJCQ53Y)