WordPressのトップに謎の空白ができてしまいました。
同じ原因で悩んでいる人の参考になるように、空白を解消するための解決法をお伝えします。
トップの空白は「wp_head();」が原因？
空白ができている部分のソースを確認すると、
html {
margin-top: 28px !important;
}
* html body {
margin-top: 28px !important;
}
とマージンが設定されていました。
こんなCSSを設定した覚えはないですが、「wp_head();」を付け加えることで、自動で読み込まれていることが分かりました。
バージョン3.1から導入された管理メニューバーの仕様の一つ
WordPressにログインした状態で、サイトを見ると上に管理メニューバーが表示されます。どうやら、そのメニューバーのための空白のようです。
トップの空白を解消するための解決法は？
空白を解消するための解決法ですが、
- WordPressの管理画面からツールバーを非表示にする
- 「functions.php」にツールバーを非表示にするコードを追記する
- 「wp_head();」の上にコードを追記する
の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のトップに空白ができた時の解決法！」でした！
それではまた。
コメント