عيد الاضحى المبارك


مواضيع تهمك

ركن شروحات الزين فورو XENFORO هذا القسم خاص بكل شروحات إستخدام XENFORO وتعديلات القوالب

اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى بى

السلام عليكم ورحمه الله وبركاته حاصية جديد وطريقة جديدة يتم اضافتها على الاسكريبت الاكثر من رائعه وهى خاصية...

احصائياتى

الردود
7

المشاهدات
3324
abo-karim
.:: Administrator ::.
  • abo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud ofabo-karim has much to be proud of

  • abo-karim غير متواجد حالياً

المشاركات
4,227

+التقييم
20

تاريخ التسجيل
Jun 2015

الاقامة
ام الدنيــ EGYPT ــا

نظام التشغيل
windows 7

رقم العضوية
1
02-17-2018, 05:00 PM
المشاركة 1
02-17-2018, 05:00 PM
المشاركة 1
افتراضي اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى بى
السلام عليكم ورحمه الله وبركاته
حاصية جديد وطريقة جديدة يتم اضافتها على الاسكريبت الاكثر من رائعه وهى خاصية Collapsible Node Categories والتى تتيح لم ولاعضاء منتداك او الزوار بتقليص او اخفاء اقسام المنتدى بالصفحة الرئيسية كما هو الحال فى منتديات الفى بى VB واليوم اقوم بطرحها لكم داعين المولى عز وجل ان يوفقنا جميعا الى ما هو خير لنا.
اسم الدرس : Collapsible Node Categories
التوافق الدرس : مع الجيل الثانى XF 2.0
صورة من العمل ونتيجته


الشرح
1- ادخل الى لوحة تحكم المنتدى >> المظهر >> البحث عن القوالب >> ابحث عن قالب اسمه node_list_category بداخله ابحث عن هذا الكود.
كود:
<div class="block block--category block--category{$node.node_id}">
استبداله بـــ
كود:
<div class="block block--category block--category{$node.node_id} collapsible-nodes">
2- فى نفس القالب ابحث عن
كود:
<h2 class="block-header">
اسفله ضع هذا الكود
كود:
<div class="block-header--left">
3- ثم ابحث داخل نفس القالب عن
كود:
<div class="block-desc">{$node.description|raw}</div></xf:if>
ضع بعدها
كود:
</div>
4- ثم ابحث عن
كود:
</h2>
ضع قبلها مباشره هذا الكود
كود:
<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>
5- ثم قم بالبحث عن
كود:
<div class="block-body">
استبداله بـــ
كود:
<div class="block-body block-body--collapsible is-active">
ثم قم بالحفظ

6 - توجه الان الى قالب اسمه extra.less ضع فيه هذا لكود.
كود:
/* Node Collapse */
.block--category
{
    .collapseTrigger
    {
        opacity: 0.5;
        transition: opacity 0.3s;
        margin-right: 10px;
        &.is-active:before
        {
            content: "\f205";
            transform: scale(-1, 1);
            margin-right: -8px;
        }
        &:before
        {
            content: "\f205";
            font-size: 80%;
        }
    }
    .block-container:hover .collapseTrigger
    {
        opacity: 1;
    }
}

.collapsible-nodes
{
        .block-header
        {
            display: flex;
        }
        .block-header--left
        {
            margin-right: auto;
            max-width: 100%;
        }
    
    .block-body
    {
        transition: all 0.75s cubic-bezier(0.68, -0.55, 0.27, 1.55);
        -webkit-transition-property: all, -xf-opacity;
        transition-property: all, -xf-opacity;
        overflow-y: hidden;
        height: 0;
        -webkit-transition-property: all, -xf-height;
        transition-property: all, -xf-height;
        &.is-active
        {
            height: auto;
        }
    }
}

/* Node Collapse end */
ثم احفظ
انتهى


