どうも段田です。
今日はWordPressでGIFアニメを貼り付けるやり方を備忘録として書いておきます。
ポイントは「フルサイズ」
WordPressで画像アップロードをする時、内部で元の画像からいくつかの別サイズの画像を生成します。
別サイズの画像は「サムネイル」「中」「大サイズ」とあり、WordPressの本文内でサイズを選択して画像を挿入することができます。
これ以外にも自分で好みのサイズを指定した画像を生成することができるのですが、今回説明は省略します。
そして、WordPressでGIFアニメを貼り付ける場合は、「サムネイル」「中」「大サイズ」を使った場合、アニメは動きません
「サムネイル」
「中」
「大サイズ」
実際に貼り付けてみました。
それぞれ別サイズで画像として貼り付けられていますが、アニメーションは動きません。
WordPressで画像アップロード時にリサイズしたGIFアニメはアニメーション部分が無効になってしまいます。
ですが、元サイズの画像はリサイズ処理がされないので、アニメーション部分は有効になっています。
そのため、WordPressでGIFアニメを貼り付けるには元サイズの画像である「フルサイズ」を使えば大丈夫です。
WordPressで画像を本文内に挿入する時に赤枠にあるように「フルサイズ」を選択しておきます。
そうするとこのようにアニメーションが有効になっています。
アイキャッチ画像は?
WordPressでアイキャッチ画像を有効にしている場合のお話です。
アイキャッチ画像は記事投稿画面からだとサイズ指定ができませんので、
WordPressのテーマファイルでアイキャッチ画像を呼び出しているthe_post_thumbnailもしくはget_the_post_thumbnailを確認します。
the_post_thumbnail('large');
このようにサイズでlaerge、mediumなどサイズ指定している場合は、
the_post_thumbnail('full');
このように「full」と指定しておきましょう。
参考
最後に
手順は以上になります。
WordPressでリサイズした画像はアニメーションが効かなくなりますので、リサイズしてアニメーションを有効にしたい場合は
PC側で専用のソフトを使ってリサイズしてからアップロードするのが良いと思います。
さて最後にぱくたそさんのGIF画像アニメをいくつか貼って終わりにしたいと思います。
是非ご利用ください(宣伝)
