Q&A
マークダウンを使いましょう
前提・実現したいこと
ここに質問の内容を詳しく書いてください。
ワードプレスを利用してHPをつくっています。
以下の画像のように、
サイトタイトルとロゴを左寄せに、ナビゲーションメニューを右側に寄せたいです。
発生している問題・エラーメッセージ
header自体が表示されない。
該当のソースコード
header.phpに記載している該当コード
<body <?php body_class(); ?>> <?php wp_body_open(); ?> <header class="myhead mycontainer"><?php endif ?> <div class="alignfull"> <p class="rikken"> <img src="画像のコード"> </p> <a href="<?php echo esc_url( home_url( '/' ) ); ?>"> <?php bloginfo( 'name' ); ?> <p><?php bloginfo( 'description' ); ?></p> </a> <?php wp_nav_menu( array( 'theme_location'=>'original-menu', 'container'=>'nav', 'items_wrap' =>'<ul id="original-nav">%3$s</ul>')); ?> </header> </div> <?php if( has_nav_menu( 'primary' ) ): ?> <nav class="mynav"> <div class="mycontainer"> <div class="alignwide"> <?php wp_nav_menu( array( 'theme_location' => 'original-menu', ) ); ?> </div> </div> </nav> <?php endif; ?><?php if(is_front_page() || is_home()) : ?> <?php if ( get_header_image() ) : ?> <a href="<?php echo esc_url( home_url( '/' ) ); ?>"> <img src="<?php header_image(); ?>" class="header-image" alt="<?php bloginfo( 'name' ); ?>" /></a> <?php endif; ?>
style.cssのコード
/* ヘッダー */
.myhead > div {
float: left;
justify-content: space-between;
align-items: center;
padding: 10px 0;
color: #444444;
}
p.rikken img {
width: 100px;
}
.myhead a {
font-size: var(--f3);
font-family: var(--myfont);
}
.myhead p {
margin: 0;
font-size: var(--f6);
}
#gazou-wide nav { /* 元々のメニューを非表示 /
display: none;
}
#header-r { / ヘッダー右側のボックスの幅 /
width: 800px;
}
ul#original-nav { / 上からの位置を調整 */
margin-top: 10px;
}
ul#original-nav li {
list-style-type: none;
float: left;
width: 30%;
text-align: center;
padding: 10px 0;
}
ul#original-nav li a {
text-decoration: none;
color: #666;
font-size: var(--f6);
}
回答1件
0
単純にphpのif文の内容を満たしてないんじゃないでしょうか？
それとwp_nav_menuで表示させようとしているメニューは存在してますでしょうか？
wp_nav_menuについては下記のドキュメントを読むとわかると思います。
https://wpdocs.osdn.jp/テンプレートタグ/wp_nav_menu
もし違うのであれば、WEB上に公開されてる街頭のサイトを提示してもらえると解決まで早いです。
よろしかったら教えてもらえればと思います。
投稿2020/01/03 04:07
総合スコア142
headerのHTMLが以下のようになっているので、ほとんどHTMLが出力されてませんね。
つまりif文の中身の条件を満たしていない、各種プロパティが管理画面で設定されていないということなので、この二つを確認してください。
Wordpressの関数はググると情報がいっぱい出てきますので、そういうサイトを見ながら学ぶと良いかと思います。
---------------
<header class="myhead mycontainer">
<nav id="mainmenu" class="mainmenu"><ul id="menu-nav" class="menu"><li id="menu-item-82" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-82"><a href="http://ec2-18-177-118-180.ap-northeast-1.compute.amazonaws.com/index.php/%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82%e3%81%82/">ホーム</a></li>
<li id="menu-item-78" class="menu-item menu-item-type-post_type menu-item-object-post menu-item-78"><a href="http://ec2-18-177-118-180.ap-northeast-1.compute.amazonaws.com/index.php/2019/12/30/news/">活動報告</a></li>
<li id="menu-item-79" class="menu-item menu-item-type-post_type menu-item-object-post menu-item-79"><a href="http://ec2-18-177-118-180.ap-northeast-1.compute.amazonaws.com/index.php/2019/12/30/message/">メッセージ</a></li>
<li id="menu-item-80" class="menu-item menu-item-type-post_type menu-item-object-post menu-item-80"><a href="http://ec2-18-177-118-180.ap-northeast-1.compute.amazonaws.com/index.php/2019/12/30/profile/">プロフィール</a></li>
<li id="menu-item-81" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-81"><a href="http://ec2-18-177-118-180.ap-northeast-1.compute.amazonaws.com/index.php/contact/">お問い合わせ</a></li>
</ul></nav>
</header>
---------------
あなたの回答
tips
プレビュー
