WP Loading Gif Animations Plusでぼやけない画像を設定する方法

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

こんにちは、WPホームページ研究所の運営サポートチーム(@WP_LABO)です。

本日は「にじまないローディング画像の設定方法」をご紹介いたします。

初心者さん
最新のRatinaモニターでも旧型の古いモニターでもぼやけない綺麗なローディング画像を表示したい。上手に設定するにはどうすればいいのかな・・・。

こんな疑問にお答えしていきます。本記事で解説するプラグインは以下を使用。

ワードプレスにローディング画面を素早く導入できる便利プラグイン「WP Loading Gif Animations Plus」

使い方は別の記事でもまとめているのでぜひ併せてご参照ください。

1. WP Loading Gif Animations Plusの使い方を徹底解説
2. WP Loading Gif Animations Plusをスマホで設定する手順

以下では「ぼやけないローディング画像の設定手順」を解説させていただきます。

WP Loading Gif Animations Plusでぼやけない画像を設定する方法

結論から言うと「横48px縦48pxのローディング画像を設定」すればOKです。

▼バージョン1.1.4以降からあらゆる画像サイズに対応(追記:2022年12月9日)
https://wp-labo.com/loading-gif-animation-image-fix/

下記はバージョン1.1.3以前の記事です。

横縦48pxの画像を設定した場合

最新モニターでは横縦ともに裏側で24pxへ自動調整(旧型モニターでは48pxのまま表示)が入ります。

上記のローディング画像は横縦48pxです。設定画面に当て込みました。

設定後のスマホ画面が以下です。読込み画像を見せるためにループ処理しています。設定画面で「読込み画像」として選択した画像が綺麗に表示されていますよね。Retinaなので24pxに自動縮小されています。

ただ、上記は書き出し画像(GIFアニメーション)なので、通常より画質が悪く見えるかもしれません。画質というよりも「変更したローディング画像の見え方」としてご確認いただくのがおすすめです。以前に別の記事で検索結果からサイトに訪れた際のローディング画像も掲載しているのでぜひ併せてご参考ください。

WP Loading Gif Animations Plusの使い方を徹底解説

最新式の無料プラグインを事前公開

WordPressは公式サイトに登録済みのプラグインだけで全機能を補足しきれません。当サイトでは使いやすさを追求した魅惑的なプラグインを無料でダウンロードいただけます。運営ホームページのマーケティング力をさらに高めるチャンスです。まずは無料でDLしてお試しくださいませ。
改良されたプラグインを確認する

ワードプレス専門家に丸投げする

WPホームページ研究所はワードプレスを中心としたブログ作成・ホームページ制作・オウンドメディア構築・プラグイン設定・調整など幅広いカスタマイズに対応しております。 記事の掲載情報だけでなくお好みの機能をいただければ専属スタッフが心を込めて真摯に対応させていただきます。お気軽にお問い合わせください。

お問い合わせの種類をお選びください(もっとも近い項目)

法人の場合は法人名とご担当者のお名前をご入力ください

返信時のご連絡に利用するメールアドレスをご入力ください

運営中のウェブサイトURLがあればご入力ください

お困りの内容があれば詳しい内容をお聞かせください

💻SEOに強いWordPressテーマ

⇒ 大人気のワードプレステーマ「賢威」 2万を超えるお客様がご使用中!

ローディング画面を導入してみませんか?

こんにちは、WPホームページ研究所の運営サポートチーム(@WP_LABO)です。

こんなお悩みはありませんか?

・ローディング画面を表示できるプラグインを探している
・ローディング用の画像を管理画面上から差し替えたい
・ローディング画像の上に運営サイトロゴを表示させたい

当サイトではワードプレスに関する導入相談を承っています。ローディング設定専用のプラグインは以下のボタンをクリックしてご確認くださいませ。なお、ご自身でのセッティングがむずかしい方へ向けて代行設定も行なっています。

最新式の無料プラグインを事前公開

WordPressは公式サイトに登録済みのプラグインだけで全機能を補足しきれません。当サイトでは使いやすさを追求した魅惑的なプラグインを無料でダウンロードいただけます。運営ホームページのマーケティング力をさらに高めるチャンスです。まずは無料でDLしてお試しくださいませ。
改良されたプラグインを確認する

ワードプレス専門家に丸投げする

WPホームページ研究所はワードプレスを中心としたブログ作成・ホームページ制作・オウンドメディア構築・プラグイン設定・調整など幅広いカスタマイズに対応しております。 記事の掲載情報だけでなくお好みの機能をいただければ専属スタッフが心を込めて真摯に対応させていただきます。お気軽にお問い合わせください。

お問い合わせの種類をお選びください(もっとも近い項目)

法人の場合は法人名とご担当者のお名前をご入力ください

返信時のご連絡に利用するメールアドレスをご入力ください

運営中のウェブサイトURLがあればご入力ください

お困りの内容があれば詳しい内容をお聞かせください


プラグインを手に入れる