バズ部

  • icon株式会社ルーシー
  • 東京都港区新橋5-10-5 PMO新橋II 8階
  • 記事を探す
    • まず見て頂きたいページ
      • バズ部式マーケティングの進め方
      • コンテンツマーケティング101
      • SEO初心者向けマニュアル
      • バズ部メンバーの知見集
      • WordPress初心者向けガイド
    • 記事
      • 全ての記事を見る
      • SEO
        • SEOの基礎
        • SEO内部対策
        • コンテンツSEO
        • サーチコンソール
        • 高度なSEO
      • コンテンツマーケティング
        • 1.コンテンツマーケティングとは?
        • 2.コンテンツマーケティングをやるべきなのか
        • 3.あなたのブランドストーリーは何か?
        • 4.コンテンツマーケティング設計が全てだ
        • 5.必ず必要な社内体制と体制づくり
        • 6.まずは、小さな一歩を大切にしよう
        • 7.コンテンツ制作のコツを知ろう
        • 8.多くの人が陥る失敗を知っておこう
        • 9.顧客が「まだ気づいていないこと」に気づけるか
        • 10.素早く着実にコンバージョンにつなげよう
        • 11.正しく効果測定して成果を引き上げよう
        • 12.精度を上げてもっともっと成果を飛躍させよう
      • オウンドメディア
      • WordPress
        • wordpressウィジェット
        • wordpressテーマ
        • wordpressプラグイン
        • wordpressの基本操作
        • wordpressの導入と準備
        • wordpressの設定方法
        • ブログマーケティング
      • ソーシャルメディア
        • Facebook
      • ランディングページ
        • キャッチコピー
        • コピーライティング
      • メルマガ
      • EC
      • インタビュー
      • アーカイブ
    • 監修者/ライター一覧
      • 松澤 大輔
      • 木村 竜児
      • 野口 陽司
  • サービス一覧
    • サービスページ
      • コンテンツマーケティング立ち上げ&運用支援
      • SEO記事制作代行
      • キーワード設計代行
      • WEBサイト制作
      • 研修サービス
      • bazubu-shiki
      • ライティングツール「Pencii」
    • 資料請求
      • コンテンツマーケティング立ち上げ&運用支援サービス資料
      • SEO記事制作代行サービス資料
      • キーワード設計代行サービス資料
      • バズ部紹介資料
  • 支援実績
  • お役立ち資料
    • お役立ち資料一覧
      • 広告費を1/10にして売上を倍増させる全手法
      • バズ部が運営する月間20万PV超サイト11の生データ集
      • 良質なコンテンツを作成するための20のコツ
      • 最高のオウンドメディア支援会社を選ぶために行うべき7つの質問
      • バズ部紹介資料
      • バズ部公式メールマガジン
  • セミナー
  • 運営者情報

ご相談・お問い合わせ

© Copyright 2022 バズ部. All rights reserved.

ユーザーに届ける価値を徹底的に追求する
マーケティングを提供します

© Copyright 2022 バズ部. All rights reserved.

icon icon

icon
  • icon
  • icon
  • icon

05/22木8:00〜9:00

【5/22開催】バズ部の記事制作代行 商品説明会

  • オンライン
    1. バズ部 /
    2. WordPress /
    3. wordpress プラグイン /
    4. RealFaviconGeneratorでWordPressにファビコンを設定する方法
  • 最終更新日 2016.09.12

RealFaviconGeneratorでWordPressにファビコンを設定する方法

ファビコンとは、サイトにアクセスすると下図のようにブラウザ上に表示されるアイコン画像のことだ。ファビコンがあると、ないものに比べて目に留まりやすい。また、どの大手企業サイトにもファビコンがあるように、信頼性の高いサイトという印象をユーザーに与える。

ここでは「Favicon by RealFaviconGenerator」というプラグインを使ったファビコン設定を紹介する。このプラグインは、従来のファビコン設定の手間を省き、さらに iPhone や Windows 8 のアイコン画像まで設定できる。

プラグインの画面はすべて英語だが、図の通りに進めるだけで設定できるので安心してほしい。

