2008年2月19日火曜日

アメブロで YouTube、ニコニコ動画を貼り付ける

0. 目次

アメブロで、動画サイトにある動画を、ブログの記事に埋め込みたい。

最初に Youtube の動画を埋め込むための、2つの方法を説明する。

Youtube 以外の動画サイトでは、埋め込みコードの取得方法が違うだけで、その他の手順は同じ。

動画サイトによっては、ワンクリックで投稿するためのボタンが用意されている場合もある。

 

1. ワンクリックで Youtube の動画を新規記事に投稿する場合

新規記事として動画を投稿したい場合、最初に YouTube で動画を表示する。

  1. 動画の下にある「共有ボタン」を押す。
  2. 右下にボタンが表示されたら、「その他」を選択する。
  3. Ameba のボタンをクリック。

img_0132

これにより、アメブロのエディタがポップアップする。

 

a. 新エディタを使っている場合

タイトルを入力し、下にある「表示の確認をする」をクリックすると、動画を確認できる。

img_0133

 

b. 標準エディタ、タグ編集エディタを使っている場合

タグ編集エディタが表示されるので、タイトルを入力し、左下の「プレビュー」ボタンをクリックすると、動画を確認できる。

img_0134

 

2. 手動で Youtube の埋め込みコードを貼り付ける場合

既に記事を作成している場合や、複数の動画を投稿したい場合、コードを手動で埋め込む必要がある。

最初に、YouTube で、貼り付けたい動画を表示させる。

  1. 動画の下にある「埋め込みコード」ボタンを押すと、
  2. その下のフィールドに、動画を埋め込むためのコードが表示されるので、コピーする。

12-02-20112

次に、アメブロで、「ブログを書く」の画面を開く。

 

a. 新エディタを使っている場合
  1. 記事を書く領域の上にある「HTML表示」を選択する。
  2. コピーしたコードを貼り付ける。

img_0132

「通常表示」を選択すると、埋め込んだ動画がアイコンとして表示される。

img_0133

 

b. 標準エディタ、タグ編集エディタを使っている場合

最初に、標準エディタを使っている場合、タグ編集エディタに変更する。そのために、エディタの上部に表示されている

YouTubeなどのコンテンツを貼り付けるには、こちらをご利用ください。

の「こちら」をクリックする。

SnapCrab_NoName_2012-8-31_5-23-41_No-00

タグ編集エディタが表示されたら、

  1. 先ほどコピーしたコードを、貼り付ける。
  2. 「プレビュー」ボタンを押す。

SnapCrab_NoName_2012-8-31_5-21-15_No-00

3. ニコニコ動画を埋め込む場合

ニコニコ動画の場合、埋め込みたい動画を表示したら、右下の「共有」ボタンを押す。

  • ニコニコ動画では、ワンクリックで動画を投稿する方法が用意されている。 … 2-a
  • 手動で埋め込みたい場合、右下のコードをコピーして、貼り付ける。 … 2-b

img_0134

6コメント:

匿名 さんのコメント...

ありがとうございます。すごく分かりやすい説明でした。他の方の説明だと初心者には分からなくて…。本当に感謝です☆

匿名 さんのコメント...

上記の方と同じく大変分かりやすく、YouTube動画の貼り付けの際に役に立ちました。有難うございまし^^。

匿名 さんのコメント...

すごく分かりやすい説明で
アメーバのサイトでは「何これ」だったのが
一瞬で理解できました!ありがとうございます!!

匿名 さんのコメント...

助かりました!ありがとうございます!

匿名 さんのコメント...

スミマセン・・・
「2. 手動で Youtube の埋め込みコードを貼り付ける場合」→「b. 標準エディタを使っている場合」を試してみたのですが・・・
 
保存・投稿しようとすると、「記事内容に禁止タグが入力されています。」と表示され、保存や投稿ができませんでしたが・・・

jutememo さんのコメント...

訂正します。
標準エディタではなく、タグ編集エディタを使ってみてください。