اظهار الاقسام الفرعية بشكل عمودي شرح للجيل الثانى

[لجنة التطوير]

السلام عليكم ورحمه الله وبركاته

قبل عدة اشهر ابو كريم شرح طريقة سهل ومبسطه جدا لكيفية جعل الاقسام الفرعية تظهر بشكل عمودى يادوب التنفيذ يام من خلال خطوة واحدة لمن اراد الدرس من هنا طريقة جعل الاقسام الفرعية تحت بعضها بشكل عمودي للجيل الثانى xf 2.0 اليوم سيتم شرحها بس بطريقة مطوله شويه (مصدر الموضوع ستجده اسفل الشرح)

الخطوات

1- من لوحة التحكم >> المظهر >> خصائص الستايل >> قائمة الاقسام / المنتديات - Node/Forum List >> اسلوب عرض المنتديات الفرعية >> اختر الخيار الثاني (مدرجة أسفل المنتدى). تم عمل هذه الخطوه للتاكد من ان الاقسام الفعريه ستظهر بالرئيسية يوجد شرح هنا بالمعهد بالصور

2- من لوحة التحكم >> المظهر >> البحث عن القوالب >> فى مربع البحث ابحث عن قالب اسمه node_list_forum


3- داخل هذا القالب ابحث عن الكود التالي


كود:

---

<xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'flat'"> <xf:macro template="forum_list" name="sub_nodes_flat" arg-children="{$children}" arg-childExtras="{$childExtras}" arg-depth="{{ $depth + 1 }}" /> </xf:if>

---

قم بحذف هذا الكود قبل القدوم على هذا العمل قم باخذ نسخة من الكود لانك هتحتاجه بالخطوه القادمة.

4- في نفس القالب ابحث عن الكود التالي:




كود:

---

</div> <xf:if is="{$depth} == 1">

---

أعلى هذا الكود قم بوضع الكود التالى






كود PHP:

---

