رفتن به مطلب

نمایش دسته های سطح 3


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

سلام .

من یه تکه کدی داشتم که فقط تا 1 سطح از دسته ها رو نمایش میداد. یعنی فقط دسته های اصلی

کلی تغییرش دادم تا زیردسته های سطح 2 رو هم ساپورت کرد .

حالا میخوام سطح 3 و در صورت نیاز سطح 4 رو هم نمایش بده.

در تنظیم کردن تگ ها توی تابع اصلی یخورده به مشکل خوردم

این نمونه کد html که تا 3 سطح میره جلو. و میخوام دسته های وردپرس همینطوری بشه :


<div id="navigation">
<ul class="top-level">
<li><a href="#">Home</a>
<ul class="sub-level">
<li><a href="#">Sub Menu Item 1</a>
</li>
<li><a href="#">Sub Menu Item 2</a>
<ul class="sub-level">
<li><a href="#">Sub Sub Menu Item 1</a></li>
<li><a href="#">Sub Sub Menu Item 2</a></li>
<li><a href="#">Sub Sub Menu Item 3</a></li>
<li><a href="#">Sub Sub Menu Item 4</a></li>
</ul>
</li>
<li><a href="#">Sub Menu Item 3</a></li>
<li><a href="#">Sub Menu Item 3</a></li>
</ul>
</li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li>
<a href="#">FAQ</a>
<ul class="sub-level">
<li><a href="#">Sub Menu Item 1</a></li>
<li><a href="#">Sub Menu Item 3</a>
<ul class="sub-level">
<li><a href="#">Sub Sub Menu Item 1</a></li>
<li><a href="#">Sub Sub Menu Item 2</a></li>
<li><a href="#">Sub Sub Menu Item 3</a></li>
<li><a href="#">Sub Sub Menu Item 4</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">News</a>
<ul class="sub-level">
<li><a href="#">Sub Menu Item 1</a>
<ul class="sub-level">
<li><a href="#">Sub Sub Menu Item 1</a></li>
<li><a href="#">Sub Sub Menu Item 2</a></li>
<li><a href="#">Sub Sub Menu Item 3</a></li>
<li><a href="#">Sub Sub Menu Item 4</a></li>
</ul>
</li>
<li><a href="#">Sub Menu Item 2</a></li>
<li><a href="#">Sub Menu Item 3</a></li>
</ul>
</li>
</ul>
</div>

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


function my_categories() {
$current_category = get_query_var('cat');
$categories= get_categories('');
$a = "\n";
$html = '';
if(!empty($categories)){
$html .= '<ul class="top-level">'.$a;
foreach ($categories as $cat) {
$class = ($current_category == $cat->cat_ID) ? ' current-cat': '';
if ($cat->category_parent == 0){
$html .= '<li>';
$html .= '<a href="' . get_category_link($cat->cat_ID) . '" ';

$html .= '>';
$html .= $cat->cat_name;
$html .= '</a>' .$a;


$childcats= get_categories('child_of='.$cat->cat_ID);


if(!empty($childcats)){
$html .= '<ul class="sub-level">'.$a;
foreach ($childcats as $ccat) {
$class = ($current_category == $ccat->cat_ID) ? ' current-cat': '';
$html .= '<li>';
$html .= '<a href="' . get_category_link($ccat->cat_ID) . ' ';
$html .= '">' . $ccat->cat_name. '</a></li>'.$a;

}

$html .= '</ul>'.$a;
}
$html .= '</li>'.$a;
}
}
$html .= '</ul>'.$a;
return $html;
}
}

لینک به ارسال

مشکل چیه

رو استایل مشکل دارید یا تابع ؟

بی زحمت کامل و واضح توضیح بدید که این کد رو می گذارید چی چاپ می شه و می خواهید چی چاپ بشه

لینک به ارسال

با عرض معذرت . داشتم میرفتم دانشگاه فهمیدم که خوب توضیح ندادم :دی ( باخودم گفتم کاش کسی جواب نده که برم کامل توضیحاتمو بگم شرمندش نشم :$ )

این کد مشکلی نداره. استایل و.. هم ردیفه

یعنی وقتی اون تکه کد html رو اجرا میکنم هیچ مشکلی نیست. تا 3سطح من ازمایش کردم که شاخه ها رو بصورت عمودی و زیرشاخه هارو با 150px فاصله چاپ میکنه. یعنی همون آبشاری از نوع عمودیش

ولی این تابعی که برای وردپرس گذاشتم ، فقط تا 2 سطح رو بصورت آبشاری میاره

به عبارت دیگر

مشکلم اینجاس که میخوام یه مرحله دیگه از تگ های ul و il و a توش گنجانده بشه و کامل کار کنه برای دسته ها

امیدوارم منظور رو رسانده باشم .

لینک به ارسال

خیلی پیچیدش کردید این کد را بگذارید و بهش استایل بدید


<?php wp_list_categories( $args ); ?>
<?php $args = array('child_of'=> 1); ?>

این هم نمونه خروجیش

post-336-0-94889000-1367279446_thumb.png

لینک به ارسال

فقط یک سوال

لطفا اون کدهای html رو ببینید. به کلاسِ تگ های ul هم توجه کنید

من sub-level رو توی css با children که پیشفرض برای زیردسته هست جایگزین کردم.

میمونه top-level . بجای این چی باید بزارم ؟

استایل ها رو هم میزارم شاید لازم بشه.


ul.top-level { background:#666; }
ul.top-level li {
border-bottom: #fff solid;
border-top: #fff solid;
border-width: 1px;
}


ul.children {
display: none;
}

li:hover .children {
background: #999;
border: #fff solid;
border-width: 1px;
display: block;
position: absolute;
right: 150px;
top: 5px;
z-index: 1;
}
ul.children li {
border: none;
float:right;
width:150px;
z-index: 1;
}
/*Seconda Level*/
#navigation .children {
background: #999;
}

/*Third Level*/
#navigation .children .children {
background: #09C;
}
/*RESET STYLES*/
li:hover .children .children {
display:none;
}

.children li:hover .children {
display:block;
}

لینک به ارسال

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

با تشکر از استاد فخار عزیز :X

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

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

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

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

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

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

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

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

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

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