はてなブログのアイコンの設定がまるっと分かりますよ!

はてなブログのアイコンの設定をまるっと説明!のアイキャッチ画像

ぴっぴです!

今回は少し前にしていました「はてなブログのアイコンの変更」を説明しますので、困ったときにご覧ください。

このアイコンをきちんと設定すると、スマホのホーム画面でボヨヨ~ンとアイコンとして表示できますよ。

自分のブログのアイコンがスマホに載るのって、すごくないですか?

注意

よくブログアイコン――専門用語でファビコンと言います――とプロフィール画像を混同される方がいらっしゃいます。しかしブログアイコンとプロフィール画像は全く用途の違うものです。念のためにお伝えしておきますが今回お話していますのは、はてなブログのブログアイコンですので、お間違いなきようご注意くださいませ。

はてなブログのアイコンの設定の仕方

はい、はてなブログのアイコンの設定は2つの手順に分かれます。

それはアイコン作りとアイコンの設定です。

あなたのブログの顔になるアイコンを作って設定しましょう。

アイコン作り

アイコン作りは割愛します。

ごめんなさい。

その代わりに素材集とアイコン作りに便利なアプリを紹介しますので、ご利用くださいね。

  • 素材集
  • アイコン作りに便利なアプリ

素材集

アイコン作りに便利なアプリ

作ったアイコンを設定する!

はい、アイコン作りが終わったら、いよいよブログにアイコンを設定しましょう。今回も画像イッパイ使って紹介します!

1設定を押す!

はてなブログのアイコンの設定の仕方1の画像

はい、いつものダッシュボード画面です。

あ、いつもダッシュボード画面から始めていますが、画像みたいに左側にメニューが並んでいるなら、違う画面でも大丈夫です! 

上の画像の赤枠で囲んでいる「設定」にマウスで矢印を合わせてください。

矢印を合わせたらマウスの左側のボタンを押します。カチッ!

2ファイルを選択を押す!

はてなブログのアイコンの設定の仕方2の画像

すると上の画像みたいに「設定」画面に移動します。

そしたら画面の真ん中あたりにある「ファイルを選択」を押してください。

カチッ!

あ、ファイルを選択は上の画像の赤い枠で囲んでいるところにありますよ。

3アイコンを選ぶ!

はてなブログのアイコンの設定の仕方3の画像

はい、するとホヨヨ~ンてファイルが開くので、作ったアイコンを保存しているファイルを開きましょう。

そしてアイコンにマウスで矢印を合わせてください。

矢印を合わせたらマウスの左側のボタンを押して、ファイル窓の右下にある「開く」を押します。

カチッ!

4確認

はてなブログのアイコンの設定の仕方4の画像

はい、するとさっきの設定画面に戻りますので、上の画像の赤枠で囲んでいるところを見てください。

画像を設定する前は「選択されていません」というメッセージでしたが、アイコンを選ぶと赤枠で囲んでいるところみたいに画像ファイルの名前に変わります。

5変更するを押す!

はてなブログのアイコンの設定の仕方5押す!

はい、確認したらマウスの真ん中にあるクルクルを手前に回してください。

もうこれ以上、画面が動かなくなると上の画像みたいなものになります。

そしたら、赤枠で囲んでいる「変更する」をカチッと押してください。

6設定おわり。ブログを確認する!

はてなブログのアイコンの設定の仕方6の画像

すると上の画像みたいに、設定画面の上に「設定を更新しました」というメッセージが表示されます。

これが表示されていたら終わりです。

念のためブログを表示してみてください。

パソコンの場合、ウインドウのタブに設定したアイコンが表示されていたら大丈夫ですよ!

スマホはホーム画面にあなたのブログをブクマして、アイコンが表示されたら問題ありませんよ。

 

はい、お疲れ様でした。

アイコンの削除と変更の仕方

次はアイコンの削除と変更の仕方を紹介します。

もしも設定したアイコンに飽きたり嫌になったりしたときに活用してください。 

  • 削除の仕方
  • 変更の仕方

削除の仕方

アイコンの削除の仕方は、ぴっぴでもできるくらい簡単です。

なのでドキドキしないで落ち着いてしましょう。

慌てそうになったら今回の記事を見ながらアイコンを削除してくださいね。

1ダッシュボード画面から設定画面に移動

アイコンの削除の仕方1の画像

はい、お馴染みのダッシュボード画面です。

赤枠で囲んでいる「設定」を押します。

2設定画面で画像を削除するボタンを押す

