wordpressでファビコンを設定する | 飯田市ホームページ制作デザインスタジオiR

スマホでの検索が増え、目立つところに表示されるファビコンはとても重要となりました。
ワードプレスで構築されたサイトでは、ファビコンにワードプレスのデフォルトの「W」のロゴマークが表示されてしまいます。
これでは手がかかってないように思われてしまいますし、ブランディングにも響きます。なるべくオリジナルのものに変更するようにオススメします。

スマホでのファビコン表示

検索一覧

ブックマーク一覧

ブックマークにも大きくファビコンが表示されます。

パソコンでのファビコン表示

タブ

画面上部の「タブ」と呼ばれるところに表示されます。

お気に入り一覧

ブックマークバーやお気に入り登録をすると、ホームページ名の前にファビコンが表示されます。

パソコンの検索一覧にもしっかりと表示されます

ファビコンを表示させるプラグイン「Favicon by RealFaviconGenerator」

WordPressサイトでファビコンを設置するにはプラグインを使用すると便利です。
WordPressはインストールしているけどほとんど動かしてないサイトや、TOPページだけのLPにもきちんと反映されました。
テンプレートによってはファビコンを設置する項目がデフォルトで装備されている場合もありますので確認してみてください。

Favicon by RealFaviconGenerator

プラグインをインストールし、有効にすると、外観のところに「Favicon」という項目が表示されますので用意したpng画像を適応してください。

htmlページには適応されません

当然ながら、htmlページには適応されません。
htmlページとWordpressを混合でサイトを構築している場合、htmlページには手動でソースを追加しなければなりません。

metaタグとしてhead内に記述します。

<link rel="shortcut icon" href="/favicon.ico"> 
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> 
<link rel="icon" type="image/png" href="/android-chrome-192x192.png">

まとめ

ワードプレスで構築したサイトのファビコンはプラグイン「Favicon by RealFaviconGenerator」を利用すると便利です
htmlで構築したサイトは手動でファビコンを設置しましょう。サイズもそれぞれのデバイスに合わせて用意する必要があります。

この記事の著者

飯田市でホームページ制作・広告運用をサポート｜デザインスタジオiR

牧内理恵

まきうちりえ

詳しいプロフィール

プロフィール

飯田市在住、広告制作歴20年以上。これまで200名以上のクライアント様と向き合い、100件以上のサイト制作を手掛けてきたデザイナー兼エンジニアの牧内理恵です。御社の強みを引き出し、業績アップに繋がるWebサイト・ネットショップ・販促ツールをご提案します。拠点とする長野県内はもちろん、全国各地からのご依頼にも柔軟に対応しております。

「相談してよかった」と言っていただける、飯田下伊那地域のパートナーとして。

長野県飯田市を拠点に、ホームページ制作やECサイト構築、Web運用のトラブル解決を承っています。20年以上のキャリアで培った「伝わるデザイン」と「確かな技術」で、御社の業績アップを支えます。飯田・下伊那エリアはもちろん、全国からのオンライン相談も大歓迎です。

「ホームページを作りたい」「ホームページをリニューアルしたい」といったご依頼もお気軽にお声がけください。

まずは無料で相談してみる飯田市周辺の制作実績を見る

※強引な勧誘は一切ありませんので、安心してお悩みをお聞かせください。