YouTube動画やニコ動をHTML（BLOGブログ）に貼り付ける方法（埋込みタグ使用）。
また、YouTube動画で、
高画質で貼り付けたり埋め込みプレーヤーの周りに境界線（枠）を付けたり、パネル（フレーム）に色を付ける。

YouTube動画などをHTMLに貼り付けるには、動画再生ページに表示されている埋め込み（Embed）タグを使用します。YouTubeなど動画共有サイトで可能です。
埋め込み（Embed）タグには、サイトにより異なり、<OBJECT>タグ（embedタグ含む）、<IFRAME>タグ、または<EMBED>タグのみが使用されます。
また、動画サイトにより、埋め込み（Embed）タグ（貼付けコードと呼ぶサイトもあり）の表示場所や表示方法が異なりますので注意してください。

≫動画URLを入力してYouTube埋め込みコードを自動作成-自動再生｜自動繰り返しループ｜色ボタン｜サイズ縮小｜ボタンのみ｜高さ自動計算　など
≫JavaScriptで、HTMLに貼り付けた（埋め込み）YouTube動画をコントロールする方法（API/SWFObject） （Javascript起動。YouTubeのみ。）
≫YouTubeなどのサムネイル画像をクリックしてそのページ内でYouTube動画を開く［Videobox] Lightbox for Video （Aタグでリンクしてクリック）
≫YouTube、WMP、SWF、RealPlayerなどのサムネイル画像・文字をクリックして、そのページ内で動画などを開く方法 ［Mediabox] Lightbox for Media
　（Aタグでリンクしてクリック。Webページも可。）
≫サムネイル画像をクリックして、そのページに、拡大画像をクールにオーバーレイ表示する［Lightbox］
≫サムネイル画像をクリックして、そのページに、拡大画像をクールにオーバーレイ表示する［Pirobox］Lightboxより優れもの

<OBJECT>タグの貼り付け方法-YouTube貼り付け、Dailymotion、Lulu TV、Danerd、Blastro、myspace、など
１．YouTubeで、貼り付けたい動画を再生させます（サンプル：http://www.youtube.com/watch?v=RnDZB4r13qo）

２．再生した動画の下の「<埋め込みコード>」をクリックし、埋め込みコードをコピーし、HTMLへ貼り付けます。
 
