音楽教室運営奮闘記

不定調性論からの展開紀行~音楽と教育と経営と健康と

はてなブログに動画を直接貼る埋め込み方法

   

 

もう一つ

   

こんな感じです(フリー素材です)。

ドロップボックスに保存してアドレスを貼るパターンです。

この書式は、上記が

 

<video preload="none" controls="controls" width="450" height="300">
<source src="//dl.dropboxusercontent.com/s/ls9tryv5rcwls3l/Feather%20-%2011168.mp4?" type="video/mp4" />
</video>

 

下記が、

<video contorols="none" controls="controls" width="450" height="300">
<source src="//dl.dropboxusercontent.com/s/ls9tryv5rcwls3l/Feather%20-%2011168.mp4?" type="video/mp4" />
</video>

 

 

適切に表示されるほうを採用ください。 

上記仕様のs/以降の

ls9tryv5rcwls3l/Feather%20-%2011168.mp4?

の該当部分だけあなたのリンクに書き換えてください。

mp4?dl=0とかあったら、「?」の前までコピーです。

mo?dl=0でも同じです。「?」寄り前を切り取って貼ってください。

おそらく

width="450" height="300"で幅、高さも指定できます。

注記)IEやMicrosoft Edgeでは映像サイズを小さくすると再生バーがどデカイ印象です(再生中に消えます)。

 

5秒ぐらいの動画ならgif画像で貼る、という手もあります。

www.terrax.site

  

下記参考にしていただいたサイト様が作られた記事を逆輸入させて頂きました。

【はてなブログ】動画を直接ブログ内に貼り付ける方法 - techblogchanはかく語りき

こちらでは自前サーバーがないため、ドロップボックス仕様です。

リンクコピーのやり方ははてなブログに音楽ファイルを貼る方法

 

こちらの記事も参考にさせていただきました。ありがとうございました。

 

mp4ファイルなどの動画を<video>タグを使ってPCで自動再生 & 繰り返し再生させる方法!

 

html5動画自動再生を無効にする - コードログ

 

f:id:terraxart:20191025082901p:plaintopicimage