- إصدار الزين فورو
- XenForo 2.x
قبل:
بعد:
السلام عليكم ..
رمضانكم مبارك وكل عام وانتم بخير
شرحنا اليوم هو اضافة امكانية فتح واغلاق الاقسام من الرئيسية
مثال: ستايل منتديات شباب الرافدين
طريقة الاضافة:
البحث عن قالب:
داخل القالب :
البحث عن:
واستبدالها بالكود التالي:
البحث عن:
اسفلها نضيف الكود التالي:
نبحث عن الكود التالي:
نستبدله بالكود التالي:
اخر الكود نضيف:
البحث عن:
نضيف اعلاها الكود التالي:
البحث عن:
استبداله بالكود التالي:
نسوي حفظ للقالب.
نبحث عن القالب:
نسوي حفظ للقالب.
إنتهى.
بعد:
السلام عليكم ..
رمضانكم مبارك وكل عام وانتم بخير
شرحنا اليوم هو اضافة امكانية فتح واغلاق الاقسام من الرئيسية
مثال: ستايل منتديات شباب الرافدين
طريقة الاضافة:
البحث عن قالب:
node_list_categoryداخل القالب :
البحث عن:
HTML:
<div class="block block--category block--category{$node.node_id}">
واستبدالها بالكود التالي:
HTML:
<div class="block block--category block--category{$node.node_id} collapsible-nodes">
البحث عن:
HTML:
<h2 class="block-header">
اسفلها نضيف الكود التالي:
HTML:
<div class="block-header--left">
نبحث عن الكود التالي:
HTML:
<div class="block-desc">{$node.description|raw}</div></xf:if>
نستبدله بالكود التالي:
HTML:
<xf:if is="{$node.description}"><span class="block-desc">{$node.description|raw}</span></xf:if>
اخر الكود نضيف:
HTML:
</div>
البحث عن:
HTML:
</h2>
نضيف اعلاها الكود التالي:
HTML:
<span id="collapse-{$node.node_id}" class="collapseTrigger collapseTrigger--block is-active" data-xf-click="toggle" data-xf-init="toggle-storage" data-target=".block--category{$node.node_id} .block-body" data-storage-key="_node-{$node.node_id}"></span>
البحث عن:
HTML:
<div class="block-body">
استبداله بالكود التالي:
HTML:
<div class="block-body block-body--collapsible is-active">
نسوي حفظ للقالب.
نبحث عن القالب:
extra.less ونضيف اخره الكود التالي:
CSS:
/* Node Collapse */
.block--category .collapseTrigger {
opacity: 0.5;
transition: opacity 0.3s;
margin-right: 10px;
}
.block--category .collapseTrigger.is-active:before {
.m-faBase();
content: "\f146";
transform: scale(-1, 1);
margin-right: -8px;
}
.block--category .collapseTrigger:before {
.m-faBase();
content: "\f0fe";
font-size: 80%;
}
.block--category .block-container:hover .collapseTrigger {
opacity: 1;
}
.collapsible-nodes .block-header {
display: flex;
}
.collapsible-nodes .block-header--left {
margin-right: auto;
max-width: 100%;
}
نسوي حفظ للقالب.
إنتهى.
