PR トラブル対策

WordPressでアップロードしたGIFアニメが動かない時の解決法

GIFアニメを作って記事に挿入したのはいいけど・・・なぜか動かない…

アップロード中は動いているけど、アップロードが完了すると・・・動かない…

プレビューで確認しても・・・動いていない…

・・・というGIF動かない問題に困っていませんか？

ぼくもこの問題に直面しました。

他に所有しているサイトでは普通に動いているのに、なぜこのサイトでは動かないんだ・・・と。

AFFINGERがおかしいのか？・・・とまで思いました。

結論からいうと、GIFアニメが動かないのは、ただの「画像サイズ」の問題です。

それでは詳しく解説していきます。

WordPressの環境

  • WordPressバージョン：5.8.3
  • テーマ：AFFINGER6
  • エディタ：ブロックエディタ

アップロードしたGIFアニメが動かない時の解決法

アップロードしたGIFアニメが動かない原因は、画像サイズが「フルサイズ」じゃないからです。

画像サイズには、

  1. サムネイル
  2. 中
  3. 大
  4. フルサイズ
  5. 会話風アイコン

この5種類があります。

この中の「フルサイズ」以外は、どれを選んでもGIFアニメは動きません。

実際にGIFアニメをアップロードして、画像サイズを「大」と「フルサイズ」に変えてみました。

GIFアニメで見る↓

GIFアニメはフルサイズでしか動かない！

たったこれだけのことでした。。。

メディアに直接アップロードするとGIFが動かない？

GIFアニメが動かない原因を調べていると、こんな情報を見つけました。

「管理画面左側のメニュー「メディア」に直接アップロードしたGIFは動かないらしい」

結論からいうと・・・普通に動きます！

実際にやってみました。

  • 「メディア」に直接GIFをアップロード
  • 投稿記事の画像ブロックからメディアライブラリを開く
  • GIFのファイルを選択し挿入
  • ブロック設定で画像サイズをフルサイズにする

これで普通にGIFが動いたので、もしかしたら過去のWordPressでは動かなかったのかもしれません。

現時点のWordPress（バージョン5.8.3）では問題なく動くので安心してください。

-トラブル対策