会員サイトをリニューアルしました! 新サイトはこちら

Vimeoを埋め込みすると全画面表示のボタンが表示されません。 < SWELLに関する質問

フォーラムをリニューアルしました!
今後は、新フォーラムをご利用ください。

Vimeoを埋め込みすると全画面表示の...
 
通知
すべてクリア

[解決済] Vimeoを埋め込みすると全画面表示のボタンが表示されません。

9 投稿
5 ユーザー
4 Likes
2,067 表示
miku111
(@miku111)
New Member
Topic starter
 

お世話になります。

Vimeoの動画を埋め込みしているのですが、
右下に表示されるはずの「全画面」のボタンが表示されません。

試しにアフィンガーテーマのサイトで埋め込みをしてみたら、表示されたので、
おそらくSWELLの仕様でそのような設定がされているのかなと思い、
質問させていただいております。

埋め込む予定のサイトは非公開の会員サイトなのでこちらにアップすることができません。

また、埋め込みコードですが、

<i frame>で埋め込んでも、
VimeoのURLをそのまま貼り付けても全画面表示されません。

お手数ですが、よろしくお願いいたします。

 
投稿済 : 12/05/2021 4:12 am
genepine
(@genepine)
Eminent Member
 

フォーラム推奨の通りURLがないと、お答えは得られないと思います。
まず、ご自分で公開テストできるような別環境をつくり、提示されることをお勧めします。

  • localbyflywheelなどのWordPressローカル環境(できるかどうかはわかりません)
  • 同じサーバの別ディレクトリに置いた公開できるWordPress
 
投稿済 : 12/05/2021 8:16 am
しらこ
(@96ssbike)
Prominent Member
 

@genepine さん、ありがとうございます。そう言いたいところですが、今回のケースではURLはとりあえず不要です。

一般的にVimeoで公開している動画をテスト環境に埋め込み(Vimeoブロック、もしくはカスタムHTMLブロックを使用し)、実際に手元の環境でも同じ現象が確認できました。

今のところ、情報が不足しており(WordPress公式フォーラムにも同様の現象は報告なし)、以下のテーマで同じ配置方法・タグの埋め込み方法で行い、以下の結果となりました。

全画面ボタンが表示される→ デフォルトテーマ、Snow Monkey
全画面ボタンが表示されない→SWELL, Arkhe

Arkhe公式フォーラムにも同様の報告事例はなし。

Vimeo公式のヘルプによると、「プレーヤーに全画面ボタンが表示されない」のページに「上記のケースに該当するかどうかはっきり分からない場合はご連絡ください。こちらで調査いたします。 その際、動画が埋め込まれているページへのリンクを必ず記載してください。ページソースコードを詳しくお調べいたします。」とあるので、そちらのサポートを頼るのもひとつの手かもしれません。

解決になっていなくてすみません。

テスト時に https://vimeo.com/203114446 の動画を使用してみました。
埋め込みテストの際には、いずれもタグ内に allowfullscreen を含めています。

会員サイトにVimeoの全画面表示ボタンを搭載したい…というのは私も気持ちがわかりますので。

This post was modified 3年前 4回 by しらこ

にゃーん .

 
投稿済 : 12/05/2021 8:24 am
miku111
(@miku111)
New Member
Topic starter
 

@genepineさん

@96ssbikeさん

お返事ありがとうございます。

Vimeoのヘルプページも読んだのですが、
解決策がわかなかったので、Vimeoに問合せしてみたほうが良いかもしれませんね。

もし何か解決策をご存知の方がいらっしゃいましたら、
ぜひ教えていただけたらと思います・・!

 
投稿済 : 12/05/2021 11:53 pm
しらこ reacted
了(開発者)
(@ryo)
Illustrious Member Admin
 

この件、後日調べておきます…🙇‍♂️

 
投稿済 : 13/05/2021 2:44 am
しらこ reacted
miku111
(@miku111)
New Member
Topic starter
 

@ryoさん

お忙しいところありがとうございます!

よろしくお願いいたします !

 
投稿済 : 13/05/2021 6:50 am
kuniki99
(@kuniki99)
Active Member
 

横から失礼します 😉 

私も同じ状況に遭遇しまして、あれこれ試していたらなんとかなったので情報共有いたします。

Vimeoで発行される埋め込みコードって以下のような感じだと思います

<iframe src="https://player.vimeo.com/video/xxxxxxxx" width="640" height="480" frameborder="0" 
allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>

これを

<iframe src="https://player.vimeo.com/video/xxxxxxxx" width="640" height="480" frameborder="0"
webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>

こう書き換えたら全画面ボタンが表示されるようになりました。

埋め込みブロックだとURL指定になるので、HTMLブロックを使いました。

毎回書き換えるのが面倒なので、上のコードを動的に下のコードに置換させる形で実装しました。

お役に立ちましたら幸いです 😀 

 
投稿済 : 17/06/2021 5:17 pm
了(開発者)
(@ryo)
Illustrious Member Admin
 

@kuniki99

おー!ありがとうございます!!

 
投稿済 : 18/06/2021 10:34 pm
miku111
(@miku111)
New Member
Topic starter
 

@kuniki99さん

ありがとうございます!やってみます^^

 
投稿済 : 10/11/2021 6:32 am
共有: