goodtimesさん、こんにちは。
できましたら、回り込みが発生している場合htmlが分かるとアドバイスしやすいです。
5階層未満と5階層以上の場合で、出力されるhtmlの違いは、リスト数と複数階層の表示になりますので、そのあたりが影響している可能性はあります。特に、cssを見た限り複数階層の表示は考慮していなさそうなので、どう表示されるか分かりません。
また、<ul id=”menus”>に呼応するがなさそうなので、追加しておいた方がhtmlの完全性を保てます。
jim912さん
こんにちは ご回答ありがとうございます
できましたら、回り込みが発生している場合htmlが分かるとアドバイスしやすいです。
htmlとは、これでよかったで・・すか?(すみません、よくわかってないもので・・)
回り込みが発生しているページを右クリック→ソースを表示し、コピペしてきたものです
※現在、日本語が化けてまして、(最後に調べて解決しようと思って保留してました)
ソース内コメントも一部文字化けしてます。
ヘッダー部分のみコメントを英語に変えたのですけど、もしコンテンツ部のコメントも英語になおしたほうがよければ、変えます。
※header.phpを少しだけ一回目の投稿のときより変更しています
回り込みが発生する箇所はかわっていません(日本語コメントがあるところが発生箇所です。実際のソースにはこのコメントはありません)
関係ないかもですけど、一応今回のheader.phpをhtmlのあとに載せておきます
html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ja">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>㈱テストテスト » あいうえおマネージャー</title>
<link rel="stylesheet" href="http://unisonet.ciao.jp/wp-content/themes/Cheese/style.css" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="㈱テストテスト RSS フィード" href="http://unisonet.ciao.jp/?feed=rss2" />
<link rel="alternate" type="application/atom+xml" title="㈱テストテスト Atom フィード" href="http://unisonet.ciao.jp/?feed=atom" />
<link rel="pingback" href="http://unisonet.ciao.jp/xmlrpc.php" />
<style type="text/css" media="screen">
#page { background: url("http://unisonet.ciao.jp/wp-content/themes/Cheese/images/kubrickbgwide.jpg") repeat-y top; border: none; }
</style>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://unisonet.ciao.jp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://unisonet.ciao.jp/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 2.6.5" />
</head>
<body>
<div id="page">
<!-- header START -->
<div id="header">
<div id="headerimg">
<h1><a href="http://unisonet.ciao.jp/">㈱テストテスト</a></h1>
<div class="description">Just another WordPress weblog</div>
</div>
<!-- navigation START -->
<div id="navigationbtn">
<ul id="menus">
<!-- get how deep the page is -->
<!-- change navibutton whenever its =over 5/the deepest -->
<li class="page_item page-item-24"><a href="http://unisonet.ciao.jp/?page_id=24" title="概要・導入メリット">概要・導入メリット</a></li>
<li class="page_item page-item-27"><a href="http://unisonet.ciao.jp/?page_id=27" title="機能一覧">機能一覧</a></li>
<li><a class="lastmenu" href="javascript:void(0);"></a></li>
</ul>
<div class="fixed"></div>
</div>
<!-- navigation END -->
<div class="fixed"></div>
</div>
<!-- header END -->
<hr />
<div id="content" class="narrowcolumn">
<div class="post" id="post-18">
<h2>あいうえおマネージャー</h2>
<div class="entry">
あいうえおマネージャー
</div>
</div>
<a href="http://unisonet.ciao.jp/wp-admin/page.php?action=edit&post=18" title="投稿の編集">この投稿を編集する。</a>
</div>
<div id="sidebar">
<ul>
<li>
<form method="get" id="searchform" action="http://unisonet.ciao.jp/">
<label class="hidden" for="s">検索:</label>
<div><input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="検索" />
</div>
</form>
</li>
<!-- Author information is disabled per default. Uncomment and fill in your details if you want to use it.
<li><h2>作成者</h2>
A little something about you, the author. Nothing lengthy, just an overview.
</li>
-->
<!-- �ڡ���ɽ����4���ؤޤ� -->
<!-- ���ڡ����κǾ��$ancestor����� -->
is page<li class="pagenav"><h2> </h2><ul><li class="page_item page-item-12 current_page_ancestor"><a href="http://unisonet.ciao.jp/?page_id=12" title="管理系ソフト">管理系ソフト</a>
<ul>
<li class="page_item page-item-14 current_page_ancestor"><a href="http://unisonet.ciao.jp/?page_id=14" title="貸出管理">貸出管理</a>
<ul>
<li class="page_item page-item-16 current_page_ancestor current_page_parent"><a href="http://unisonet.ciao.jp/?page_id=16" title="あいうえおマネージャー シリーズ">あいうえおマネージャー シリーズ</a>
<ul>
<li class="page_item page-item-18 current_page_item"><a href="http://unisonet.ciao.jp/?page_id=18" title="あいうえおマネージャー">あいうえおマネージャー</a></li>
<li class="page_item page-item-21"><a href="http://unisonet.ciao.jp/?page_id=21" title="あいうえおマネージャーlight">あいうえおマネージャーlight</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul></li>
<!-- ������������ɽ��
<li><h2>アーカイブ</h2>
<ul>
<li><a href='http://unisonet.ciao.jp/?m=200901' title='2009 年 1 月'>2009 年 1 月</a></li>
</ul>
</li>
-->
<!-- ��ƥڡ����ϥ��ƥ���ɽ��ʬ��//is_home����ƥڡ�����ʬ��� -->
<!-- omajinai -->
<!-- �֥�������ɽ����//��å���ܡ��ɤǺ�����������ɽ��
<li id="linkcat-2" class="linkcat"><h2>ブログロール</h2>
<ul class='xoxo blogroll'>
<li><a href="http://wordpress.org/development/">Development Blog</a></li>
<li><a href="http://codex.wordpress.org/">Documentation</a></li>
<li><a href="http://wordpress.org/extend/plugins/">Plugins</a></li>
<li><a href="http://wordpress.org/extend/ideas/">Suggest Ideas</a></li>
<li><a href="http://wordpress.org/support/">Support Forum</a></li>
<li><a href="http://wordpress.org/extend/themes/">Themes</a></li>
<li><a href="http://planet.wordpress.org/">WordPress Planet</a></li>
</ul>
</li>
-->
<!-- �������ɽ��
<li><h2>メタ情報</h2>
<ul>
<li><a href="http://unisonet.ciao.jp/wp-admin/">サイト管理</a></li> <li><a href="http://unisonet.ciao.jp/wp-login.php?action=logout">ログアウト</a></li>
<li><a href="http://validator.w3.org/check/referer" title="このページが XHTML 1.0 Transitional に準拠しているか確認する">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
<li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
<li><a href="http://wordpress.org/" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">WordPress</a></li>
</ul>
</li>
-->
</ul>
</div>
<hr />
<div id="footer">
<!-- If you'd like to support WordPress, having the "powered by" link somewhere on your blog is the best way; it's our only promotion or advertising. -->
Copyright (c) 2004--2008 ㈱テストテスト All rights reserved.
<!-- (��)��˥��ͥå� is proudly powered by WordPress ����ɽ��-->
<a href="http://unisonet.ciao.jp/?feed=rss2">投稿 (RSS)</a> と <a href="http://unisonet.ciao.jp/?feed=comments-rss2">コメント (RSS)</a> <!-- 24 個のクエリと 0.423 秒を要しました。 -->
</div>
</div>
<!-- Gorgeous design by Michael Heilemann - http://binarybonsai.com/kubrick/ -->
</body>
</html>
変更後header.php
変更部(分岐追加)にコメント入れてます
<!-- header START -->
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description"><?php bloginfo('description'); ?></div>
</div>
<!-- navigation START -->
<div id="navigationbtn">
<ul id="menus">
<strong><!-- get how deep the page is --></strong>
<?php $depth = get_post_ancestors($post->ID); ?>
<?php if(empty($depth)) {
$depth = 0;}
else{
$depth = count($depth);
}?>
<?php $depth = $depth + 1; ?>
<strong><!-- change navibutton whenever its =over 5/the deepest --></strong>
<?php if($depth < 5): ?>
<?php wp_list_pages('depth=1&title_li=0&sort_column=menu_order'); ?>
<strong> <?php else: ?>//*******回り込む*******
<?php if ( function_exists( 'has_child_page' ) && has_child_page() ) : ?>//*******この行から以下は追加した分岐です*******
<?php wp_list_pages('child_of=' . $post->ID . '&title_li=0&sort_column=menu_order'); ?>
<?php else :/*the deepest*/ ?>
<?php $ret = $post->post_parent ; ?>
<?php echo ($ret) ; ?>
<?php wp_list_pages('child_of=' . $ret . '&title_li=0&sort_column=menu_order'); ?>
<?php endif; ?>
<?php endif; ?></strong>
<li><a class="lastmenu" href="javascript:void(0);"></a></li>
</ul>
<div class="fixed"></div>
</div>
<!-- navigation END -->
<div class="fixed"></div>
</div>
<!-- header END -->
<hr />
二重投稿の削除したほうに対する自己フォロー?でしたので
削除します。ごめんなさい。
< /UL > についてです
最初からheader.phpにあったのですが
私がソースをblockquoteでくくったために?一回目の投稿で消えてしまったみたいです?
変更後header.phpは逆クオートでくくりまして、ul~/ulも見えてます
これが本当の、わたしのheader.phpです
1回目に見てもらったのにすみません・・
goodtimesさん、こんにちは。
サイト拝見させていただきました。
回り込みがメニューの上にコンテンツが重なっている事を指しているのであれば、これは、#headerと#headerimgの高さの設定によるものです。
#header、#headerimgともに200pxで指定されており、隙間がないにも関わらずメニューを差し込んだために、メニュー部分が#headerからはみ出してしまっているのですね。
cssの253行目あたりにある#headerimgのheightを169pxに変更して、さらに
#menus {
margin: 0;
padding: 0;
}
を追加してみてください。
また、文字化けの原因ですが、テンプレートファイルの文字コードがEUCになっているためです。style.cssは追加したコメント部分がshift_jisになっているので、双方ともutf-8に統一しておきましょう。文字化けが原因でブラウザが解析を行えず表示不具合を起こすことも多々ありますので。
Jim912さん
こんにちは
ご回答ありがとうございます
まず文字化けの件ですが、原因ご教示くださってありがとうございます!
でも、ご教示くださった文字コードを変更しているのですが、UPすると文字化けたままの状態なんです。。
正確に文字コード変更できているかも自信がないのですが(というか化けるということはできてないんでしょうね・・)、
Jim912さんの仰る回り込みと私の回り込みがちょっとちがうので、先に投稿させてください
回り込みがメニューの上にコンテンツが重なっている事を指しているのであれば、
重なってるだけじゃないんです、すみません
わたしが言っていた回り込みは、
※サイトを見てくださったようなので、サイトにつけている色でも説明します
※メニュー(赤)の「パッケージ」をクリックした状態での説明です
1.メニュー(赤)に、コンテンツ(青)が重なっている
2.メニュー(赤)とコンテンツ(青)の左端が揃ってない
→ トップページ(緑)のように、メニュー(赤)と左端をそろえたい
→ サイドバーのサブメニュー(色づけなし)の最下層(例えば「あいうえおマネージャー」をクリックしたときだけ、コンテンツが右にずれていました(=メニューに回り込んでる?)
で、Jim912さんがご教示してくださったことをしましたら、
1.はOKになりましたが
2.が階層関係なしに、メニューに回り込むようになりました
文字コード変更の件、引き続き調べてみます
jimさん
ごめんなさい追記です
わたしFireFoxでみてます
ヴァージョンは3.0.5です
いまIEでみたらキレイに表示できてるので、すみません
きっとIEでごらんになってくださったんですね?
大事なこと書き忘れてました、本当申し訳ないです、ごめんなさい
Jim912さん
回り込み、解決しました!!
解除の<div class=”fixed”></div>を、
ヘッダーのしたにもだめもとで入れてやったらFireFoxでも解除してくれました!!
IEにも影響でずです!
ご指摘くださった重なってたところも直ってよかった!
ピーチクパーチク騒がしくしてスミマセン
文字化けはいまだ奮闘中ですが、タイトルの回り込み云々は解決したので
一旦解決済みということにさせてください
文字化けに関しては、過去ログにもあったような気がするので、そちらも参考にしてみます
またお世話になるかもしれませんが、その際はよろしくお願いします
ありがとうございました!