エンジニアじゃないんだけど有識者に質問したくて (15ﾚｽ)
エンジニアじゃないんだけど有識者に質問したくて http://medaka.5ch.net/test/read.cgi/prog/1685069223/
上
下
前
次
1-
新
通常表示
512ﾊﾞｲﾄ分割
ﾚｽ栞
1: 仕様書無しさん [] 2023/05/26(金) 11:47:03.79 今WordPressを使ってサイトを作っていて、そのサイトでHTMLのvideo要素を使って動画を埋め込んでるんですが、動画があるページへの初回アクセス時その動画貼ってるところが背景真っ黒の再生ボタンに斜線が入ってるみたいになってちゃんと表示されないんです。リロードするとなぜか正しく表示されるんですが、、、 2度目以降正しく表示されるってことはHTMLの記述自体には問題はないのかなと思ってるんですが、如何せん知識がなくて原因を想定することもできず困っています。 ざっくりした情報で申
し訳ないのですが、丸2日ここで詰まってて自力ではどうにもならなそうなのでご意見いただきたいです。 http://medaka.5ch.net/test/read.cgi/prog/1685069223/1
2: 仕様書無しさん [sage] 2023/05/26(金) 12:39:19.09 優秀なプログラマさんが現れるまでしばらくお待ちください http://medaka.5ch.net/test/read.cgi/prog/1685069223/2
3: 仕様書無しさん [] 2023/05/26(金) 12:45:15.99 はい笑 お気遣いありがとうございます http://medaka.5ch.net/test/read.cgi/prog/1685069223/3
4: 仕様書無しさん [sage] 2023/05/26(金) 12:49:10.32 >>1 WordPressで動画を埋め込んだ際に、初回アクセス時に背景が真っ黒の再生ボタンに斜線が表示される問題が発生しているようですね。その後のリロードでは正しく表示されるとのことです。 この問題は、ブラウザのキャッシュに関連している可能性があります。初回アクセス時にブラウザは動画のデータをまだキャッシュしていないため、正しく表示されずにデフォルトの再生ボタンが表示されるのかもしれません。 以下にいくつかの解決策を提案します： キャッシュの無効化: WordPressのキ
ャッシュプラグインやサーバーのキャッシュ設定が問題の原因となっている可能性があります。一時的にキャッシュを無効にしてみてください。または、別のブラウザやプライベートモードでのアクセスを試してみてください。もし問題が解決されれば、キャッシュの設定を見直す必要があるかもしれません。 JavaScriptの遅延読み込み: 動画を埋め込む部分をJavaScriptで遅延読み込みする方法も試してみる価値があります。これにより、ページが完全に読み込まれてから動画が表示されるため、正しく表示される可能性が高くなります。 テーマやプラグインの競
合: 他のテーマやプラグインとの競合が原因で問題が発生している場合もあります。一時的にすべてのプラグインを無効化し、デフォルトのテーマに切り替えてみてください。もし正常に表示されれば、問題の原因はプラグインやテーマにある可能性があります。 コンテンツデリバリーネットワーク (CDN) の利用: もしまだ試していなければ、コンテンツデリバリーネットワーク (CDN) を使用してみてください。CDNは、動画やその他のコンテンツを高速に配信するためのネットワークです。CDNを使用することで、動画の読み込みがスムーズになる可能性があります
。 上記のいずれかの方法を試してみてください。また、WordPressのバージョンや使用しているテーマやプラグインの詳細な情報を提供すると、より具体的なサポートができるかもしれません。 http://medaka.5ch.net/test/read.cgi/prog/1685069223/4
5: 仕様書無しさん [] 2023/05/26(金) 13:22:14.28 コメントありがとうございます。 ＞WordPressのバージョンや使用しているテーマやプラグインの詳細な情報を提供すると、より具体的なサポートができるかもしれません。 失礼しました。WordPressバージョンは6.2.2 テーマはcocoonを使用しています。 有効化されているプラグインは以下です。 ・CoBlocks（ページ作成の時に使えるコンテンツブロック追加） ・Favorites（サイトの各ページをお気に入り登録してサイト内でリストできる機能追加） ・Flexible Table Block（表作成ブロックの追加） ・Re
generate Thumbnails（サムネイルを一括で再生成できるプラグイン） 。Site Kit by Google ・Slide Anything - Responsive Content / HTML Slider and Carousel（カルーセルスライダーを作るためのプラグイン） キャッシュの無効化 →MacでSafari、Google Chromeから、iPhoneでSafari、Google Chrome、Googleアプリからそれぞれアクセスを試し、それぞれ初回アクセス時はやはり同じ現象が起きました。 なのでキャッシュが関係しているのかなとは薄々思いつつ、対処法が全くわからないという状態でした。 WordPressやサーバーのキャッシュ設定というの
はどこから確認できるものなのでしょうか、、質問ばかりですみません JavaScriptの遅延読み込み →遅延して読み込ませるということができればと思っていたのですがやはりjavascriptが必要ですよね。 もしお手数でなければWordPressのどこにどんなカスタマイズをすればjavascriptによる遅延読み込みができるか教えていただけないでしょうか、、、、 HTMLのvideoにpreload="none"やpreload="metadata"を追記することは試したのですが効果はありませんでした。 テーマやプラグインの競合 →テーマの変更やプラグインの無効化を試し
ましたが効果がありませんでした。 コンテンツデリバリーネットワーク (CDN) の利用 →cloud flareみたいなものでしょうか。一度使用を検討して調べていたのですが無料だとキャッシュルールが3つまでしか作れなくて不便だとか書かれているのをみて、それがどれだけ不便なのか判断もできず導入しませんでしたが、入れてみます。 http://medaka.5ch.net/test/read.cgi/prog/1685069223/5
6: 仕様書無しさん [] 2023/05/26(金) 13:46:47.28 安価つけ忘れてしまったので再度 >>4 コメントありがとうございます。 ＞WordPressのバージョンや使用しているテーマやプラグインの詳細な情報を提供すると、より具体的なサポートができるかもしれません。 失礼しました。WordPressバージョンは6.2.2 テーマはcocoonを使用しています。 有効化されているプラグインは以下です。 ・CoBlocks（ページ作成の時に使えるコンテンツブロック追加） ・Favorites（サイトの各ページをお気に入り登録してサイト内でリストできる機能追加） ・Flexible
Table Block（表作成ブロックの追加） ・Regenerate Thumbnails（サムネイルを一括で再生成できるプラグイン） 。Site Kit by Google ・Slide Anything - Responsive Content / HTML Slider and Carousel（カルーセルスライダーを作るためのプラグイン） キャッシュの無効化 →MacでSafari、Google Chromeから、iPhoneでSafari、Google Chrome、Googleアプリからそれぞれアクセスを試し、それぞれ初回アクセス時はやはり同じ現象が起きました。 なのでキャッシュが関係しているのかなとは薄々思いつつ、対処法が全くわからないという状態でした。 Wo
rdPressやサーバーのキャッシュ設定というのはどこから確認できるものなのでしょうか、、質問ばかりですみません JavaScriptの遅延読み込み →遅延して読み込ませるということができればと思っていたのですがやはりjavascriptが必要ですよね。 もしお手数でなければWordPressのどこにどんなカスタマイズをすればjavascriptによる遅延読み込みができるか教えていただけないでしょうか、、、、 HTMLのvideoにpreload="none"やpreload="metadata"を追記することは試したのですが効果はありませんでした。 テーマやプラグインの競合
→テーマの変更やプラグインの無効化を試しましたが効果がありませんでした。 コンテンツデリバリーネットワーク (CDN) の利用 →cloud flareみたいなものでしょうか。一度使用を検討して調べていたのですが無料だとキャッシュルールが3つまでしか作れなくて不便だとか書かれているのをみて、それがどれだけ不便なのか判断もできず導入しませんでしたが、入れてみます。 http://medaka.5ch.net/test/read.cgi/prog/1685069223/6
7: 仕様書無しさん [sage] 2023/05/26(金) 14:44:46.02 動画の形式とサイズも書いたほうがいいと思う。 要は最初のhtmlが落ちてきてブラウザがレンダリングしてる段階ではまだ動画が落ちてきてないから表示されてないってだけでは？ 自分はそういう目的で使ったことないけど、video.jsみたいなライブラリを介して表示したら遅延読み込みとかはよしなにやってくれるんじゃないのかな。 http://medaka.5ch.net/test/read.cgi/prog/1685069223/7
8: 仕様書無しさん [] 2023/05/26(金) 15:27:23.07 >>7 失礼しました。形式はmp4なんですがサイズは動画によってバラバラで、、、1280×720が多いですね。 javascriptの知識が皆無なんでググったんですが https://dezanari.com/videojs/#:~:text=Video.js%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9%E3%81%AF,%E3%81%A4%E3%82%92%E5%85%A5%E3%82%8C%E3%82%8B%E3%81%A0%E3%81%91%E3%81%A7%E3%81%99%E3%80%82 これって今記述してあるHTMLの<video>タグの部分に.video-jsクラスを追記するだけじゃ使えないですよね？ その前に書いてある下準備の
ような工程をこなさないとですよね。この「Video.jsをCDNで読み込み」というのはどういう行為を指してるんでしょうか。 そのままだろと言われるような質問かもしれないんですが、、 http://medaka.5ch.net/test/read.cgi/prog/1685069223/8
ﾒﾓ帳
(0/65535文字)
上
下
前
次
1-
新
書
関
写
板
覧
索
設
栞
歴
あと 7 ﾚｽあります
ｽﾚ情報
赤ﾚｽ抽出
画像ﾚｽ抽出
歴の未読ｽﾚ
Google検索
Wikipedia
ぬこの手
ぬこTOP
0.006s