質問&ディスカッション

北野博俊
参加者

LPへのiframe形式を用いた外部動画の設置について

現在、hubspotで作成したLPに、iflame形式で外部の動画を、モジュールからリッチテキストを用いて埋め込もうとしています。レスポンシブ対応にしたいので、widthとheightをそれぞれ100%に書き換えて保存をしても、100%から以前の数値に戻ってしまいます。

わかる方、解決方法を教えていただけないでしょうか?

どうぞよろしくお願い致します。

0 いいね!
10件の返信
TakuyaAimi
投稿者

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 

iframeのwidth, height属性はピクセルの値を設定するものです。

https://developer.mozilla.org/ja/docs/Web/HTML/Element/iframe

 

そのため、 width="100%" といった表記はHubSpotのツールがコード規約違反として弾いているのだと思います。

試しに width="200" などとすると反映されるのでは、と思います。

0 いいね!
KMurota
トップ投稿者

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 

Incognitoモードなどで試されましたでしょうか(以前のhtmlがキャッシュされている可能性はないでしょうか)?



Kan Murota | Founder of Hyper Automation Design Studio
logo
0 いいね!
北野博俊
参加者

LPへのiframe形式を用いた外部動画の設置について

アドバイスありがとうございます。

>Incognitoモードなどで試されましたでしょうか

やってみたのですが、だめでした。。。

 

0 いいね!
KMurota
トップ投稿者

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 
ソース見てみないとなんとも、なのですが、考えられる理由としては

  1. コンテナにfixの幅高さがセットされている
  2. ビデオプレイヤーがレスポンシブに対応していないまたはサイズ制限がある。
  3. CSSが当てられている

ですよね。
ソースをcopilotかchat-gptに渡して聞いてみるといかがでしょうか?



Kan Murota | Founder of Hyper Automation Design Studio
logo
0 いいね!
北野博俊
参加者

LPへのiframe形式を用いた外部動画の設置について

@KMurota 
アドバイスありがとうございます。chat-gptに聞いてもだめでした。。

ソースですが、

<iframe style="margin: 0px auto; display: block;" allow="xr-spatial-tracking" xml="lang" src="https://◯◯◯◯◯◯◯" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe>

になります。widthとheightを100%にして保存し再度ソースをみると、上記の数字に戻ってしまいます。

なにか変更が効かないソースなのでしょうか?

0 いいね!
KMurota
トップ投稿者

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 
あ、ソースを変えてるにも関わらずそれが反映されないということですね。
複製したファイルを編集している、ということもないですよね・・・?



Kan Murota | Founder of Hyper Automation Design Studio
logo
0 いいね!
北野博俊
参加者

LPへのiframe形式を用いた外部動画の設置について

@KMurota 
>あ、ソースを変えてるにも関わらずそれが反映されないということですね。
そうなんです。youtubeだと100%になってくれるのですが、今回のはなってもらえず。。。

>複製したファイルを編集している、ということもないですよね・・・?
ないのです。。。

 

なんとかお知恵をいただけると嬉しいです。。。

0 いいね!
KMurota
トップ投稿者

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 

デザインツールだけでなく、LPまたはWebsite側を開いてSaveというのはやりましたでしょうか?



Kan Murota | Founder of Hyper Automation Design Studio
logo
0 いいね!
北野博俊
参加者

LPへのiframe形式を用いた外部動画の設置について

@KMurota 
>デザインツールだけでなく、LPまたはWebsite側を開いてSaveというのはやりましたでしょうか?

 

これは、LPの保存とかではなく、別のやり方があるということでしょうか?

違うのであればやり方が書いてあるページURL教えていただけると嬉しいです。

よろしくお願いします!

0 いいね!
natsumimori
コミュニティーマネージャー
コミュニティーマネージャー

LPへのiframe形式を用いた外部動画の設置について

@北野博俊 さん、コミュニティーへの投稿ありがとうございます。

 

@assi @KMurota 現物がないので難しいかもしれないのですが、何が理由かわかりますでしょうか?