[ 解決済 ] 【YOUTUBE API】読み込まれる時と読み込まれない時がある
[ 解決済 ] 【YOUTUBE API】読み込まれる時と読み込まれない時がある
- このトピックには3件の返信、2人の参加者があり、最後に
により3年、 2ヶ月前に更新されました。
-
投稿
-
■ WordPress のバージョン
WordPress 5.8.1■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
Lightning ( G3 )■ テーマのバージョン
Lightningバージョン: 14.9.2■ スキンの種類
Origin III■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
確認しました。■ 期待する動作
URLにアクセスした際にYOUTUBE APIが読み込まれ動画が表示されてほしい■ 自分で試した事
いくつかブラウザを変えたり、シークレットモードで試してみました■ 症状が発生するブラウザ
Chrome,safari■ 実際の症状
TOPページにYOUTUBE APIを使ってyoutubeの動画を背景として表示させていますが、ページを読み込み直したり、ロゴをクリックしたり、グローバルメニューからindexに戻ると動画が読み込まれないことがあります。
※最初から読み込まれないこともあります。
PCからブラウザの端をドラッグして、幅を変更し、CSSのビューポイントを変更すると表示されるのですが、最初から表示されるのは4回に1回くらいです。functions.phpに以下のような記載をしております。
■ その他特記事項
/*——————————————-*/
/* <head>タグ内に自分の追加したいタグを追加する
/*——————————————-*/
function add_wp_head_custom(){ ?>
<!– head内に書きたいコード –>
<script>
// YouTube APIの読み込み
var tag = document.createElement(‘script’);
tag.src = “https://www.youtube.com/iframe_api”;
var firstScriptTag = document.getElementsByTagName(‘script’)[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
//iframe player APIコードを非同期で読み込みます。
var player;
function onYouTubeIframeAPIReady() {
//動画を埋め込む場所を指定(1.のidを入れる)
player = new YT.Player(‘yt_player’, {
//YouTUbeの動画IDを入れる
videoId: ‘k9EUYnm5Eqo’,
//オプションを設定する場所
playerVars: {
playsinline: 1,
loop: 1,
listType: ‘playlist’,
playlist: ‘k9EUYnm5Eqo’, //上と同じ動画ID_リピートするには入力必須
rel: 0, // 関連動画の非表示
controls: 0 // 動画プレーヤーのコントロール非表示
},
events: {
‘onReady’: onPlayerReady,
‘onStateChange’: onPlayerStateChange
},
});
}
//プレーヤの準備完了後に呼び出す関数
function onPlayerReady(event) {
event.target.mute(); //ミュートにしないとスマホで再生されない
event.target.playVideo(); //ビデオを再生
}
var done = false;
function onPlayerStateChange(event) {
var ytStatus = event.target.getPlayerState();
if (ytStatus == YT.PlayerState.ENDED) {
event.target.mute(); //ミュートにしないとスマホで再生されない
event.target.playVideo(); //ビデオを再生
}
}
</script>
<?php }
add_action( ‘wp_head’, ‘add_wp_head_custom’, 1 );該当URL : https://*********※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます
Lightning Video Unit ではそのあたり対応してありますが、
細かい技術的な事は公式なサポート対象外なのと、記載してしまうと Video Unit 購入いただいた方に筋が通らないので公式な回答は控えさせていただきます。—
以下 他のユーザー様が何か回答いただくのは結構です。
- このトピックに返信するにはログインが必要です。