２つの方法があります。
それは、表示される①埋め込みコードをコピーし貼り付ける(方法１）または②ブログアイコンをクリックして自動的に貼り付ける(方法２）方法です。
(注．①は埋め込みコードに対応していないブログがあります。②は特定のブログに限ります。）
 
▼(方法１）埋め込みコードをコピーして貼り付ける場合（>埋め込みコードのカスタマイズ例）（①、②、③、④）
One Piece Opening 12 [NEW OPENING] Tap-Co Run
①「共有」をクリックします
②「埋め込みコード」をクリックします
③
  • 「関連する動画を含める」にチェックを入れると、「再生」が終わったとき、関連動画が表示されます。
    「関連する動画を含める」のパラメータは、relです。rel=1または省略時：含める　rel=0：含めない。
    ▼rel=1または省略時の例は下図。にぎやかです。
  • 「古い埋め込みコードを使用する [?] 」にチェックを入れるとembed codeタグが④に生成されます。
      「古い埋め込みコードを使用する[?]」にチェックを入れないとiframeタグが④に生成されます。
④「埋め込みコード」（<object ・・・）をサイズを調整（カスタマイズ）後コピーし、ブログなどに貼り付けます。

▼(方法２）ブログアイコンをクリックして特定ブログ（Amebaなどに限る）に貼り付ける場合、①、②、③の順に行います。
  ①画面下の「共有」をクリックし、②「この動画を共有」をクリックしブログ名を表示します。
  そして、③をクリックし、ブログアイコンを表示させる。
ブログ（Amebaなどに限る）に貼り付ける場合
↓④表示された好みの「ブログアイコン」をクリックします・・・新規記事に自動貼り付け可能です。
  貼り付け後。サイズなどを調整（カスタマイズ）します。
ブログ（Amebaなどに限る）に貼り付ける場合
※(方法２）は、サイズの変更などのカスタマイズはYouTubeページでは出来ません。カスタマイズは、埋め込みコードを直接自分で修正します。
※動画サイトにより、埋め込み（Embed）タグの表示場所や表示方法が異なりますので注意してください。
※Yahooブログは、埋め込み（Embed）タグを貼り付けできません。wiki文法で貼り付けます。
（wiki文法例）[[embed(貼り付ける動画のアドレス,横のサイズ,縦のサイズ)］］詳細は、４．Yahooブログの例を参照。
※YouTube再生ページからブログに自動貼り付けしたときの大きさは、425×344（アスベスト比が4：3）、480×295（アスベスト比が16：9）（ピクセル）です。
　
３．HTMLの例（サイズ、自動再生などのカスタマイズ）
 
YouTubeの場合、埋め込みプレーヤーに境界線（枠）を付けたり、フレーム（パネル）に色を付けたり、高画質を表示することができます。
また、再生開始位置の指定を行うことが出来ます。これらは、埋め込みプレーヤーのパラメータを使用してカスタマイズすることにより実現できます。
上でコピーしたソースコード（<object>から</object>）を、HTML（ブログ）に貼り付けます。
YouTubeに限らず、Embedタグを公開している他の動画も、同様です。
動画のサイズは、好みにより変更します。ソースコードには、サイズ（width=とheight=）の定義が２箇所ありますので注意してください。
 
HTMLの内容に応じ、動画のサイズを適宜縮小します。
YouTube動画で使用できる埋め込みコードは 3 種類あります。基本形はつぎのとおり。
【注】2013年6月ごろより埋め込みコードの動画URLのhttp:部分(プロトコル表記)が省略されるようになった。

(1) 以前の埋め込みコード「<object...」で始まり、Flash の再生にのみ対応 ・アスベスト比　１６：９の場合
<object width="560" height="315"><param name="movie" value="//www.youtube.com/v/m8EldpeRfXc?version=3&hl=ja_JP"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/m8EldpeRfXc?version=3&hl=ja_JP" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>

・アスベスト比　４：３の場合
<object width="420" height="315"><param name="movie" value="//www.youtube.com/v/HL4IZfsJ6_4?version=3&hl=ja_JP"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/HL4IZfsJ6_4?version=3&hl=ja_JP" type="application/x-shockwave-flash" width="420" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>


(2) 新しい埋め込みコードは「<iframe...」で始まり、Flash と HTML5 動画に対応-使用できないブログもある ・アスベスト比　１６：９の場合
<iframe width="560" height="315" src="//www.youtube.com/embed/m8EldpeRfXc" frameborder="0" allowfullscreen></iframe>

・アスベスト比　４：３の場合
<iframe width="420" height="315" src="//www.youtube.com/embed/HL4IZfsJ6_4" frameborder="0" allowfullscreen><//iframe>


(3) ブログがYouTube の oEmbed APIに対応している場合、URLを貼り付けるのみ-使用できるブログは少ない http://www.youtube.com/embed/dBgxFAgijlo


動画のコントロールバーを含まない映像部分の大きさ（サイズ）は、
アスベスト比が４：３の場合、420×315、480×360(デフォルト）、640×480、960×720(ピクセル）が基本になります。
また、アスベスト比が１６：９の場合、560×315、640×360(デフォルト）、853×480、1280×720(ピクセル）が基本になります。
動画のアスベスト比を知る方法は、動画の再生中に画面上で、右クリックして「動画情報を表示する」をクリックすると、動画サイズが表示されます。
たとえば、640×360と表示された場合、横を高さで割ると、640÷360＝1.777...となます。
答えが、1.777..の場合アスベスト比が１６：９（下の画像の例）、答えが、1.333..の場合アスベスト比が４：３です。
  動画情報表示 アスベスト比が１６：９の動画
（注：YouTubeは、埋め込みプレーヤーのサイズを動画の映像部分の大きさと同じにしています（下画像）。以前は高さにコントロールバーの高さを加えていた。）
  YouTUbe再生画面の共有→埋め込みコードのサイズカスタマイズの部分



←アスベスト比が１６：９の
埋め込みプレーヤーのサイズの例
（ｺﾝﾄﾛｰﾙﾊﾞｰの高さが加算されていない）
・左のマス（幅　width)に好みの数字を入力すると、右のマス（高さ　height)は自動計算されます。(width=500の例）
埋め込みプレーヤーのサイズ
・プルダウンメニューの「カスタマイズ」をクリックすると、４つのデフォルトサイズが表示されます。好みのサイズをクリックします0。

※現在、ＵＲＬのhttp:部分(プロトコル表記)が省略されるようになった。
省略の例．"//www.youtube.com/embed/RnDZB4r13qo" (http: 部分省略。以下同様。）
▽フルコード
<iframe width="560" height="315" src="//www.youtube.com/embed/RnDZB4r13qo" frameborder="0" allowfullscreen></iframe>　
  YouTUbe再生画面の共有→埋め込みコードのサイズカスタマイズの部分



←アスベスト比が４：３の
埋め込みプレーヤーのサイズの例
（ｺﾝﾄﾛｰﾙﾊﾞｰの高さが加算されていない）
(上図アスベスト比が１６：９、下図アスベスト比が４：３の埋め込みプレーヤーのサイズ。「共有」→「埋め込みコード」で表示される部分。）
埋め込みプレーヤーのサイズは、この高さにコントロールバーの高さ25を加えるとよいでしょう(YouTubeは30と言っている）。
（例）埋め込みプレーヤーのサイズは、YouTubeがカスタマイズするサイズ560×315のとき左右に黒の背景が見えちょっと気になります(下左）。
実際に埋め込む場合は、高さにコントロールバーの高さ(25)を加えるときれいに表示されます。サイズは560×315→560×340（縦のみを+25）（下右）。
YouTubeのカスタマイズサイズ560x315そのまま YouTubeのカスタマイズサイズ560x315にコントロールバーの高さ25を加えて補正560x340

(注)画像は横を320pxに縮小表示しています。
この動画はアスベスト比１６：９です。
http://www.youtube.com/watch?v=Fb4jRjSGvw0

左、YouTubeがカスタマイズしたサイズ560×315。

右、コントロールバーの高さ25を加えて補正560x340。
なお、YouTube再生ページからブログに自動貼り付けしたときの大きさは、459×344（4:3）、480×270（16:9）です。
ブログなどに実際に貼り付ける場合は、HTMLやブログの配置などで自由に好みの大きさに調整しましょう。
大きさの値が多少間違っても、表示は自動的に調整してくれます。
（注：動画をきれいに表示させるには、高さで調整します。画面の左右に黒の背景が見える場合は、高さを増やし調整し、
画面の上下に黒の背景が見える場合は、高さを減らして調整します。）
【埋め込みサイズのカスタマイズ計算例】サイズ変更により、再生ボタンのみ（映像非表示）をブログなどに埋め込みができます
 
▼HTML貼り付け例（実際は、赤字の部分の<object>から</object>まで１行でコピーされます）標準の埋め込みコード 
<!--動画埋め込みタグ↓-->
<object width="560" height="345">
<param name="movie" value="http://www.youtube.com/v/RnDZB4r13qo?version=3&hl=ja_JP">
</param><param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/RnDZB4r13qo?version=3&hl=ja_JP" 
type="application/x-shockwave-flash" width="560" height="345" 
allowscriptaccess="always" allowfullscreen="true">
</embed>
</object>

<!--動画埋め込みタグ↑-->
埋め込みコード：

▼フレームに色を付けたり、高画質を表示する、自動再生にしたいなどの修正例-青色の部分（サイズは変えない例） 
<html>

<body>

<!--動画埋め込みタグ↓-->
<object width="560" height="345">
<param name="movie" 
 value="http://www.youtube.com/v/RnDZB4r13qo?version=2&hl=ja_JP&color1=0xff00ff&color2=0xffff00&border=1&hd=1&autoplay=1">
</param><param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed 
 src="http://www.youtube.com/v/RnDZB4r13qo?version=2&hl=ja_JP&color1=0xff00ff&color2=0xffff00&border=1&hd=1&autoplay=1" 
type="application/x-shockwave-flash" width="560" height="345" 
allowscriptaccess="always" allowfullscreen="true">
</embed>
</object>

<!--動画埋め込みタグ↑-->
</body>
</html>
埋め込みコード：
【説明」埋め込みプレーヤーのパラメータ（パラメータは、半角アッパサンド&　または　&amp;で区切ります）
 （注）埋め込みコードがiframeタグの場合は、使用できるパラメータは、autoplay（自動再生パラメータ）、fs、showinfo、iv_load_policyのみです。（2012.1.4）
  1. rel：関連動画を読み込むかどうかを指定
    値: 0 または 1。デフォルトは 1 です。最初の動画の再生を開始した後、プレーヤーで関連動画を読み込むかどうかを指定します。
    関連動画は、メニュー ボタンをクリックするとジニー メニューに表示されます。
    プレーヤー検索機能は、rel を 0 に設定すると、無効になります。
  2. start：再生位置の時間指定（startパラメータは、正式の埋め込みパラメータではありません）。
    動画の再生開始位置の指定を行います。例：start=120　（単位は秒）
  3. border：埋め込みプレーヤーのフレーム（パネル）画面に枠を付けたいと場合1を指定します（下の再生例１）。
    付けたく無い場合は0を指定するかborderパラメータを省略します（下の例２）。デフォルトは0です。 例；border=1
    なお、borderの値が0またはborderパラメータを省略しても、つぎのcolor1 , color2を指定するとコントロール バーには色が付きます。
  4. color1 , color2：color1は境界線(枠）のメイン カラー、color2 はコントロール バーの背景色と境界線のサブ カラーです。
    ２つの色を16進で指定します。16進rrggbbの前に#でなく、0xを付けます。例；color1=0xff00ff ≫カラーコード
    コントロールバーのみ色を付けたい場合は、borderの値を0にするかborderパラメータを省略します。
    また、カラーを有効にするためには、versionパラメータの値を2にするか、無指定にする必要があります。

    (説明）

    ・color1
    画面の境界線(枠）のメインカラー（①）および
    コントロール バーの境界線(枠）のカラー（②）
    （例はff00ff：Magenta　マジェンタ）

    ・color2
    画面の境界線(枠）のサブカラー（③）および
    コントロール バーの背景のカラー（④）
    （例はffff00：Yellow　黄色）

  5. autoplay：値は、 0 （自動再生しない）または 1（自動再生する）。デフォルトは 0 です。プレーヤーが読み込まれたときに、
    最初の動画を自動再生するかどうかを指定します。
  6. loop：動画の繰り返し再生の指定(自動再生）。
    値: 0 または 1。デフォルトは 0 です。単一動画プレーヤーの場合、1 を設定すると、最初の動画が繰り返し自動再生されます。
    再生リスト プレーヤーまたはカスタム プレーヤーの場合、再生リスト全体を再生した後、最初の動画から再び再生が始まります。
  7. hd：値は、0 または 1。デフォルトは 0 です。1 に設定すると、デフォルトで HD（高画質）再生が有効になります。
    この設定は、クロムレス プレーヤーには影響しません。
    また、動画の HD 版を使用できない場合もこの設定はプレーヤーに影響しません。
  8. version：値が 3 の場合、AS3埋め込みプレーヤー。パラメータ省略の場合は、AS3埋め込みプレーヤー。
    AS3(ActionScript 3)埋め込みプレーヤーのURLはhttp://www.youtube.com/v/VIDEO_ID?version=3 、
    AS2埋め込みプレーヤーのURLはhttp://www.youtube.com/v/VIDEO_IDになります。
    AS3埋め込みプレーヤーの場合、大きさは画面の右下が基準になります。
    サイズ変更時（再生ボタンのみ表示など）やカラーパラメータを有効には AS2埋め込みプレーヤー(version=2）を指定してください。
  9. 埋め込みプレーヤーのパラメータの詳細は、Googleサイトを参照してください。
    埋め込みプレーヤーのパラメータには、rel,autoplay,loop,enablejsapi,playerapiid,disablekb,egm,border,color1, color2,start,fs,hd,showsearch,showinfo,iv_load_policy,cc_load_policy があります。
    埋め込みコードがobject/embedタグの場合すべてのパラメータが使用できますが、iframeタグの場合使用できるパラメータは、autoplay,fs,showinfo,iv_load_policy のみです。
　なお、これらの一部のカスタマイズは、YouTubeの再生ページで行うことができます。
その結果は、埋込みタグに反映されます。>カスタマイズ例
 
▼再生例１ 大きさ：480X303 rel=1( 関連する動画を含める)
埋め込みコード：
▼再生例２ 　ブログのサイドバーなどの動画サイズに
縮小例　大きさ：180X121

※上の動画は、再生開始位置の指定を行っています。
  120秒後から再生します。（start=120）

埋め込みコード：

▼再生例３-1 再生ボタン（start/pause)、ボリュームボタンのみ表示
（映像部分非表示-ブログ向き）大きさ：60X25
埋め込みコード：
　　
※border=0とするかborderを省略します。縦幅は、25が最適。横幅は、好みの幅に。
※AS3埋め込みプレーヤーの場合（http://www.youtube.com/v/VIDEO_ID&version=3）、
versionパラメータの値を2にしてください。
※埋め込みタグコードは、objectタグであること。
▼再生例３-2 再生ボタン（start/pause)のみ表示
（映像部分非表示-ブログ向き）大きさ：30X25
埋め込みコード：

※border=0とするかborderを省略します。縦幅は、25が最適。横幅は、好みの幅に。
※AS3埋め込みプレーヤーの場合（http://www.youtube.com/v/VIDEO_ID&version=3）、
versionパラメータの値を2にしてください。
※埋め込みタグコードは、objectタグであること。
 
▼再生例４(複数動画の連続再生。６つの動画の連続再生例。）（2011.10.13更新）
YouTubeでは、アカウントを取得すると、好きな動画を複数同時に、HTML（ブログ）に埋め込むことができ、連続再生ができます。
このような埋め込みプレーヤーのカスタマイズ方法は、自分のアカウントページで再生リストの埋め込みタグをHTML(ブログ）に貼り付けます。
なお、従来のカスタムプレーヤー（http://www.youtube.com/my_players）は廃止になりました。今後は再生リストの埋め込みタグを用います。


（従来のカスタムプレーヤー）


（再生リストの埋め込みタグを使用した埋め込みプレーヤー（iframeタグ）。６つの動画が埋め込まれています。）

再生中の動画は、キーボードで次のような操作ができます。
  • スペースキー：再生/一時停止
  • 左矢印キー：現在の動画を再生し直す
  • 右矢印キー：現在の動画を 10% 先に進める
  • 上矢印キー：ボリュームを上げる
  • 下矢印キー：ボリュームを下げる
 
YouTubeページで、埋め込みコード（埋め込みプレーヤ）のカスタマイズ例 


<object width="580" height="360">
<param name="movie" 
value="http://www.youtube.com/v/RnDZB4r13qo?version=3&hl=ja_JP&fs=1&color1=0xe1600f&color2=0xfebd01&border=1"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/RnDZB4r13qo?version=3&hl=ja_JP&fs=1&color1=0xe1600f&color2=0xfebd01&border=1" 
type="application/x-shockwave-flash" 
allowscriptaccess="always" allowfullscreen="true" width="580" height="360">
</embed>
</object>
  • ①「共有」ボタンを押します。
  • ②「埋め込みコード」ボタンを押します。
  • ③「 関連する動画を含める」や「古い埋め込みコードを使用する [?] 」を選択します。
    「古い埋め込みコードを使用する [?] 」にチェックを入れるとembed codeタグ（<object ・・・）が⑤に生成されます。
    「古い埋め込みコードを使用する[?]」にチェックを入れないとiframeタグが⑤に生成されます。
    &rel=0：0は、関連する動画を含めない。1は、関連する動画を含める（rel=が無い場合は 1）。
    &border=1：0は、「境界線の表示」を入れない。1は、「境界線の表示」を入れる。
  • color1 は境界線のメイン カラー、color2 はコントロール バーの背景色と境界線のサブ カラーです。
    カラーを指定する場合は、version=3をversion=2に変更してください。
  • （width height サイズパラメータ）
    ④の左の方「埋め込みプレーヤ」のサイズを選択します。または、
    ④でサイズを好みの大きさに指定できます。横（width）を入力すると、縦（height)は自動計算されます。
  • ⑤「埋め込みコード」（<object ・・・）をコピーします。
  • 埋め込みプレーヤーのパラメータの詳細は、Googleサイトを参照してください。
    埋め込みプレーヤーのパラメータには、rel,autoplay,loop,enablejsapi,playerapiid,disablekb,egm,border,color1, color2,start,fs,hd,showsearch,showinfo,iv_load_policy,cc_load_policy があります。
 
４．Yahooブログの例（YouTube)
 
YahooブログにYouTubeを貼り付けるには、３つの方法があります。
  1. YouTube再生画面の下の「共有」をクリックし、「その他▼」をクリックしブログ名を表示します。
    そして、「yahoo! japan」の文字をクリックすると新規記事に自動貼り付けできます。（かんたんモード画面）
  2. YouTube再生画面のアドレスバーなどの動画URLをコピーし、Yahooブログの新規投稿画面（かんたんモード画面）でつぎの操作をします。
    • 「動画、ブログパーツのURLを指定して記事にはりつける 」アイコンをクリックします。（①）
    • 「動画、ブログパーツのURLを指定して記事にはりつける 」画面にて、動画URL（②）、動画の配置（③）、埋め込み動画の横幅（④）や高さ（⑤）
      を入力し、「OK」（⑥）をクリックします。
    • 動画が埋め込まれると絵柄が表示されます
  3. YouTube再生画面の下の「共有」をクリックし、次に「埋め込みコード」をクリックすると、「埋め込みコード」が表示されます。
    その埋め込みコードを、Yahooブログの動画のwiki文法の書式に変換し、「Wiki、HTMLモード」画面にて、記事に貼り付けます。
    ここではこの２．の方法について述べます。
    ※予め、Yahoo!ブログは「新規投稿」画面を「Wiki、HTMLモード」画面に変えて「Wiki文法使用」にチェックを入れておきます。
  
<!--YouTube埋め込みコード↓-->
<object width="580" height="360">
<param name="movie" value="http://www.youtube.com/v/RnDZB4r13qo&hl=ja&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="http://www.youtube.com/v/RnDZB4r13qo&hl=ja&fs=1" 
type="application/x-shockwave-flash" allowfullscreen="true" width="580" height="360">
</embed>
</object>
<!--動画埋め込みコード↑-->

↓↓↓Yahoo!「Wiki文法に変換

[[item(http://www.youtube.com/v/RnDZB4r13qo&hl=ja&fs=1,580,360)]]
 
動画を表示するための書式（wiki文法） ： [[item(埋め込み動画のURL,横のサイズ,縦のサイズ)]]  (2010.2.4修正）


<IFRAME>タグの貼り付け方法-eyeVioやVeohなど
１．eyeVioで再生した動画の左下「貼付けコード」ボタンをクリックすると埋め込みタグが表示されますので、
　そのタグを右クリックでコピーし、HTMLへ貼り付けます（<IFRAME>タグ）
eyeVio 猫
※動画サイトにより、埋め込み（Embed）タグの表示場所や表示方法が異なりますので注意してください。
 
２．HTMLの例
 
上でコピーしたソースコード（<iframe>から</iframe>）を、HTML（ブログ）に貼り付けます。
動画のサイズは、好みにより変更します。ソースコードには、サイズ（width=とheight=）の定義が２箇所ありますので注意してください。
 
HTMLの内容に応じ、適宜縮小します。70%に縮小の場合、例のようにします。 　　
例；
width=400　　521×0.7→365
height=330　　330×0.7→231
▼HTML貼り付け例（実際は、赤字の部分の<iframe>から</iframe>まで１行でコピーされます）
<html>

<body>

<!--動画埋め込みタグ↓-->
<iframe src="http://eyevio.jp/embed.do?movieId=98808&width=521&height=330" 
style="margin: 0px; width: 521px; height: 330px;" frameborder="0" scrolling="no"
></iframe>
<!--動画埋め込みタグ↑-->

</body>
</html>
（注）このHTML例は、<iframe>タグのため、<object>や<embed>タグのように動画をアクティブ化する必要はありません。
 
▼再生例１
▼再生例２　動画サイズを70%縮小例

サイズ：width="365" height="231"


<EMBED>タグの貼り付け方法-Metacafe、ifilm、Putfile など
１．Metacafeで再生した動画の下の「Embed」に、埋め込みタグが表示されています。
　そのタグをコピーし、HTMLへ貼り付けます（<EMBED>タグ）
myspace Thousand Words - Koda Kumi, support FF
※動画サイトにより、埋め込み（Embed）タグの表示場所や表示方法が異なりますので注意してください。
 
２．HTMLの例
 
上でコピーしたソースコード（<iframe>から</iframe>）を、HTML（ブログ）に貼り付けます。
動画のサイズは、好みにより変更します。ソースコードには、サイズ（widthとheight）の定義は、EMBEDタグの場合１箇所です。
 
HTMLの内容に応じ、適宜縮小します。75%縮小の場合、例のようにします。 　　
例；
・width=400　400×0.75→300　・height=345　345×0.75→258
▼HTML貼り付け例（実際は、赤字の部分の<embed>から</embed>まで１行でコピーされます）
<html>

<body>

<!--動画埋め込みタグ↓-->
<embed src="http://www.metacafe.com/fplayer/4146777/woode_wood_baby.swf" 
width="400" height="345" wmode="transparent" 
pluginspage="http://www.macromedia.com/go/getflashplayer" 
type="application/x-shockwave-flash" allowFullScreen="true" 
allowScriptAccess="always" name="Metacafe_4146777"> 
</embed><br>
<font size = 1><a href="http://www.metacafe.com/watch/4146777/woode_wood_baby/">Woode Wood: Baby</a> 
- <a href="http://www.metacafe.com/">The most amazing bloopers are here</a>
</font>

<!--動画埋め込みタグ↑-->

</body>
</html>
（注１）このHTML例は、動画がアクティブ化されていません。動画をアクティブ化するためには、赤字の部分の<embed>から</embed>までを
　外部JSファイル(Javascriptファイル）で書き出す必要があります。
（注２）<a>タグ部分は、動画再生と直接関係ありません。<embed>から</embed>までのコードで再生できます。
 
▼再生例１（標準　400X345）

Woode Wood: Baby - The most amazing bloopers are here
▼再生例２（縮小例　300X258）

Woode Wood: Baby - The most amazing bloopers are here

<JavaScript>タグのニコ動貼り付け方法-ニコニコ動画の場合
１．ニコニコ動画の再生画面で、その動画の「コメント」の下の「外部サイトに貼付」ボタンをクリックします。（①）
２．「ブログサイトに貼り付ける」画面がすぐ下に表示されます。つぎのどちらか（②か③）を行います。
・動画を貼り付けたい"「ブログアイコン」をクリックすると、ログインされている場合は、新規記事欄にSCRIPTタグが自動設定されます。（②）または
・「外部プレイヤー」のSCRIPTタグをコピーし、ブログの記事欄やHTMLに貼り付けます。（③）
ニコニコ動画再生画面の例
 

■【ニコニコ動画】(無料動画)桜　ショートコント「赤ずきんちゃん」
　（HTMLの貼り付け例）


この動画は、340×285に縮小しています。
縮小の方法は、下の３．HTML例参照。
 
３．HTMLの例
 
ニコニコ動画<JavaScript>タグのHTMLへの貼り付け例を示します。ページの表示したい場所に貼り付けます。
前項２-③外部プレイヤーよりコピーし、HTMLに貼り付けます。 ブログでも同様にできますが、タグが設定可能なブログに限ります。
  
<html>

<body>

 <script type="text/javascript" src="http://ext.nicovideo.jp/thumb_watch/1264248188"></script>
 <noscript><a href="http://www.nicovideo.jp/watch/1264248188">
   【ニコニコ動画】【無料】磯山さやかのラブラブ、磯釣り一本！第二回</a></noscript>

</body>
</html>

・サンプル動画のURL：http://www.nicovideo.jp/watch/1264248188
・動画縮小例；SRCのURLに横の長さ（w）及び縦の長さ（h）を追加します。
          http://ext.nicovideo.jp/thumb_watch/1264248188?w=340&h=285
動画関連サイト内リンク
HOMEへ  最終更新日：2012.12.21　冬至