ما الجديد
مرحبا بك زائرنا الكريم في موقع شقاوي للتصميم والبرمجة اذا كانت هذه زيارتك اﻻولى فنتشرف بانضمامك لنا وان كنت احد كوكبة اعضائنا فأهلا بعودتك مرة أخرى

شرح احصائيات القسم اسفل كل قسم

بسم الله الرحمن الرحيم الحمد لله والصلاة والسلام على اشرف خلق الله نبينا محمد وعلى آله وصحبة أجمعين. اللهم لا علم لنا إلا ما علمتنا، إنك أنت العليم...

shqawe

shqawe

.:: تركي الودعاني ::.
طاقم الإدارة
إنضم
23 يوليو 2023
المشاركات
999
الحلول
8
مستوى التفاعل
585
النقاط
93
بسم الله الرحمن الرحيم

الحمد لله والصلاة والسلام على اشرف خلق الله نبينا محمد وعلى آله وصحبة أجمعين.

اللهم لا علم لنا إلا ما علمتنا، إنك أنت العليم الحكيم، اللهم علمنا ما ينفعنا، وانفعنا بما علمتنا، وزدنا علما.

اقدم لكم اليوم طريقة اضافة احصائيات القسم اسفل كل قسم وهذه الطريقة تم طلبها من اخونا الغالي @Binkaddas واتمنى ان يكون الشرح حسب ما طلب ان شاء الله

ناتج الشرح سوف يكون مثل ماهو موجود في الصورة التالية والمحدد باللون اﻻحمر:

1750684080987.png


بسم الله نبدأ:

اولا نقوم بفتح قالب node_list_category ونبحث عن الكود التالي وعادة ما يبدأ من السطر رقم 5:

HTML: 
<div class="block-body">
    <xf:macro id="forum_list::node_list"
              arg-children="{$children}"
              arg-extras="{$childExtras}"
              arg-depth="{{ $depth + 1 }}" />
</div>

ونضيف اسفله الكود التالي:

HTML: 
<!-- [START NODE STATS] -->
<div class="block-footer node-status">
    <dl class="pairs pairs--inline node-name">
        <dt>
        </dt>
        <dd>
            <xf:fa icon="fa-folder" />
            {$node.title}</dd>
    </dl>
    <dl class="pairs pairs--inline">
        <dt>
            <xf:fa icon="fa-file-alt" />
            {{ phrase('threads') }}</dt>
        <dd>{$extras.discussion_count|number_short(1)}</dd>
    </dl>
    <dl class="pairs pairs--inline">
        <dt>
            <xf:fa icon="fa-comment" />
            {{ phrase('messages') }}</dt>
        <dd>{$extras.message_count|number_short(1)}</dd>
    </dl>
</div>
<!-- \[END NODE STATS] -->

بعد ذلك نحفط القالب ونقوم باضافة الكود التالي الى قالب extra.less

CSS: 
.block-footer
{
    &.node-status
    {
        display: flex;
        gap: 1rem;
    }
}

@media (max-width: @xf-responsiveNarrow)
{
    .block-footer.node-status{
        .pairs.pairs--inline.node-name
        {
            display: none;
        }
    }
}


واحفظ القالب

والى هنا ينتهي شرحنا الى هذا الدرس واي نقطة غير مفهومة اسعد واتشرف باﻻسهاب في شرحها حتى تصل المعلومة


احترامي وتقديري
اخوكم
شقاوي
 
بارك الله فيك بو محمد وماقصرت الغالي
 
اللهم امين واياك طال عمرك

وان شاء الله ان هذا هو المطلوب يا ابو محمد واي تعديل تحت اﻻمر يالغالي
 
تسلم ايدك مبدعنا
مودتي
 
الله يسلمك من كل شر يارب
 
يجب تسجيل الدخول أو التسجيل كي تتمكن من الرد هنا.
عودة
أعلى