削除の仕方2の画像

はい、設定画面に移動したら、赤枠で囲んでいる「画像を削除する」をご覧ください。

で「画像を削除する」の左側にある▢にマウスで矢印を合わせます。

そしてマウスの左側のボタンを押してください。

すると上の画像みたいに▢にチェックが入って青くなります。

3変更するを押す!

アイコンの削除の仕方3の画像

はい、▢にチェックが入って青くなったらマウスの真ん中にあるクルクルを手前に回してください。

もうこれ以上、画面が動かなくなると上の画像みたいなものになります。

そしたら、赤枠で囲んでいる「変更する」をカチッと押してください。

4アイコンの削除はおわり

アイコンの削除の仕方4の画像

すると上の画像みたいに、設定画面の上に「設定を更新しました」というメッセージが表示されます。

これが表示されていたら終わりです。

念のためブログを表示してみてください。

お疲れ様でした。

変更の仕方

アイコンの変更の仕方も全然難しくありません。

なぜなら、ほとんどアイコンの設定と変わらないからです。

なのでアイコンの設定ができたら、アイコンの変更もできると思います。

アイコンの変更は全然難しくありませんが、それでも不安な方は今回の記事を見ながら挑戦してくださいね。

1 ダッシュボード画面から設定画面に移動

アイコンの変更の仕方1画像

はい、お馴染みのダッシュボード画面です。

赤枠で囲んでいる「設定」を押します。

2設定画面でファイルを選択するボタンを押す

アイコンの変更の仕方2画像

はい、設定画面に移動したら、赤枠で囲んでいる「ファイルを選択」にマウスで矢印を合わせてください。

矢印を合わせたらマウスの左側のボタンを押します。 

3ファイルの中からアイコンを選ぶ

アイコンの変更の仕方3画像

するとボヨヨ~ンとファイルが開きますので、その中からアイコンにする画像を選んでください。

画像を選んだらファイル窓の右下にある「開く」を押します。 

4 設定画面で画像が指定されていることを確認する

アイコンの変更の仕方4画像

はい、ファイル窓の「開く」を押したら再び設定画面に戻ります。

そのとき赤い枠で囲んでいるところに画像名が指定されていることを確認してください。

5設定画面下にある変更するボタンを押す

アイコンの変更の仕方

画像の指定を確認できたら、マウスの真ん中にあるクルクルを手前に回してください。

もうこれ以上、画面が動かなくなると上の画像みたいなものになります。

そしたら、赤枠で囲んでいる「変更する」をカチッと押してください。

6アイコンが変わったことを確認する

アイコンの変更の仕方6画像

すると上の画像の赤枠で囲んでいるところに「設定を更新しました」というメッセージが表示されて、ブログアイコンのところに変更した画像に変わります。なので、その2つを確認してください。

これでアイコンの変更は終わりです。お疲れ様でした。 

アイコンが変わらないときの対処法

もしもアイコンを設定したのに反映されないときは、次の方法で対処してください。

  • Windows:CtrlとF5を同時に押す
  • Macintosh:CmdとF5を同時に押す

するとブラウザが最初から読み込み直されます。

アイコンの変更が反映されないのは、ブラウザに一時的に保存されている古い情報がジャマしていて、新しい情報を反映しないことで起こるからなんです。

それをさっきの方法を使えば、強制的に新しい情報を読み込み直して、アイコンの変更が反映されますので試してくださいね。

ブログのアイコンを変えると良いことありますよ

2019年にグーグルが検索結果にアイコンを表示する変更をしたと発表しています。

それに伴って、はてなブログはグーグルのガイドラインに準拠するようにアイコンの仕様を変更してくださっていますので、ぴっぴはアイコンを変えた方がいいと思います。

その理由は3つあります。

  • 検索結果から見つけてもらいやすくなる
  • ブランドイメージを作れる
  • 覚えてもらいやすくなる

なので、ブログのアイコンを設定した方がいいですよ。 

まとめ:はてなブログのアイコンの設定は簡単ですよ!

今回は、はてなブログのアイコンの設定の仕方を書きとどめました。

これからはてなブログを始める方に参考にしてもらえると嬉しいです!

ぴっぴにもできるくらいアイコンの設定は簡単でした。

なので、ぜひアイコンの設定に挑戦してみてくださいね。

今回は、これでおしまいにします。

ありがとうございました。

 

✔よく読まれています

ぴっぴのはてなブログでアフィリエイト

トップに戻るボタンです