شرح تغيير كلمة المواضيع والمشاركات بايقونات في رئيسية المنتدى

[shqawe]

بسم الله الرحمن الرحيم

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

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

اقدم لكم اليوم طريقة تغيير كلمة المواضيع والمشاركات بايقونات في رئيسية المنتدى بمعنى تحويل المنطقة المحددة باللون اﻻحمر في الصورة التالية من كلام:



الى المنقطة المحددة باللون اﻻحمر في الصورة التالية الى ايقونات:




بسم الله نبدأ الشرح:

نقوم اولا فتح قالب node_list_forum ونبحث عن هذا الكود:

<div class="node-stats">

بعدها ننزل ثلاث او اربع سطور راح نجد هذا الكود وهو كود عبارة المواضيع:

{{ phrase('threads') }}

ونقوم باستبداله بهذا الكود:

<xf:fa icon="fa-file-alt" />

ومن ثم نقوم بالبحث ايضا ً عن هذا الكود في نفس القالب وتجدونه اسفل الكود السابق بخمس او ستة سطور:

{{ phrase('messages') }}

ونستبدله بهذا الكود:

<xf:fa icon="fa-comment" />

طبعا ً اﻻكواد التي قمنا باستبدالها هي اكواد خاصة بعرض اﻻيقونات في نسخ زين فورو وكل ماعليك هو اختيار اﻻيقونة المناسبة من ايقونات Fontawesome

ووضعها مكان fa-file-alt في الكود اﻻول و fa-comment في الكود الثاني بما يناسبك

وبهذا يكون قد قمت باستبدال كلمتي المواضيع والمشاركات بايقونات كما بالصورة السابقة:

ملاحظة أخيرة اذا اردت تنسيق اﻻيقونات فبإمكانك القيام بذلك عبر هذا الكود مع تغيير ما يلزم حسب ذوقك وحسب استايلك:

.node-stats .pairs.pairs--rows > dt {
    display: block;
    font-size: 18px;
}

وفي النهاية اتمنى ان اكون قد قمت وفقت في هذا الشرح واي نقطة تحتاج الى اﻻيضاح اكثر فانا على اتم اﻻستعداد لفعل ذلك

وتقبلوا احترامي وتقديري
اخوكم
شقاوي

 

[أبوفاطمة]

بآرك الله فيك اخي شقاوي
جاري التجربه

 

[shqawe]

الله امين وفيك اخوي @أبوفاطمة وبانتظار تجربتك

و نسيت ان اذكر ان هذا الشرح اهداء مني لك انت و ﻻخوي الغالي @Binkaddas

واسأل الله ان اكون قد وفقت بالشرح ان شاء الله

 

[أبوفاطمة]

جزاك الله منا الف خير اخي شقاوي على كل ما تقوم به من شروحات مميزه ومبسطه ومفهومه وأسال الله أن يبقى لنا الموقع ويكون الاول في دعم xenforo

 

[shqawe]

اللهم امين واياك يالغالي ابو فاطمة واسأل الله ان يكتب لنا ولك طولة العمر على طاعته وان يعيننا على تقديم كل مافيه خير للمسلمين يارب.

 

[Mixarabia]

دمت مبدعا

 

[shqawe]

تسلم يالغالي

 

[أبوفاطمة]

تم التطبيق بنجاح جزاك الله خير
بس اخي شقاوي لو بضع خلفيه زي الصورة

 

[shqawe]

اللهم امين واياك اخوي ابو فاطمة

بالنسبة لسؤالك انا شارح لك الطريقة في هذا الموضوع

شرح الموضوع 'طريقة تحديد اخر مشاركة مثل استايل ترايدنت'

27 نوفمبر 2024

بسم الله الرحمن الرحيم

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

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

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



بسم الله نبدأ الشرح:


بداية نقوم بفتج قالب node_list_forum ونقوم بالبحث عن هذا الكود

<div class="node-extra">

ونضيف تحته هذا الكود

<div class="node-extra-inner">

ونبحث في نفس القالب عن هذا الكود:

<xf:else />...

• shqawe
• الردود: 16
• المنتدى: المنتدى التطويري

كل اللي عليك فقط تعدل خصائص css على كلاس pairs وتضيف له الخلفية اللي تحتاجها في نفس الكود اللي موجود في الموضوع وبالضبط الكود اللي موجود في المشاركة رقم 6 يعني هذا لكود

.node-body {
    .node-stats {
        .node-stats-inner {
            display: flex;
            justify-content: space-around;
            .pairs {
                border: 1px solid @xf-borderColor;
                border-radius: 5px;
                flex: 1;
                background: #f3f3f3;
                padding: 5px 1rem;
                border-radius: 4px;
            }
        }
    }
}

انا عدلت على الكود واضفت لك خلفية وتباعد وانحناء للحدود جرب الكود وان شاء الله يكون ضالتك

احترامي وتقديري
اخوك
شقاوي

 

[أبوفاطمة]

جزاك الله خير أخي شقاوي ماشاء الله ضبطت


تقديري وأحترامي

 

[shqawe]

اللهم امين واياك اخوي ابو فاطمة واحمد الله ان الشرح كان واضح

احترامي وتقديري
اخوك
شقاوي