من منكم احس الموضوع صعب ليها فقط باستبدال قالب node_list_category بالكامل بهذا القالب.
كود:
<xf:macro name="depth1" arg-node="!" arg-extras="!" arg-children="!" arg-childExtras="!" arg-depth="1">
    <div class="block block--category block--category{$node.node_id} collapsible-nodes">
        <span class="u-anchorTarget" id="{$node.Data.getCategoryAnchor()}"></span>
        <div class="block-container">
            <h2 class="block-header">
            <div class="block-header--left">
                <a href="{{ link('categories', $node) }}">{$node.title}</a>
                <xf:if is="{$node.description}"><div class="block-desc">{$node.description|raw}</div></xf:if></div>
<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>
            </h2>
            <div class="block-body block-body--collapsible is-active">
                <xf:macro template="forum_list" name="node_list"
                    arg-children="{$children}"
                    arg-extras="{$childExtras}"
                    arg-depth="{{ $depth + 1 }}" />
            </div>
        </div>
    </div>
</xf:macro>

<xf:macro name="depth2" arg-node="!" arg-extras="!" arg-children="!" arg-childExtras="!" arg-depth="1">
    <div class="node node--id{$node.node_id} node--depth{$depth} node--category {{ $extras.hasNew ? 'node--unread' : 'node--read' }}">
        <div class="node-body">
            <span class="node-icon" aria-hidden="true"><i></i></span>
            <div class="node-main js-nodeMain">
                <xf:set var="$descriptionDisplay" value="{{ property('nodeListDescriptionDisplay') }}" />
                <h3 class="node-title">
                    <a href="{{ link('categories', $node) }}" data-xf-init="{{ $descriptionDisplay == 'tooltip' ? 'element-tooltip' : '' }}" data-shortcut="node-description">{$node.title}</a>
                </h3>
                <xf:if is="$descriptionDisplay != 'none' && $node.description">
                    <div class="node-description {{ $descriptionDisplay == 'tooltip' ? 'node-description--tooltip js-nodeDescTooltip' : '' }}">{$node.description|raw}</div>
                </xf:if>

                <div class="node-meta">
                    <xf:if is="!{$extras.privateInfo}">
                        <div class="node-statsMeta">
                            <dl class="pairs pairs--inline">
                                <dt>{{ phrase('threads') }}</dt>
                                <dd>{$extras.discussion_count|number}</dd>
                            </dl>
                            <dl class="pairs pairs--inline">
                                <dt>{{ phrase('messages') }}</dt>
                                <dd>{$extras.message_count|number}</dd>
                            </dl>
                        </div>
                    </xf:if>

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

                <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>
            </div>

            <xf:if is="!{$extras.privateInfo}">
                <div class="node-stats">
                    <dl class="pairs pairs--rows">
                        <dt>{{ phrase('threads') }}</dt>
                        <dd>{$extras.discussion_count|number}</dd>
                    </dl>
                    <dl class="pairs pairs--rows">
                        <dt>{{ phrase('messages') }}</dt>
                        <dd>{$extras.message_count|number}</dd>
                    </dl>
                </div>
            </xf:if>

            <div class="node-extra">
                <xf:if is="{$extras.privateInfo}">
                    <span class="node-extra-placeholder">{{ phrase('private') }}</span>
                <xf:elseif is="{$extras.last_post_date}" />
                    <div class="node-extra-row"><a href="{{ link('posts', {'post_id': $extras.last_post_id}) }}" class="node-extra-title" title="{$extras.last_thread_title}">{$extras.last_thread_title}</a></div>
                    <div class="node-extra-row">
                        <ul class="listInline listInline--bullet">
                            <li class="node-extra-date"><xf:date time="{$extras.last_post_date}" /></li>
                            <xf:if is="$xf.visitor.isIgnoring($extras.last_post_user_id)">
                                <li class="node-extra-user">{{ phrase('ignored_member') }}</li>
                            <xf:else />
                                <li class="node-extra-user"><xf:username user="{{ {'user_id': $extras.last_post_user_id, 'username': $extras.last_post_username} }}" /></li>
                            </xf:if>
                        </ul>
                    </div>
                <xf:else />
                    <span class="node-extra-placeholder">{{ phrase('none') }}</span>
                </xf:if>
            </div>
        </div>
    </div>
</xf:macro>

