wp_headが原因？WordPressのトップに空白ができた時の解決法！

WordPressのトップに謎の空白ができてしまいました。

同じ原因で悩んでいる人の参考になるように、空白を解消するための解決法をお伝えします。

トップの空白は「wp_head();」が原因？

空白ができている部分のソースを確認すると、

html {
margin-top: 28px !important;
}

* html body {
margin-top: 28px !important;
}

とマージンが設定されていました。

こんなCSSを設定した覚えはないですが、「wp_head();」を付け加えることで、自動で読み込まれていることが分かりました。

バージョン3.1から導入された管理メニューバーの仕様の一つ

WordPressにログインした状態で、サイトを見ると上に管理メニューバーが表示されます。どうやら、そのメニューバーのための空白のようです。

トップの空白を解消するための解決法は？

空白を解消するための解決法ですが、

の3通りの方法があります。

【解決法.1】WordPressの管理画面からツールバーを非表示にする

まずは管理画面にログインしてください。

↓ログインできたら「ユーザー」⇒「あなたのプロフィール」をクリックしてください。

↓「プロフィール」画面が開きますので「ツールバー」の項目の「サイトを見るときにツールバーを表示する」のチェックを外してください。

↓チェックを外したら「プロフィールを更新」をクリックしてください。

これで、空白は消えているはずです。

ですが上記の方法だと、WordPressのユーザーを作成するたびにチェックを外す必要があります。

面倒ですし対応を忘れてしまう可能性もあります。

そこでオススメすすめするのが次の方法です。

【解決法.2】「functions.php」にツールバーを非表示にするコードを追記する

テーマ内にある「functions.php」に以下のコードを追記してください(一番下で問題ありません)。

add_filter( 'show_admin_bar', '__return_false' );

これで、どのユーザーでログインしても、空白は消えているはずです。

【解決法.3】「wp_head();」の上にコードを追記する

「functions.php」を触らずとも、コードを一文追記するだけで空白を消すこともできます。

↓「wp_head();」の上に以下のコードを追記してください。「wp_head();」は「header.php」に記載されているはずです。

<?php
if(has_action('wp_head', '_admin_bar_bump_cb' )) remove_action('wp_head', '_admin_bar_bump_cb');
wp_head();
?>

最後に

WordPressのバージョンアップが原因で、表示に不具合が出るのはよくあることです。

不具合が起こった時は、同じ悩みを持っている人の情報を探し出し、慌てずに冷静に対処してください。

以上「wp_headが原因？WordPressのトップに空白ができた時の解決法！」でした！

それではまた。