はてはカスタマイズ

【はてなブログ】スマホやパソコンで撮った動画をGIF形式で記事に貼り付ける

当サイトにお越しいただきありがとうございます。

ブログ運営者のポチ(@sunrise_033)です。

この記事の信用性

2019年4月から「コスパ・お得」をテーマに発信している当サイト「さんログ」を運営、月間平均36000PVの雑記ブロガーです。

iPhoneやMacで撮った動画をはてなブログ記事に貼り付けようとした時にアップロードできなくて失敗していました。

ポチ
ポチ
はてなブログって写真は貼り付けらるのに自撮り動画ははりつけることができない、、。

とか思い悶々していましたが、調べたら出来る方法がわかったので紹介していきたいと思います。

結論からいうと、iPhoneやMacで撮影した動画を「GIF」形式に変更してはてなフォトライフにアップロードすれば貼り付けることができます。

下記はiPhoneのスクショ動画をGIF形式にしたものです。こんな感じにGIF画像にできました。

f:id:sanrisesansan:20201031160254g:plain

この記事で、その方法を詳しく紹介しますので参考にしてみてください。

*この記事は、iPhone・Macの動画形式「MOV」が対象です。

★Androidスマホで撮影した「MP4」動画を貼り付けたい場合は下記サイトさまの記事を参考にしてみてください。

参考記事→コチラ

はてなブログの画像貼り付けは「はてなフォトライフ」経由で行われているよ!

はてなブログで画像を貼り付けるときは、PC編集の場合、編集オプションの「写真を投稿」にPCから画像をは選択して貼り付けると思います。

f:id:sanrisesansan:20201101174536j:plain

実はこの時、「はてなフォトライフ」に一度画像をアップロードして保存してから貼り付けているんですね。

「はてなフォトライフ」には、貼り付けられるフォーマットが決まっていて

・JPEG(JPG)
・PNG

このいずれかのフォーマット形式でアップロードする必要があります。

詳しくは「はてなブログ ヘルプ」で確認してみてください。

iPhone・Macで撮った動画をはてな記事に貼り付ける方法

では、動画の場合はどうなのでしょうか?

先述していますが、iPhone・Macのスクショで撮った動画を「はてな編集」でアップロードしようとしてもエラーになってしまいます。

f:id:sanrisesansan:20201101174641j:plain

こんな感じに、エラーします。

これはiPhone・Macで撮影した動画は「MOV」のフォーマット形式になっているためです。

はてなフォトライフには未対応!

ではどうするのか?

「はてなフォトライフ」のフォーマット形式には、上記の他にもアニメーション画像の「GIF」形式に対応しています。

なので、iPhone・Macで撮影した動画を「GIF」形式にすれば良いんです。

方法はiPhoneとMacで違うのでそれぞれ紹介します。

iPhoneで撮った動画を「GIF」形式に変更する

iPhoneで撮影した動画を「GIF」に変更する時は、iOSで標準アプリとなった「ショートカット」機能を使います。

①まずはiPhoneでショートカットを開きます。

f:id:sanrisesansan:20201101175113j:plain:w330

②ギャラリーをタップします。

f:id:sanrisesansan:20201101175219j:plain:w330

③GIFのためのショートカットで「すべてを表示」をタップします。

f:id:sanrisesansan:20201101175326j:plain:w330

④「ビデオからGIFアニメーションを作成します」をタップします。

f:id:sanrisesansan:20201101181155j:plain:w330

⑤項目の「ショートカット」を追加をタップします。

f:id:sanrisesansan:20201101181601j:plain:w330

この状態で、冒頭のショートカットからアクセスすることができるようになりました。

⑥ビデオからGIFを作成の右上のメニューをタップします。

f:id:sanrisesansan:20201101180340j:plain:w330

⑦検索バーに「保存」と入力して保存先を設定します。

f:id:sanrisesansan:20201101180448j:plain:w330

今回は「写真アルバム」へ保存しました。

f:id:sanrisesansan:20201101180547j:plain:w330

「完了」をタップします。

f:id:sanrisesansan:20201101180631j:plain:w330

完了すると、上の画像のように保存先が表示されます。

⑧マイショートカットから「ビデオからGIFを作成」をタップして、iPhoneで自撮りした動画を編集します。

f:id:sanrisesansan:20201101182429j:plain:w330

⑨カーソルを動かして動画をトリミングし、確認して「保存」します。

f:id:sanrisesansan:20201101182500j:plain:w330

Quick Lookで「GIF」形式が表示されます。「完了」をタップすると保存されます。

⑩はてなブログに貼り付ます。

iPhoneから貼りつかる場合は、はてなブログアプリの編集ページから写真マークをタップします。

f:id:sanrisesansan:20201101185837j:plain:w330

貼り付けたい写真を選択して「完了」します。

参考サイト

→iPhone Mania

Macでで撮った動画を「GIF」形式に変更する

Macのスクショ(「shift」+「command」+「5」)で動画を撮影した動画を「GIF」に変更する時は、「Gifted」というアプリを使います。

①まずは、App Stroreから「Gifted」をインストールします。

f:id:sanrisesansan:20201101184201j:plain:w330

②インストールしたら、「Gifted」を開きます。

f:id:sanrisesansan:20201101184231g:plain:w330

③スクリーンショットで撮影した動画をドラッグ&ドロップで貼り付けます。

f:id:sanrisesansan:20201101184354j:plain:w330

④「Start」をクリックすると、GIF形式に変更されます。その後、動画はFinderに表示されます。

f:id:sanrisesansan:20201101184258j:plain:w330

⑤Finderから保存したいファイル先にドラッグ&ドロップします。

f:id:sanrisesansan:20201101184424j:plain:w330

保存場所は、ファインダー内のピクチャ>Giftedに保存されます。

GIF形式を作成したらすぐ出てくるファインダー画面で保存したいフォルダにドラッグ&ドロップして移したら楽です。

⑥はてなブログに貼り付けます。

Macから貼り付ける場合は、はてなブログの編集ページから「写真」マークをクリックします。

f:id:sanrisesansan:20201101185145j:plain:w330

「写真を投稿」をクリックでFinderが開くので、保存したGIF動画象を選択してアップロードして記事に貼り付けます。

参考サイト

→Qiita 

GIF形式に変更するメリット・デメリット

GIF形式に変更して貼り付けるのにもメリットとデメリットはあると感じたので書いていきます。

メリットは、

・簡単に作成することができる
・容量が軽い

ということですね。

iPhoneでもMacでも簡単にGIF形式にすることができます。

一方、デメリットは

・画質が下がる
・動画がカクカクする

このように思います。

GIF形式にすると容量が圧縮できますが、画質が下がります。

GIFはアニメーション画像なので一般的に時間が長い動画には向きません。

まとめ

はてなブログにiPhone・Macで撮影した動画を記事に貼りつける方法は

・GIF形式に変更する
・iPhoneとMacで使用アプリが違う
・比較的簡単にGIFを作成できる
・画質と動画のスムーズさは下がる

このような感じです。

Macのスクショ動画で動きを見せたい時などに利用してます。
覚えておくと便利ですね。ぜひ、はてなブログに簡易な動画を貼り付けたい時に参考にしてみてください。

最後まで読んでいただき、ありがとうございます。

 

ポチ
ポチ
この記事が良いと思ったら、ポチっ!してくれると嬉しいです!

↓「ブログ村ランキング」参加中!
PVアクセスランキング にほんブログ村

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です