ファビコンを無料で作成&設置!faviconを設定してブログの差別化!
はいさーい!
沖縄セドリスタREDです!(`・ω・´)
【人気ブログランキング】
こちらからポチポチ応援よろしくお願いしますm(__)m
今回の記事では【ブログ差別化のためのファビコン作成・設置・設定方法】についてお話致します(‘◇’)ゞ
今回はファビコンの変更方法についてなんだけど、
iPhoneのホーム画面に追加されるアイコンを
変更したい場合はコチラを確認してくださいね。
→【iPhone IOS】Safariで「ホーム画面に追加」されるアイコンを変更する方法!
1:ファビコンとは?
まずファビコンとはずばりコレのコト。
↓ ↓ ↓ ↓ ↓
タブのトコに表示されるアイコンのコトです。
Favorite Icon→favicon(ファビコン)というワケです。
これは簡単に設定できるのでさっさと設定してしまいましょう。
2:ファビコン設置の手順
手順としては・・
1-Faviconで使用したい画像を用意
2-できあがった.ico形式のファイルをワードプレス内のメディアのトコにアップして、
URLをコピペしてメモなどに残しておく
3-【header.php】の該当箇所をコピペしておいたURLに書き換え、再読み込みをして確認。
こんな感じ!
あっという間に終わっちゃいます(^-^;
1-Faviconで使用したい画像を用意
自分はココでfavicon用の画像を作りました。
⇒ http://ao-system.net/alphaicon/index.php
注意書きなどが下の方に書かれているので、それも読んでみてくださいね。
2-できあがった.ico形式のファイルをワードプレス内のメディアのトコにアップして、
URLをコピペしてメモなどに残しておく
「メディアのトコにアップ」で通じる・・よね?(´・ω・`)
念のために説明すると、ワードプレス管理画面の左側にある【メディア】の項目のコト。
【メディア】⇒【新規追加】で画像ファイルをアップできるので、
そこにアップして、画像のURLをメモ帳などにコピペして残しておいてください。
3-【header.php】の該当箇所をコピペしておいたURLに書き換え、再読み込みをして確認。
ブログ初心者にとってはちょっと難しいコトを今からやりますが、簡単と言えば簡単です。
しかし!
簡単な作業とはいえ、htmlの記述のバックアップをとって作業するというクセは普段からつけておいてください!
調子に乗ってバックアップを取らずに作業していたら、ブログ自体がぶっ飛んでしまうコトだってありますからね・・。
【外観】⇒【テーマの編集】の中にある【ヘッダー(header.php)】をクリックすると、header.phpの中身が表示されます。
この真ん中のトコに書かれているゴチャゴチャしている文字の一部を書き換えます。
何度も言いますが、簡単な作業であってもミスってしまった時のために、
この記述を全選択してメモ帳などにコピペして残しておいてください。
で、実際に書き換えるのは真ん中あたりにあるココ。(クリックで拡大します)
【shortcut icon】とか【apple-touch-icon】を目印にしたら見つかるかと。
または、header.phpの中身が表示された状態で【Ctrl】+【F】を押すと画面の右上に検索窓が出て来るので、そこに【shortcut icon】と入力して確定すると、一発で該当箇所に色がついて見つけるコトができます。
( ・・こっちが早いか(´・ω・) )
該当箇所を見つけたら、
<link rel=”shortcut icon” href=”画像のURL” />
こんな感じで先ほどコピペして残しておいた画像のURLに書き換えて、
【ファイルを更新】ボタンを押して更新します。
あとは再読み込みして、きちんと表示されるかを確認します。
3:ファビコン作成・設置・設定方法についてのまとめ
長々と書いてしまいましたが、ぶっちゃけてしまうとhtmlの知識を持っている方からしたら10分ぐらいでは終わる作業です(^-^;
自分の場合は何もわからない時にネットで調べながらだったからめちゃくちゃ時間かかったけどね。
最後にもう一度言うけど、htmlを書き換えたりする時は絶対にバックアップをとってからにしてくださいね。
なにかの拍子でミスった時、バックアップがあれば元の状態に戻すコトができるので。
あっ、ちなみに以前の記事で【ブログの更新頻度とアクセス数】について書いているけど、もう読んでくれてるかな??
↓ ↓ ↓ ↓ ↓