STINGER5でファビコンを設定する方法 プラグインを使わない
ワードプレスで当サイトを作った際に
使用されていただいたテンプレートは
こちらのサイトで配布されています。
STINGER5 というテーマです。
このSTINGER シリーズは3から私も利用されていただいて
非常に使いやすく、検索エンジンにも強いワードプレスのテーマなのですが、
一つ気になっていたのが、
この部分!
いわゆる ファビコン という
サイトのロゴマーク的な部分です。
楽天 や amazon でいうならこれです。
このファビコンが、STINGER の場合には、
制作者側で設定したロゴがすでに導入されているために、
他と差別化ができなく
やはりブックマークなどした際にも
このファビコンのアイコンですぐにサイトを判断できる
といったメリットもありますし
このファビコンを設定するだけで、
アクセスが伸びるという実際の検証結果もあるようですので、
今回、独自アイコンを設定してみることにしました。
ファビコンを作成する方法
まず、ファビコンの画像を作成します。
ファビコンは、16px×16px と非常に小さいアイコンですので、
一般的な画像作成ソフトを使っても良いのですが、
見え方などがぼやけてしまう場合もありますので、
今回はファビコンを作成できるサイトを利用して作成してみました。
作成方法は、サイトを見ればすぐにわかりますが、
カラーパレットで色を決めて、
あとはグリッドごとにクリックして
色を変更するだけです。
作成しましたら、右下の
completed の部分をクリックしますと
下図のように、作成したファビコンファイルと
ダウンロードする というボタンが出てきますので
クリックしますと、ダウンロードできます。
この時点で、右上のURLバーのところに
今作成したファビコンアイコンの表示されていますので
これを参考に一度ダウンロードした後でも
変更も可能ですので
納得がいくまで作成されてみてください。
STINGER5にファビコン設定する方法
ワードプレスにファビコンを設定するには、
プラグインを利用する方法もありますが、
極力余計なプラグインを入れない方が、
表示速度の遅れの防止にもなりますので、
今回はプラグインは使わない方法で行ってみます。
STINGER5で作成した当サイトのソースを見てみますと
以下の表記がありました。
(link rel=”shortcut icon” href=”http://siawase-no1.net/wp-content/themes/stinger5ver20141227/images/logo.ico” /)
つまり、この部分に現在表示されているファビコンが保存されているということです。
ですので、先ほど作成したファビコンの画像と
現在保存されている画像を上書きして入れ替えたいと思います。
そこでまず、先ほど作成したファビコン画像のネームが
favicon.ico
となっていますので、
そちらを
現在の設定に合わせて、
logo.ico
に名前を変更します。
次に、FFFTPなどのWEB上へアップロードできるソフトを使用して
ワードプレスが導入されているドメインから
wp-content ⇒ themes ⇒ stinger5ver20141227 ⇒ images
と開いていくと
imagesフォルダ内に、logo.ico
というアイコンの画像が入っていますので、
そこで、先ほど、リネームした
作成したファビコンのアイコンを上書きアップロードします
これで設定は終わりです。
設定を完了しましたら、
サイトをF5キーなどを使って更新すると
このように作ったアイコンにファビコンが変更されました。
まとめ
ファビコンはちょっとした設定ですが、
最初にも書かせていただいたように
こんな簡単な設定をするだけで、
サイトの印象度が上がり
アクセスアップにもつながるのであれば
やらない手はないと思いますので、
ご参考にされてみてください。
関連記事
-
-
forum.topic59805907.darodar.com はスパム?検索結果に表示
ワードプレスで当サイトを作り、 グーグルアナリティクスを設定したの …
-
-
youtube動画をリピート再生する方法?スマホAndroid iphoneも
youtubeの動画を見ていて 気に入った音楽をリピート再生したい …
-
-
Microsoft SilverlightがChromeで使えなくなった原因と対策
先日のChrome(クローム)のアップデート後(バージョン42)、 Micros …