また FTP ソフトを使用して手動でファビコンを設置する方法もあるが、初心者の方もすぐに設置できる方法を解説するため、ここでは割愛する。

注1:プラグインを初めてインストールする場合
インストール方法は、『WordPress プラグインのインストールと停止・削除・更新の方法』を参考にしよう。
注2:バックアップを取るかローカル環境でテストしよう
新しいプラグインをインストールすると、ごく稀に、不具合が発生する可能性がある。そんな時に、すぐに復元できるようにプラグインを操作する時は、「WordPress のバックアップ」を取っておくか、「ローカル環境でテスト」するようにしよう。

また、私たちバズ部は12年で400社以上のメディア支援を行い、

  • 立ち上げから10ヶ月で14.6億円の売上を産んだ不動産メディア
  • 8ヶ月で月間140万PVを実現したアプリメディア

など大きな成果を挙げ続けている。

各サイトの成功要因をインタビューしているので、
あなたのサイトに役立てて欲しい
⇒25サイトの成功事例インタビューはこちら

ebook
ebook

目次

  • 1.ファビコン画像を用意する
  • 2.ファビコン画像を設定する
  • 3.ファビコン画像を調整する
    • 3−1.Compression(画像を圧縮する)
    • 3−2.Scaling algorithm(画像のパターンを選択する)
    • 3−3.その他の設定方法
  • 4.ファビコンを自動生成する

1.ファビコン画像を用意する

ファビコンの表示は冒頭で紹介したようにブラウザ上に縮小されて表示される。文字や細かいイラストだと表示がつぶれてしまうので、ブログのイメージに合わせたシンプルなイラスト画像を用意しておこう。

また画像サイズはプラグインが推奨する 260 × 260 ピクセル以上の正方形にしよう。そうするとことで後述する iPhone のアプリ画像と Windows 8 のスタート画面用の画像にも反映される。

ここで気をつけるべきは、画像ファイルは PNG か GIF を用意しよう。通常は、ファビコン専用の画像(ファイルの種類:ico)を用意する必要があるのだが、「Favicon by RealFaviconGenerator」はそれを自動生成してくれる。

成功したオウンドメディアの要因を学ぶ

  • Article Image 1Article Image 1

    累計106億円の売上を叩き出した不動産会社のコンテンツマーケティング事例

    1

  • Article Image 2Article Image 2

    わずか8ヶ月で月間140万PVを実現したアプリ企業メディア成功事例

    2

  • Article Image 3Article Image 3

    問い合わせが月4,400件以上!自社メディアで驚異的なCV数を生み出した弁護士事務所

    3


2.ファビコン画像を設定する

次に WordPress 管理画面の左メニューにある「外観」にカーソルをあてると「 Favicon」が追加されているのでクリックしよう。するとファビコン画像の設定画面が表示されるので「Select from the Media Library(画像をライブラリから選択する)」をクリックする。

ボタン下の注記には、画像サイズが 260 × 260 ピクセル以上を推奨していることが記載されている。

下図のメディアライブラリ画面が表示されたら用意したファビコン画像をアップロードする。そして画面右下にある「選択」をクリックする。

画像のパスが下図のように自動で入力されたら「Generate favicon(ファビコンを自動生成する)」をクリックしよう。

※ ファビコン専用の画像(拡張子 ico)は利用できない。png、または gif を使おう。

次の画面が表示されたらファビコンの自動生成の準備が始まるのでしばらく待つ。

下図のファビコン編集画面が表示されるので設定する。


3.ファビコン画像を調整する

この画面上でファビコン画像のパターンが選べたり、ファイルサイズが圧縮できる。すべてを細かく設定する必要はないので内容を絞って解説する。

3−1.Compression(画像を圧縮する)

ここではファビコンの画像サイズの圧縮設定を行う。最近のネット環境で数キロバイト程度のデータ転送量を節約する必要はないので、デフォルトのままで問題ない。

どうしても圧縮が必要なら” Expected compression rate: ◯% “のパーセントの数値を見ながら選択しよう。数値が多い程、圧縮率が高くなる。

3−2.Scaling algorithm(画像のパターンを選択する)

