オンライン健康相談、gooドクター

WordPressでテーマを自作しているのですが、ヘッダー上部に余白ができてしまいます。
調べてみると、多くの場合は
http://hello-design-world.com/2011/04/wordpress3 …
のように管理バー関連の設定に問題があったようなのですが、私の場合は管理バーの表示を外しても直りません。

以下のようなソースでやっているのですが、何が原因かわかる方いたら教えてください!
※まだ作成途中なので、ファイルは以下の2つだけです。

----------------------php---------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
<html xmlns="http://www.w3.org/TR/xhtml/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>;charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?></title>

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />

</head>
<body>


<!-- コンテナ -->
<div id="container">


<!-- ヘッダー -->
<div id="header">
<h1><a href="<?php echo home_url(); ?>">
<?php bloginfo('name'); ?></a></h1>
<p id="desc"><?php bloginfo('description'); ?></p>
</div>
<!--ヘッダー終わり -->


<!-- コンテンツ -->
<div id="content">
<?php if(have_posts()): while(have_posts()):
the_post(); ?>

<div class="post">
<h2><a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>

<p class="postinfo">
<?php echo get_the_date(); ?> <?php the_time(); ?>
|
カテゴリー:<?php the_category(', '); ?>
</p>

<?php the_content(); ?>

</div>


<?php endwhile; endif; ?>
</div>



</div>


</body>
</html>



----------------------css---------------------
/*
Theme Name: Testtheme
Theme URI:
Description: テストテーマ
*/


/* コンテナ */
div#container {
width: 1000px;
margin-right: auto;
margin-left: auto;
}



/* ヘッダー */
div#header{background-image: url(header.jpg);
margin-top: 0px;
margin-left: 0px;
margin-bottom: 20px}

div#header h1{font-size: 1.875em;
font-weight: bolder;
padding: 10px 0px 0px 10px;
margin-top: 0px}

div#header h1 a{text-decoration: none;
color: #ff8c00}

div#header p#desc{font-size: 1em;
color: #ffffff;
font-weight: bolder;
padding: 0px 0px 10px 10px}


/* 記事 */
div.post {padding: 15px;
margin-bottom: 30px}

div.post h2{background-color: #1e90ff;
font-size: 1.3em;
padding: 10px;
margin: 0}

div.post h2 a{text-decoration: none;
color: #ffffff}

div.post p{font-size: 0.875em;
line-height: 1.6;
margin-top: 10px}

p.postinfo{color: #0c8bcd;
text-align: right;
margin: 20px 0 0;
clear: both}

p.postinfo a{color: #0c8bcd}

gooドクター

A 回答 (3件)

初期値のリセットCSSを忘れてるのでは?



html,body{ margin:0; padding:0;}
    • good
    • 2
この回答へのお礼

ありがとうございます!
その通りでした!!

お礼日時:2012/06/28 22:12

あ、失礼しました。



管理バーのことはご存知でしたね・・・。
#wpadminbar{
display:none;
}

で管理バーのところが消せると思います。
    • good
    • 0
この回答へのお礼

いろいろ親切にありがとうございました!

お礼日時:2012/06/28 22:12

どうも。


おはようございます。


貼ってもらったソースはindex.phpなのでしょうか?
category.phpやsingle.phpなどでも同じようなことが言えるのですが、必ずWordPressにはwp_head()とwp_footer()を入れないといけません。

> ヘッダー上部に余白ができてしまいます。
ログイン状態であなたのサイトを見たらおそらくあいているのでしょう。
表側(ログインしていない私側)は余白はついていないように思えます。
これは、上部にWordPress側でCSSが読み込まれてはいて、管理バーの高さ分高さが取られているのですが、
肝心の管理バーが上に出ていないのではないかなと思います。

管理バーを出すにはwp_footer()を記述しないといけません。


■wp_head()の入れるところ
<head>内に記述します

~略~
<head>
<?php wp_head(); ?>
</head>
~略~


■wp_footer()の入れるところ
</body>手前に記述します
<?php wp_footer(); ?>
</body>
</html>

■上記に関する記事
http://begi.net/blog/20100114/148
http://eienmukyu.com/2012/04/wphead-wordpress-th …
http://wpdocs.sourceforge.jp/%E9%96%A2%E6%95%B0% …
http://eienmukyu.com/2012/04/wphead-wordpress-th …
http://ja.forums.wordpress.org/topic/562
    • good
    • 1

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング