رفتن به مطلب

کد ساخت منوی ساده شبیه این سایت


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

من میخواستم منوی اصلی سایتم رو مثل این سایت (bartarinha.ir)در بیارم . کدهای منوشو از طریق فایر فاکس برداشتم ولی منوها به هم ریخت.

میخواستم کد css و کد php شو بزارم تو سایتم که درست مثل همین منوها رو داشته باشم.

ممنون میشم راهنماییم کنید.

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

این آدرسی که دادید منوی خاصی نداره یک منوی خوابیده ساده داره که با دادن خاصیت float:right به li زیر مجموعه کلاس منو درست می شه

لینک به ارسال

ایمان عزیز من هم دنبال یه خاصیت ساده واسه منوهای سایت هستم . البته من زیاد دانش درباره توابع و خاصیت ul و li ندارم .

به همین خاطر خواستم که لطف کنید و کد php و کد css این منو رو استخراج کنم .

شما میدونید این خاصیت به چه صورت هست؟

تو اینترت بسیار سرچ زدم ولی بیشترین مقاله ها تنها درمورد css و html هستش.

لینک به ارسال

دوست عزیز خودتون رنگ بندی و ... رو انجام بدین .

کد زیر برای فراخوانی دسته ها هست.


<ul class="menu">
<?php wp_list_categories('title_li=&orderby=id'); ?>
</ul>

و کد های زیر را جایگزین کنید در فایل style.css قالبتون .


/* reset */
.menu, .menu ul, .menu li, .menu a {
margin: 0;
padding: 0;
border: none;
outline: none;
}
/* menu */
.menu {
height: 40px;
direction: rtl;
background: #666666;
}
.menu li {
position: relative;
list-style: none;
float: right;
display: block;
height: 40px;
}
/* links */
.menu li a {
display: block;
padding: 0 14px;
margin: 6px 0;
line-height: 28px;
text-decoration: none;
border-left: 1px solid #393942;
font-family: Tahoma, Arial, sans-serif;
font-weight: normal;
font-size: 12px;
color: #f3f3f3;
}

موفق باشید

و اگر هم می خواین منو های دلخواه خودتون رو دستی بذارین از این کد استفاده کنید .


<ul class="menu">
<li><a href="<?php echo get_option('home'); ?>" title="<?php bloginfo('show'); ?>">صفحه نخست </a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
</ul>

ویرایش شده توسط Patoghsara
لینک به ارسال
دوست عزیز خودتون رنگ بندی و ... رو انجام بدین . کد زیر برای فراخوانی دسته ها هست.
[list]

[/list]

و کد های زیر را جایگزین کنید در فایل style.css قالبتون .

 /* reset */ .menu, .menu ul, .menu li, .menu a { margin: 0; padding: 0; border: none; outline: none; } /* menu */ .menu { height: 40px; direction: rtl; background: #666666; } .menu li { position: relative; list-style: none; float: right; display: block; height: 40px; } /* links */ .menu li a { display: block; padding: 0 14px; margin: 6px 0; line-height: 28px; text-decoration: none; border-left: 1px solid #393942; font-family: Tahoma, Arial, sans-serif; font-weight: normal; font-size: 12px; color: #f3f3f3; } 

موفق باشید و اگر هم می خواین منو های دلخواه خودتون رو دستی بذارین از این کد استفاده کنید .

[list]
[*][url="<?php%20echo%20get_option('home');%20?>"]صفحه نخست [/url]
[*][url="<?php%20bloginfo('url');%20?>"]عنوان منو[/url]
[*][url="<?php%20bloginfo('url');%20?>"]عنوان منو[/url]
[*][url="<?php%20bloginfo('url');%20?>"]عنوان منو[/url]
[*][url="<?php%20bloginfo('url');%20?>"]عنوان منو[/url]
[*][url="<?php%20bloginfo('url');%20?>"]عنوان منو[/url]
[/list]

ممنون درست شد فقط یه موضوعی

الا من به صورت دلخواه منوهام رو درست کردم . فقط چطوی به منوهام لینک بدم؟ الان هیچ کدوم لینک ندارن

ممنون

لینک به ارسال

<ul class="menu">
<li><a href="<?php echo get_option('home'); ?>" title="<?php bloginfo('show'); ?>">صفحه نخست </a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
<li> <a class="tcontact" href="<?php bloginfo('url'); ?>" >عنوان منو</a> </li>
</ul>

بجای


<?php bloginfo('url'); ?>

آدرس بگذارید

لینک به ارسال

کد


<?php bloginfo('url'); ?>

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


<?php bloginfo('url'); ?>/contact

هم بکار برد ولی می تونید لینک رو دستی هم وارد کنید مثلاً


<li> <a class="tcontact" href="http://www.google.com" >عنوان منو</a> </li>

لینک به ارسال

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

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

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

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

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

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

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

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

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