” Scaling algorithm “とは画像の拡大・縮小の表現方法という意味があるが、“ドット絵”という言葉の方がなじみがあるだろう。デフォルトのままをおススメするが、ここでは実際のプレビュー画像も見れるので、あまり難しく考えずに掲載したいファビコン画像を選ぶと良い。

その他はファビコン以外の設定になるので、興味がある方は目を通しておこう。

3−3.その他の設定方法

Favicon by RealFaviconGenerator ではファビコン画像を利用して、iPhone のアプリ画像とWindows 8 のスタート画面にピン留めする画像まで設定することができる。

まず” App name “では、iPohone や Windows 8 の PC 上でショートカットを保存する時の名前をブラウザのタイトルのままにするか、別の名前を設定するかが選べる。サイトタイトルが長いようなら短い名前を用意しておくと親切だ。

続いて画面上部の” Favicon for iOS “では、アプリ画像の拡大・縮小や背景色を設定することができる。画面左のプレビューを見ながら調整しよう。選択項目の一番下にある” Use a dedicated picture “とは、アプリ専用のオリジナル画像を設定したい時に使う。

次に” Favicon for Windows 8 “では、タイル画像の見映えが調整できる。左にあるプレビュー画面を見ながら調整してみよう。選択項目の一番下にある” Use a dedicated picture “とは、Windows 8 専用のオリジナル画像を設定したい時に使う。

サイトがピン留めできないときの対処法
Internet Explorer でサイトをスタート画面にピン留めできない場合、Internet Explorer が既存のブラウザに設定されていないのが原因だ。詳しくはマイクロソフトの公式にサイトにある「Internet Explorer を既定のブラウザーにする方法」を読んで設定しよう。

4.ファビコンを自動生成する

設定が完了したら「Generate you Favicons and HTML code(ファビコンを自動生成する)」ボタンをクリックする。

しばらくすると下図の画面に変わり、「Favicon installed!」と表示されたらファビコンの生成は完了だ。

画面中央に「Check you favicon」というボタンがあるが、iOS と Windows 8 に関する画像表示が問題ないかをチェックしたい方はこのツールを活用しよう。

以上がファビコンの設定方法だ。

カテゴリー wordpress プラグイン

記事をシェアする

  • B!

無料eBook:バズ部式マーケティング
広告費を1/10にして売上を倍増させる全手法

広告に頼り切ったマーケティングの打開策としてコンテンツマーケティングについて調べているけれど、よく分からないと悩んでいませんか?

本書は弊社やクライアント様がコンテンツマーケティングに取り組み

  • ・SEOのみで月間100万PV集めた方法
  • ・平均6.92%のコンバージョン率が出た新規顧客獲得法
  • ・CPLやCPAを大幅に改善した方法とそのからくり

など、コンテンツマーケティングの効果と、具体的な施策内容を全94ページに渡って詳細に解説しているものです。

ぜひ、貴社のWEBマーケティングにもご活用ください。

eBookをダウンロード

未読

参考にしていただきたい事例

liskulのtopページ

リスティング広告

1年でプッシュ型営業からプル型へ!毎月約200件の問い合わせを獲得するデジタルマーケティングブログ

  • SOLDOUT
  • ソウルドアウト株式会社様

学校 コンテンツマーケティング

学校・教育

1年半で億単位の貢献を果たすまでに成長した学校法人のコンテンツマーケティング事例

  • 神田外語学院
  • 神田外語学院 様
アバター
  • 著者 : バズ部編集部

ユーザーに届ける価値を徹底的に追及するのがバズ部式マーケティング。
バズ部では、ユーザー主義を貫きながら、なおかつ数字にこだわり結果を出してきた手法やノウハウを惜しみなく提供していきます。

  • 会社概要
  • 採用情報
  • セミナー
  • サービス紹介
  • 記事一覧

icon

株式会社ルーシー東京都港区新橋5-10-5 PMO新橋II 8階

ABOUT US

  • 運営者情報
  • セミナー
  • 採用情報
  • お問い合わせ
  • プライバシーポリシー
  • 特定商取引法に基づく表記
  • 紹介メディア

© Copyright 2025 バズ部. All rights reserved.