web-dev-qa-db-ja.com

Webサイト全体に単一のファビコンを設定する

現在、このコードを使用してWebサイトにファビコンを追加しています。

<link rel="shortcut icon" href="https://www.mysite.co.uk/images/favicon/favicon1.ico" />

ただし、このコードは各HTMLページに追加する必要があります。グローバルファビコンを設定する方法を知っている人はいますか？

どこを見ても、各ページに追加する必要があると言われています。

更新：

Chromeは、ルートディレクトリでfavicon.icoファイルを検索します。

Firefoxは各ページでこれを必要とします：

<link rel="icon" type="image/png" href="/favicon.png" />
htmlfavicon
14
Switchfire

今後の参照のために、phpを使用して、各ページで一貫性を保つヘッダー情報（ファビコンを含む）を含めて、多数のファイルではなく1つのファイルを編集するだけで済むようにします。

使用する <?include "header.php" ?>header.phpにすべてのページに共通のすべてのコードが含まれているすべてのページ

次のようになります。

<link rel="stylesheet" href="screen.css" type="text/css" media="screen" />
<script src="../quirksmode.js"></script>
<link rel="icon" href="/favicon.ico" type="image/x-icon" />

およびすべてのページに含める必要がある他のすべてのコード

インクルードの詳細については、こちらをご覧ください： http://php.net/manual/en/function.include.php

編集：今のところ、notepad ++などのエディターですべてのファイルを開き、検索と置換を実行して、すべての出現箇所を\ r\nに置き換えることができます。ここで、\ r\nは拡張検索モードのウィンドウの改行文字です。 Notepad ++には、開いているすべてのファイルを検索して置換するオプションがあります。

22
Rishi Dua

いいえ、すべてのページに<link rel="shortcut icon">要素を含める必要があります。ただし、次のことができます。

  • Favicon.icoファイルをプロジェクトのルートに配置し、それを/favicon.icoと呼びます。

私の知る限り、キャッシュされるので、再ダウンロードの問題はありません。

3
Madara Uchiha

最近のほとんどのブラウザでは、favicon.icoファイルをWebサイトのルートに配置するだけで、すべてのページでキャッシュされて機能します。

1
user2675678

ほとんどのブラウザは、Webサイトで/favicon.icoを検索します。通常はキャッシュされ、1つのディレクトリからWebサイト全体で機能します。

1
Albzi

私が行ったのは、DOMを介してリンク要素を作成し、属性を追加するスクリプトファイルを作成することでした。このコードをJavaScriptファイルで使用し、HTMLファイルにリンクします（これはマークダウンでも機能することに注意してください）

window.onload = function() {
  var link = top.document.createElement("link");
  link.type = "image/x-icon";
  link.rel = "shortcut icon";
  link.href = "./Australian_Kangaroo.ico";
  top.document.getElementsByTagName("head")[0].appendChild(link);
}

HTMLでは、scriptタグを介してリンクする必要があります

<script src = "script.js"></script>

リンクタグに対するこれの利点は、他の関数が含まれているファイルにこのJavaScriptを追加できるため、作業が少なくなることです。

0
Marvin

「favicon.ico」という名前のWebサイトのルートにファビコンを配置します。

（ルートディレクトリにある）別の形式のアイコンを使用する場合は、htaccess（または同等のもの）を使用して「.ico」ファイルのmimeタイプを「.png」に設定し、「favicon.png」の名前を「favicon」に変更できます。 .ico」。

Htaccessファイルに次のコードを追加します。

AddType image/png .ico
0
Rob Farr