AIで爆速作成した静的LPをWordPress配下に設置した際、指定したファビコンが表示されず、なぜか「WPデフォルトロゴ」に化ける現象が発生。
画像直URLでは表示されるのにページ上だけ反映されない原因は、手動追記したたった1個の「全角スペース」でした。
本記事では、WPのファビコン設定（テーマと一般設定）の仕様の落とし穴から、<head>内の全角文字が引き起こすパースエラーの構造まで実体験ベースで解説します。
WordPress配下の静的LPでファビコンがWPロゴに化ける沼
LP制作もコーディングもすべてAI任せ、爆速で完成した静的ページ。
「AI凄すぎ、生産性上がりすぎ！」と感動しながら、最後の仕上げとして手動でコメントとmetaタグをほんの1行追加しました。
これが、その後に訪れる「4時間の泥沼」の引き金になるとも知らずに——。
指定したブランドロゴが出ず「WPデフォルト」が表示される現象
WordPress配下の物理フォルダに設置した静的HTML（/lp/001/ と /lp/002/）。
AIが吐き出した完璧なコードをベースにしたはずなのに、なぜか挙動が分かれました。
- /lp/001/ ➔ 指定したLP固有のブランドロゴが綺麗に表示される
- /lp/002/ ➔ ブランドロゴが出ず、WordPressデフォルトのロゴ（Wのマーク）を見に行ってしまう
スマホで画像直URL（…/002/favicon.png）を叩くと、画像は100%正常に開きます。
コードも画像も完全同一。パーミッションもFTP階層も問題なし。
直URLなら映るのに、ページ上だけ表示されない不可解すぎる挙動に頭を抱えました。
寄り道：テーマ設定とWP一般設定のファビコン仕様の違い
002のページで「なぜかWPデフォルトのファビコンが表示されてしまう」現象にハマっていた際、ふとWordPress自体のファビコン設定の仕様に気づくことになります。
もともと当サイトでは、テーマオプション側でファビコンを設定していました。
しかし、それだとWebサイトの表側だけで、管理画面はWordPressデフォルトのロゴのままだったのです。
今回、WPの「設定 > 一般（サイトアイコン）」からファビコンを指定できることがわかり、試しに設定してみたところ、002のページにもとりあえず会社全体の「コーポレートロゴ」が表示されるようになりました。
しかし、これは根本的な解決ではありません。
今回表示させたいのはWP全体のコーポレートロゴではなく、あくまで002のLP固有の「ブランドロゴ」だからです。
真犯人は手動追加した「1個の全角スペース」
なぜ002だけ、指定したブランドロゴが無視されてWP側のフォールバック（一般設定やWPデフォルト）が働いてしまうのか。
原因を1行ずつ泥臭く検証していった結果、判明した真犯人はAIの出力結果ではなく、仕上げに自分自身が手動追加したあの1行でした。
<!– 自分が手動で追記したコード –> <meta name=”robots” content=”noindex, nofollow”> <!– 本番公開の際に削除！ –>
コメントの直前に、目に見えない全角スペースが1個紛れ込んでいたのです。
<head> 内の全角文字がブラウザに「<body> 開始」と誤認させる
HTMLの <head> 内に全角スペース等の全角文字が剥き出しで存在すると、ブラウザ（特にSafariやChrome）のHTMLパサーは自動補正機能によって「ここでヘッダー終了・本文（<body>）開始」と判定してしまうようです。
その結果、直下に記述していた <link rel=”icon”> タグがヘッダー情報として認識されず読み飛ばされ、ブラウザは「この静的ページにはファビコン指定がない」と判断し、親階層にあるWordPress本体のファビコンを拾いに行っていたのが現象のカラクリでした。
iOS Safariの強力な粘着キャッシュを打ち破る「?v=1」
さらに悪夢だったのは、検証途中にiPhone（iOS Safari）がシステム奥深くに「002のURL＝WPロゴ」という強烈な粘着キャッシュを記憶してしまったことです。
全角スペースを取り除いた後もアイコンが変わらず、最終的に以下のようにクエリパラメータを付与して強制上書きすることで、ようやく本来のブランドロゴを表示させることができました。
WP配下の静的LPに「固有ファビコン」を強制適用する完全解決策
全角スペースの罠を抜けた後、さらなる「WordPressが動いているドメインのサブディレクトリ（例: [https://example.com/lp/001/](https://example.com/lp/001/) ）に静的HTMLを設置した際、LP固有のファビコンがWP本体のロゴに上書きされてしまう」という問題に直面した場合の、解決手順を追記します。
原因：PCブラウザの「/favicon.ico」自動フォールバック仕様
PCブラウザには「HTML内にPC向けの明示的なファビコン指定がない場合、自動的にドメイン直下の /favicon.ico を探しに行く」という強力な仕様があるみたいです。
そのため、スマホ用PNG画像（apple-touch-icon）だけを指定していると、PCブラウザはWordPress本体のWPロゴを勝手に拾ってしまいます。
解決手順：.icoと.pngの2枚指定＋「sizes=”any”」で遮断
元となる512x512pxのPNG画像から、無料の変換ツール等を使ってPC用の .ico ファイル（256pxなどで可）を作成し、LPフォルダ内に両方アップロードします。
その後、各LPの <head> 最上部（meta charset 直後）に以下の2行を記述します。
<head>
<meta charset=”UTF-8″>
<!– PC用：ドメイン直下のWPロゴ(/favicon.ico)の割り込みを遮断 –>
<link rel=”icon” href=”https://example.com/lp/001/favicon.ico” sizes=”any” />
<!– iOS / スマホ用 –>
<link rel=”apple-touch-icon” href=”https://example.com/lp/001/favicon.png” />
</head>
※ URL部分はご自身の環境の絶対パスに書き換えてください。
ここで重要なのが sizes=”any” を記述することです。
これにより、ブラウザに対して「この .ico 1本で全サイズ対応可能」と伝えることができ、ドメイン直下のWPロゴを読みに行く挙動を完全に遮断できます。
まとめ：AIで生産性を上げるなら手動の1行こそ疑え
AIのおかげでLP制作もコーディングも数分で終わり、間違いなく生産性は爆上がりしていました。
しかし、最後の最後に「仕上げの微調整くらい自分でやった方が早い」と差し込んだ些細な追加が致命的なエラーを引き起こし、結果として2時間近くこのファビコン沼にどっぷりハマることに。
AIが爆上げしてくれたはずの生産性は、たった1文字の全角スペースによって見事に「だだ下がり」しました。
「AIのコードを疑う前に、自分が途中で挟んだ手動の1行を疑え」——あまりにも苦く、そして教訓に満ちた4時間となりました。
当然、Geminiに聞きながらの対応なんですが、そのGeminiも視野狭窄で、細かいコードの部分の修正を繰り広げ、ムダなやり取りをさせられたんですよ。AIを盲信するのは危険です！
このブランドロゴのLP（lp/001）は、以下のボタンから確認できます。
AIで作った「映像」と「本」の連動企画、以下のランディングページ（LP）からYoutubeチャンネルへも飛べるようになってます。
これ、LPもYoutubeの動画も、全部AIが綺麗に作った、単なるハリボテです……
この記事を書いた人
【免責事項】
山口亨（中小企業診断士） UTAGE総研株式会社 代表取締役
公的支援機関を中心に、長年にわたり中小企業支援に携わる経営コンサルタント。
代表著作に「ガンダムに学ぶ経営学」「ドラクエができれば経営がわかる」がある。
（@susumu_utage）
：ほぼ毎日定期ポスト配信中。朝のニュース解説は必見！
