shqawe
ربي أشرح لي صدري
بسم الله الرحمن الرحيم
الحمد لله والصلاة والسلام على رسول الله نبينا محمد عليه افضل الصلاة واتم التسليم
اللهم لا علم لنا إلا ما علمتنا، إنك أنت العليم الحكيم، اللهم علمنا ما ينفعنا، وانفعنا بما علمتنا، وزدنا علما،
اقدم لكم اليوم شرح طريقة اظهار معلومات العضو مثل ماهو موجود في استايل زين العربية في المتجر على الرابط التالي
xenarabia.com
بسم الله نبدأ الشرح:
اولا قم بفتح قالب
وضع فوقه هذا الكود :
ثم ابحث في نفس القالب عن هذا الكود :
وضع فوقه هذا الكود:
احفظ القالب وقم بفتح قالب
احفظ القالب ومن ثم قم باضافة الكود التالي في ملف
وقم بحفظ القالب والتجربة وان شاء الله سوف تحصل على الشكل المطلوب
ان اصبت فهذا من فضل الله علي وان اخطأت فجل من لايخطأ
وتقبلوا احترامي وتقديري
اخوكم
شقاوي
الحمد لله والصلاة والسلام على رسول الله نبينا محمد عليه افضل الصلاة واتم التسليم
اللهم لا علم لنا إلا ما علمتنا، إنك أنت العليم الحكيم، اللهم علمنا ما ينفعنا، وانفعنا بما علمتنا، وزدنا علما،
اقدم لكم اليوم شرح طريقة اظهار معلومات العضو مثل ماهو موجود في استايل زين العربية في المتجر على الرابط التالي
استايل عام على زين العربية 2020 الإصدار الأول للجيل الثاني من XenForo
استايل علم على زين العربية 2020 الإصدار الأول للجيل الثاني من XenForo
xenarabia.com
بسم الله نبدأ الشرح:
اولا قم بفتح قالب
message_macros وابحث عن:
HTML:
<div class="message-userExtras">وضع فوقه هذا الكود :
كود:
<div class="thThreads__message-userExtras">ثم ابحث في نفس القالب عن هذا الكود :
HTML:
</xf:if>
</xf:if>
<span class="message-userArrow"></span>
</section>وضع فوقه هذا الكود:
HTML:
</div>
<div class="thThreads__userExtra--toggle">
<span class="thThreads__userExtra--trigger" data-xf-click="ththreads-userextra-trigger"></span>
</div>احفظ القالب وقم بفتح قالب
helper_js_global وقم باضافة الكود التالي في اخر القالب فوق كلمة </xf:macro>
JavaScript:
<xf:js>
$(document).ready(function() {
XF.thThreadsUserExtraTrigger = XF.Click.newHandler({
eventNameSpace: 'XFthThreadsUserExtraTrigger',
init: function(e) {},
click: function(e)
{
var parent = this.$target.parents('.message-cell--user');
var triggerContainer = this.$target.parent('.thThreads__userExtra--toggle');
var container = triggerContainer.siblings('.thThreads__message-userExtras');
var child = container.find('.message-userExtras');
var eleHeight = child.height();
if (parent.hasClass('userExtra--expand')) {
container.css({ height: eleHeight });
parent.toggleClass('userExtra--expand');
window.setTimeout(function() {
container.css({ height: '0' });
window.setTimeout(function() {
container.css({ height: '' });
}, 200);
}, 17);
} else {
container.css({ height: eleHeight });
window.setTimeout(function() {
parent.toggleClass('userExtra--expand');
container.css({ height: '' });
}, 200);
}
}
});
XF.Click.register('ththreads-userextra-trigger', 'XF.thThreadsUserExtraTrigger');
});
</xf:js>احفظ القالب ومن ثم قم باضافة الكود التالي في ملف
extra.less
CSS:
.thThreads__userExtra--toggle {
text-align: center;
margin-top: @xf-paddingMedium;
.thThreads__userExtra--trigger {
transition: ease-in transform .2s .2s;
display: inline-block;
&:hover {cursor: pointer;}
&:before {
.m-faBase();
.m-faContent(@fa-var-chevron-down);
}
}
}
.thThreads__message-userExtras {
height: 0;
overflow: hidden;
transition: ease-in height .2s;
}
@media (max-width: @xf-messageSingleColumnWidth) {
.thThreads__message-userExtras {display: none;}
.thThreads__userExtra--toggle {display: none;}
}
.userExtra--expand {
.thThreads__message-userExtras {height: auto;}
.thThreads__userExtra--trigger {transform: rotate(-180deg);}
}وقم بحفظ القالب والتجربة وان شاء الله سوف تحصل على الشكل المطلوب
ان اصبت فهذا من فضل الله علي وان اخطأت فجل من لايخطأ
وتقبلوا احترامي وتقديري
اخوكم
شقاوي
