درس XF-2.x اضافة زر اظهار واخفاء بيانات العضو Xenforo 2.x

[Ibn AliraQ]

إصدار الزين فورو

XenForo 2.x

السلام عليكم ورحمة الله وبركاته​

عنوان الدرس : اضافة زر اسفل الصورة الرمزية للعضو.​

الغاية من الدرس : اظهار واخفاء بينات العضو في قالب المشاركات والمواضيع.​

الشرح:​

1. ابحث عن القالب : ​

post_macros

داخل هذا القالب ابحث عن : ​

<xf:macro template="message_macros" name="user_info" arg-user="{$post.User}" arg-fallbackName="{$post.username}" arg-dateHtml="{$dateHtml}" arg-linkHtml="{$linkHtml}" />

اسفل هذا الكود اضف : ​

<span id="collapse-{$post.post_id}" class="collapseTrigger collapseTrigger--block" data-xf-click="toggle" data-target="#js-post-{$post.post_id} .message-userExtras"></span>

حفظ القالب.​

2. ابحث عن القالب : ​

message_macros

داخل القالب ابحث عن :​

<div class="message-userExtras">

استبدل هذا الكود بالكود التالي : ​

<div class="message-userExtras message-userExtras-body message-userExtras--collapsible">

حفظ القالب.​

3. ابحث عن القالب : ​

extra.less

اسفل القالب قم باضافة الكود التالي:​

/* User Extras Collapse */
.message-userExtras-body
{
    .m-listPlain();

    &.message-userExtras--collapsible
    {
        .has-no-js & { display: block; }

        .m-transitionFadeDown();
    }
}

.message-cell
{
    .collapseTrigger
    {
        text-align: center;

        &.is-active:before
        {
            transform: rotate(-180deg);
        }
        &:before
        {
            content: "\f13a";
            color: @xf-linkColor;
            transition: ease-in transform .3s;
            width: auto;
        }
        &.collapseTrigger--block:before
        {
            float: none;
        }
    }
}
@media (max-width: @xf-responsiveNarrow)
{
    .message-cell
    {
        .collapseTrigger
        {
            display: none;
        }
    }
}

احفظ القالب.​

إنتهى الشرح.​

القالب قبل وبعد التعديل :​

​

 

شرح عام XF  اظهار وصف الاقسام في الهاتف Xenforo

شرح عام XF  وضع علامة قبل عنوان موضوع معين