<xf:macro name="depthN" arg-node="!" arg-extras="!" arg-children="!" arg-childExtras="!" arg-depth="1">
    <li>
        <a href="{{ link('categories', $node) }}" class="subNodeLink subNodeLink--category {{ $extras.hasNew ? 'subNodeLink--unread' : '' }}">{$node.title}</a>
        <xf:macro template="forum_list" name="sub_node_list"
            arg-children="{$children}"
            arg-childExtras="{$childExtras}"
            arg-depth="{{ $depth + 1 }}" />
    </li>
</xf:macro>


قديم 02-17-2018, 05:05 PM
المشاركة 2
abo-karim
.:: Administrator ::.
  • abo-karim غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى
شباب للمزيد و اصل الموضوع
ستجدوه هنا
كود:
https://xenforo.com/community/resources/collapsible-user-extras.6180/

قديم 02-17-2018, 11:52 PM
المشاركة 3
طيور الظلام
.:: عضو فعال ::.
  • طيور الظلام غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى
مشاء الله

شرح مهم وكنت منتظره للجيل الاول

شكرا لك على الطرح

قديم 03-18-2018, 07:39 AM
المشاركة 4
legend
.:: عضو جديد ::.
  • legend غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى
شرح كافي ووافي. شكرا لك على هذه الاضافه.

قديم 03-02-2019, 08:13 PM
المشاركة 5
Araby5050
.:: عضو مشارك ::.
  • Araby5050 غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى
جزاك الله خيرا اخى ابوكريم

الطريقه تعمل ايضا للنسخه 2.1 ياغالى وتم التجربه وتعمل بنجاح

ولكن كنت قد عملت توسيط لاسم القسم ووجدت ان اسم القسم اصبح بالجهه اليمنى بعد تطبيق الدرس

فهل من طريقه لتوسيط اسم القسم مع الحفاظ على شكل هذه الطريقه

بانتظارك ياغالى

قديم 05-21-2020, 01:13 AM
المشاركة 6
هيلبرنت
.:: رفيق درب ::.
  • هيلبرنت غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصف
يعطيك الف عافية ابو كريم

قديم 05-21-2020, 04:36 AM
المشاركة 7
maaidni
.:: معرب ومطور ومشرف ::.
قسم منتديات XenForo
  • maaidni غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصف
بارك الله فيك اخي الكريم على الموضوع الرائع

قديم 07-12-2021, 04:25 PM
المشاركة 8
هاوي برمجة
.:: عضو مشارك ::.
  • هاوي برمجة غير متواجد حالياً
افتراضي رد: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصف
جزاك الله خيرا اخى

اضافة رد

العلامات المرجعية

اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى بى


أدوات الموضوع

الانتقال السريع
المواضيع المتشابهه للموضوع: اضافة خاصية Collapsible Node Categories لاخفاء اقسام المنتدى بالصفحة الرئيسية كما بمنتديات الفى بى
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
شرح تفعيل خاصية ظهور الاقسام الفرعيه بالصفحة الرئيسية للمنتدى هيلبرنت ركن تطوير منتديات vb3.8.0 4 04-30-2022 02:31 AM
طريقة فصل اقسام المنتدى بالصفحة الرئيسية XenForo هيلبرنت ركن شروحات الزين فورو XENFORO 4 06-08-2018 10:58 AM
[ شرح ] : طريقة تخصيص اقسام للنساء بمنتديات الزين فورو ومنع الذكور من الدخول الى اقسام النساء طيور الظلام ركن شروحات الزين فورو XENFORO 4 05-16-2018 03:06 AM
[XF 1.x Add] : هاك الاحصائيات اسفل المنتدى الشبيه بمنتديات الفى بى الان للزين فورو abo-karim اضافات الزين فورو XENFORO 12 03-14-2018 05:19 PM
اضافة رتب الاعضاء بالصفحة الرئيسية للمنتدى بدون هاك abo-karim ركن تطوير منتديات vb3.8.0 4 10-20-2015 12:58 AM




الساعة الآن 09:57 AM
RSS 2.0XML Site MapTAGS SiteInfo SiteRSS FeedMap SectionsvB MapsMap TagSitemap ForumMaps Forum