WordPress

WordPressのプラグインでAPNG画像に問題

WordPressにアップロードしたアニメーションPNG画像が正しく再生できないばあいがあるようです。

現在判っている点についてレポートします。

 

アニメーションPNGが再生できない例

ScreenToGifでキャプチャした画面操作をアニメーションGIFとアニメーションPNGのふたつの形式で保存してWordpressの記事に貼り付けようとしたら、アニメーションPNGのほうだけ正常に表示されないという現象に遭遇しました。

Wordpress AnimationPNG アップロード

アニメーションPNGをアップロードする

 

ライブラリに登録した画像をよく見ると拡張子がPNGではなくJPGになっています。

Wordpress AnimationPNG アップロード後

アップロードしたファイル

 

アップロードの途中で勝手に変換されたようで、これが再生できない原因と思われます。

Wordpress 変換されたファイル形式

拡張子がJPGになっている

 

プラグインのない環境で試してみる

念のため現在作成中のサイトでも同じファイルをアップロードして試したところ、そちらは問題なくアップロードされていました。

Wordpress AnimationPNGアップロード例

プラグインが異なる環境でのアップロード結果

 

そこで、このサイトで使用しているプラグインに原因があると考えて、EWWW Image Optimizerを無効化して試したところ、こんどはJPGに変換されることもなくPNGとしてアップロードできました。

アップロード直後の画面でもアニメーションが動作しています。

Wordpress EWWW Image Optimizer

EWWW Image optimizerを無効化する

 

あとは、[メディアを追加]でふつうに画像を挿入してやればページを開いたときアニメーションが再生されます。

Wordpress 画像ライブラリから選択

ライブラリから画像を挿入する

実は、最初試したときはページを読み込んだだけでは再生されなかったのですが、何回かチェックを繰り返しているうちに埋め込み画像でもページを表示するだけでアニメーション再生できるようになりました。

 

アップロードの時は一時的に無効化

EWWW Image Optimizerは、画像を圧縮してファイルサイズを減らすプラグインです。

これがAnimation PNGを正しく認識できず、圧縮と同時にファイル形式まで変換しているものと思われます。

もし、EWWW Image Optimizerを使っているときは、アニメーションPNGをアップロードするときだけ、一時的に無効化してみるといいでしょう。

ScreenToGif サンプル アニメーションPNG版

アニメーションPNG版の例

 

-WordPress
-, ,