WordPressでGIFアニメが動かない時の対処法
- 2014/10/24
- HowTo, Webデザインテクニック
- WordPress
今回アイキャッチ画像にGIFアニメを登録したのですが、登録時、また、メディアライブラリ内ではしっかりGIFアニメとして動いているのに、いざ表示されたサムネイルと見てみると、動いてない!!という現象が起こりました。
解決はしたのですが、原因を特定するまで少々時間がかかってしまったので、メモしておきます。
GIFアニメが動かない時の原因
ある条件下ではGIFアニメは動きません。この原因を把握していれば、すぐに解決できるはず!!です。
基本的には、アイキャッチ画像で登録した時に動いていれば、また、メディアライブラリに登録時に動いていれば、とりあえずは動くはずです。
が、その条件としてその登録したサイズでないとダメなようです。
例えば、自動でサムネイルの縮小(拡大)サイズ作成、追加する機能をfunction.phpに書き込んでいたり、『Auto Post Thumbnail』等のpluginを使っている場合は、そのサイズ以外で作ったものは縮小、または拡大され追加されます。
ようするに、150×150 でサムネイルは表示されるのに、それより大きなGIFアニメ(200×200とか)を作って登録してしまうと、
150×150 の縮小されたサイズの動かない “GIF画像” が作られ、それをサムネイルとして表示します。
ですので、”GIFアニメ” としては動かなくなります。
対処法
なので、とりあえずは表示サイズにあったGIFアニメを作って登録すれば、まず大丈夫だと思います。
もし自動で縮小されたものも動かしたい!とかであれば、その縮小されたサイズのGIFアニメも作って、そして表示の名前も同じにして直接FTPソフト等でアップすれば動きます。
場所は何も設定してなければ、
URL/wp-content/uploads/2014/10/thumbnail-100×100.gif
等におそらく入ってます。
場所の確認は、
右クリックで “画像のURLをコピー” 等で探してください。
また、サムネイルでなく、投稿内でGIFアニメを表示したい場合は、登録時にサイズをフルサイズで設定して表示すれば、問題なく動くGIFアニメが表示されるはずです。
大きすぎるサイズのものを作ったら動かない!等の事も聞いた事ありますので、参考まで。
とりあえずはこれで解決できるんじゃないでしょうか?
Google AdS
関連記事
-
-
onMouseOver、onMouseOutで、簡単にテキストを切り替える!
前回のonMouseOver,onMouseOutで簡単に画像を切り替える!の続き、応用編です。 実はこちらサイト…
-
-
【2026最新】スマホ・タブレットの解像度一覧表(画面サイズの割合)iPhone・iPad..
2026/4「解像度一覧表」 更新 フロントエンド(デザイナーやコーダー)の方にとって見やすい表にしています。…
-
-
ドメイン&WordPressを含むサイトの引越しでの、URL変更作業:『DATABASE SEARCH AND REPLACE SCRIPT IN PHP』を使って
最近サーバー移転をして、その時々に起こった問題や注意点を記事にしてましたが(301リダイレクトの記述方法、URLの正規化…
-
-
SNS等の公式ロゴ(アイコン)素材のまとめ(Facebook, Instagram, Youtube, Twitter, Line etc.)
一度サイトを作ってしまうとなかなか更新せず使い回してしまうのが、この『SNSのロゴ(アイコン)』だと思うのですが、サイト…
-
-
検索結果に最終更新日を表示させてクリック率をアップする方法!新規投稿時には公開日を表示させる!
以前は検索結果で1ページ目上位3番目以内に半年以上表示されていた記事が、いきなり圏外となってしまいました。Googleの…





