رفتن به مطلب

مشکل تداخل منوها


پست های پیشنهاد شده

درود دوستان من...

من در قالب دو تا منو طراحی کردم...

یکی منوی ساده هستش که بالا قرار گرفته و دیگر منوی آیکونی است که در هدر قرار گرفته است حالا کار استایل نویسی و اچی تی ام ال نویسی آن تمام شده است و به آن با تابع وردپرس فراخوانی کردیم و دیدم هنوز مشکلی داره که متاسفانه آن نتونستم حل کنم...

حالا وقتی منوها فراخوانی می کنم یه استایل جدید خالی از منوی اولی در هدر ایجاد می شود...

عکس زیر:

6qdopbbrowlhp1uhpg8a.png

این از تابع زیر که استفاده می کنم:


<?php
function register_my_menus() {
register_nav_menus(
array(
'top_menu' =>"منوی بالا",
'header-nav' =>"منوی اصلی"
)
);
}
add_action( 'init', 'register_my_menus' );
?>


<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>
<?php wp_nav_menu( array( 'theme_location' => 'header-nav',"container"=>"" ) ); ?>

اینم کد اچ تی ام ال منوها:


<div class="menu">
<div class="main_menu">
<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>
<div class="search" role="search">
<form action="" method="">
<input type="text" name="" value="" placeholder="جستجوی کلمه مورد نظر" onfocus="this.placeholder=''" onblur="this.placeholder='جستجوی کلمه مورد نظر'">
</form>
</div>
</div>
</div>
<div id="main" role="main">
<header>
<nav id="header-nav" role="navigation">
<?php wp_nav_menu( array( 'theme_location' => 'header-nav',"container"=>"" ) ); ?>
</nav>

خب ممنون میشم این مشکل منو حل کنید.... ^_^

ویرایش شده توسط iraymond
لینک به ارسال

استایل هاتون رو قرار بدید به نظرم css ها مشکل داشته باشه

به نظرم کد زیر رو داخل div بذارید و اینو با سرچ باکس float بدید مشکل حل میش

بازم css بذارید دقیق تر میش راهنمایی کرد


<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>

لینک به ارسال

استایل هاتون رو قرار بدید به نظرم css ها مشکل داشته باشه

به نظرم کد زیر رو داخل div بذارید و اینو با سرچ باکس float بدید مشکل حل میش

بازم css بذارید دقیق تر میش راهنمایی کرد


<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>

اینم کد سی اس اس :


.menu{
width: 100%;
height: 50px;
background: #2c3e50;
position: relative;
}
.main_menu{
width: 1100px;
margin: 0 auto;
}
.main_menu > ul > li{
display: inline-block;
float: right;
position: relative;
}
.main_menu > ul > li > a{
color: #FDFDFD;
display: block;
padding: 12px 15px;
font: 13px/2 'iraymond';
}
.main_menu > ul > li > a:hover{
background: #27ae60;
}
.search{
float: left;
margin: 7px 0 0 0;
}
.search input{
background: #23313f url(images/search.png) 3% no-repeat;
padding: 8px 10px 8px 70px;
border: 2px solid #23313f;
color: #FDFDFD;
direction: rtl;
text-align: right;
font: 11px Tahoma;
transition:all .2s ease-in-out;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
-o-transition:all .2s ease-in-out;
}
.search input:focus{
border: 2px solid #27ae60;
transition:all .2s ease-in-out;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
-o-transition:all .2s ease-in-out;
}
#main{
width: 1100px;
margin: 20px;
}
#header-nav{
margin: 0 auto;
}
#header-nav ul > li{
width: 100px;
height: 105px;
background: #ccc;
float:right;
}
#header-nav ul > li > a{
display: block;
text-align: center;
padding: 0;
margin: 0;
color: #FDFDFD;
font: 13px 'iraymond','Tahoma';
}
#header-nav .fa{
/*margin: 10px auto;*/
}
.nav-txt{
line-height: 15px;
}

لینک به ارسال

اون div بندی ابتدای کدتون اصلن جالب نیس

اینجور ک به نظر میاد اون div ک کلاس main داره اصلن کاربردی نداره !!

کدهاتون رو به این حالت تغییر بدید و اون float رو که گفتم انجام بدید برای main_menu و width اون رو هم auto بذارید ببینید جواب میده


<div class="menu">
<div class="main_menu">
<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>
</div>
<div class="search" role="search">
<form action="" method="">
<input type="text" name="" value="" placeholder="جستجوی کلمه مورد نظر" onfocus="this.placeholder=''" onblur="this.placeholder='جستجوی کلمه مورد نظر'">
</form>
</div>
</div>
<div id="main" role="main">
<header>
<nav id="header-nav" role="navigation">
<?php wp_nav_menu( array( 'theme_location' => 'header-nav',"container"=>"" ) ); ?>
</nav>

لینک به ارسال

اون div بندی ابتدای کدتون اصلن جالب نیس

اینجور ک به نظر میاد اون div ک کلاس main داره اصلن کاربردی نداره !!

کدهاتون رو به این حالت تغییر بدید و اون float رو که گفتم انجام بدید برای main_menu و width اون رو هم auto بذارید ببینید جواب میده


<div class="menu">
<div class="main_menu">
<?php wp_nav_menu( array( 'theme_location' => 'top_menu',"container"=>"" ) ); ?>
</div>
<div class="search" role="search">
<form action="" method="">
<input type="text" name="" value="" placeholder="جستجوی کلمه مورد نظر" onfocus="this.placeholder=''" onblur="this.placeholder='جستجوی کلمه مورد نظر'">
</form>
</div>
</div>
<div id="main" role="main">
<header>
<nav id="header-nav" role="navigation">
<?php wp_nav_menu( array( 'theme_location' => 'header-nav',"container"=>"" ) ); ?>
</nav>

باشه امتحان کنم...

چند دقیقه دیگه نتیجه رو میگم...

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...