[LEFT][CODE][COLOR=#000000] [COLOR=#007700]<[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if [/COLOR][COLOR=#0000BB]is[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#0000BB]$depth[/COLOR][COLOR=#DD0000] == 2 AND property('nodeListSubDisplay') == 'flat'"[/COLOR][COLOR=#007700]> 
            <[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:[/COLOR][COLOR=#0000BB]macro template[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"forum_list" [/COLOR][COLOR=#0000BB]name[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"sub_nodes_flat" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]children[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#007700]{[/COLOR][COLOR=#0000BB]$children[/COLOR][COLOR=#007700]}[/COLOR][COLOR=#DD0000]" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]childExtras[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#007700]{[/COLOR][COLOR=#0000BB]$childExtras[/COLOR][COLOR=#007700]}[/COLOR][COLOR=#DD0000]" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]depth[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"{{ [/COLOR][COLOR=#0000BB]$depth[/COLOR][COLOR=#DD0000] + 1 }}" [/COLOR][COLOR=#007700]/> 
        </[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if>  [/COLOR][/COLOR]

[/LEFT][/CODE]

---

5 - ابحث عن القالب: node_list_category بداخل هذا القالب ابحث عن




كود:

---

<xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'flat'"> <xf:macro template="forum_list" name="sub_nodes_flat" arg-children="{$children}" arg-childExtras="{$childExtras}" arg-depth="{{ $depth + 1 }}" /> </xf:if>

---

قم بحذف هذا الكود قبل القدوم على هذا العمل قم باخذ نسخة من الكود لانك هتحتاجه بالخطوه القادمة.
6- في نفس القالب ابحث عن الكود التالي:






كود:

---

</div> </xf:macro> <xf:macro name="depthN" arg-node="!" arg-extras="!" arg-children="!" arg-childExtras="!" arg-depth="1">

---

فوق هذا الكود الصق الكود التالى.




كود PHP:

---

[LEFT][CODE][COLOR=#000000] [COLOR=#007700]<[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if [/COLOR][COLOR=#0000BB]is[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#0000BB]$depth[/COLOR][COLOR=#DD0000] == 2 AND property('nodeListSubDisplay') == 'flat'"[/COLOR][COLOR=#007700]> 
            <[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:[/COLOR][COLOR=#0000BB]macro template[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"forum_list" [/COLOR][COLOR=#0000BB]name[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"sub_nodes_flat" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]children[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#007700]{[/COLOR][COLOR=#0000BB]$children[/COLOR][COLOR=#007700]}[/COLOR][COLOR=#DD0000]" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]childExtras[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"[/COLOR][COLOR=#007700]{[/COLOR][COLOR=#0000BB]$childExtras[/COLOR][COLOR=#007700]}[/COLOR][COLOR=#DD0000]" 
                      [/COLOR][COLOR=#0000BB]arg[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]depth[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"{{ [/COLOR][COLOR=#0000BB]$depth[/COLOR][COLOR=#DD0000] + 1 }}" [/COLOR][COLOR=#007700]/> 
        </[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if>  [/COLOR][/COLOR]

[/LEFT][/CODE]

---

احفظ القالب.
الخطوة الاخيره:
ابحث عن قالب: extra.less
افتح القالب واضف الكود التالي في نهايته:
كود PHP:

---

[LEFT][CODE][COLOR=#000000] [COLOR=#007700]<[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if [/COLOR][COLOR=#0000BB]is[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"property('nodeListSubDisplay') == 'flat'"[/COLOR][COLOR=#007700]> 
.[/COLOR][COLOR=#0000BB]node[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]subNodeFlatList [/COLOR][COLOR=#007700]{ 
        [/COLOR][COLOR=#0000BB]background[/COLOR][COLOR=#007700]: @[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]paletteColor1[/COLOR][COLOR=#007700]; 
        [/COLOR][COLOR=#0000BB]border[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]top[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]1px solid [/COLOR][COLOR=#007700]@[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]borderColorFaint[/COLOR][COLOR=#007700]; 
        [/COLOR][COLOR=#0000BB]padding[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]10px 25px[/COLOR][COLOR=#007700]; 
} 
.[/COLOR][COLOR=#0000BB]node[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]subNodeFlatList [/COLOR][COLOR=#007700]> [/COLOR][COLOR=#0000BB]li [/COLOR][COLOR=#007700]{ 
        [/COLOR][COLOR=#0000BB]margin[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]right[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]0[/COLOR][COLOR=#007700]; 
        [/COLOR][COLOR=#0000BB]width[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]25[/COLOR][COLOR=#007700]%;  [/COLOR][COLOR=#FF8000]/** Change this value to increase the amount of links in each row **/ [/COLOR]
[COLOR=#007700]} 

@[/COLOR][COLOR=#0000BB]media [/COLOR][COLOR=#007700]([/COLOR][COLOR=#0000BB]max[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]width[/COLOR][COLOR=#007700]: @[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]responsiveMedium[/COLOR][COLOR=#007700]) 
{ 
    .[/COLOR][COLOR=#0000BB]block[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]body [/COLOR][COLOR=#007700].[/COLOR][COLOR=#0000BB]node 
    [/COLOR][COLOR=#007700]{ 
        .[/COLOR][COLOR=#0000BB]node[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]subNodesFlat 
        [/COLOR][COLOR=#007700]{ 
            [/COLOR][COLOR=#0000BB]display[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]block[/COLOR][COLOR=#007700]; 
        } 
    } 
} 
@[/COLOR][COLOR=#0000BB]media [/COLOR][COLOR=#007700]([/COLOR][COLOR=#0000BB]max[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]width[/COLOR][COLOR=#007700]: @[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]responsiveNarrow[/COLOR][COLOR=#007700]) 
{ 
    .[/COLOR][COLOR=#0000BB]block[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]body [/COLOR][COLOR=#007700].[/COLOR][COLOR=#0000BB]node 
    [/COLOR][COLOR=#007700]{ 
        .[/COLOR][COLOR=#0000BB]node[/COLOR][COLOR=#007700]-[/COLOR][COLOR=#0000BB]subNodesFlat 
        [/COLOR][COLOR=#007700]{ 
            [/COLOR][COLOR=#0000BB]display[/COLOR][COLOR=#007700]: [/COLOR][COLOR=#0000BB]none[/COLOR][COLOR=#007700]; 
        } 
    } 
} 
</[/COLOR][COLOR=#0000BB]xf[/COLOR][COLOR=#007700]:if>  [/COLOR][/COLOR]

[/LEFT][/CODE]

---

نتيجة العمل

مع أجمل تحية معتادهـ

​