هيلبرنت | Helpernt - [ شرح ] : طريقة اظهار الشريط الجانبي او اخفائه

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

الحمد لله والصلاة والسلام على رسول الله نبينا محمد عليه افضل الصلاة واتم التسليم

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

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

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

افتح قالب PAGE_CONTAINER وابحث عن:

كود:

<div class="p-body-main

وضع فوقه هذا الكود:

كود:

<div class="hide_sidebar">             <xf:if is="$sidebar">                 <span id="collapse-side" class="sidebar-btn {{ !is_toggled('xensidebarCollapse') ? ' is-active' : '' }}"                       data-xf-click="toggle" data-xf-init="toggle-storage" data-storage-type="cookie"                       data-target=".p-body-main--withSidebar" data-storage-key="xensidebarCollapse">                 </span>             </xf:if>         </div>

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

كود:

<div class="p-body-main {{ $sidebar ? 'p-body-main--withSidebar' : '' }} {{ $sideNav ? 'p-body-main--withSideNav' : '' }}">

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

كود:

<div class="p-body-main {{ $sidebar ? 'p-body-main--withSidebar' : '' }} {{ $sideNav ? 'p-body-main--withSideNav' : '' }}{{ !is_toggled('xensidebarCollapse') ? ' xy_default' : '' }}">

ثم قم بوضع هذا الكود في قالب extra.less مع تغيير ما يلزم حسب ذوقك واستايل موقعك:

كود:

         .sidebar-btn{     background:#fff;     padding: 1px 7px;     font-size: 16pt;     color:#4bcbdf;     border: 1px solid #d4d4d4;     border-radius: 3px;     line-height: 28px;          &:hover{             background: #4bcbdf;             color: #fff;     }// End hover sidebar-btn          &:before{         .m-faBase('Pro');            .m-faContent(@fa-var-arrow-square-left);     }// End before sidebar-btn          &.is-active:before{         .m-faBase('Pro');            .m-faContent(@fa-var-arrow-square-right);         color:#ce3451;     }// End is-active:before      } // End sidebar-btn tag  .p-body-main.p-body-main--withSidebar.is-active .p-body-content, .p-body-main.p-body-main--withSideNav.is-active .p-body-content {         width: 100%;         max-width: 100%;         padding-right: 0;     }      .p-body-main.p-body-main--withSidebar.is-active .p-body-sidebar, .p-body-main.p-body-main--withSideNav.is-active .p-body-sidebar, .p-body-main.p-body-main--withSidebar.is-active .p-body-sideNav, .p-body-main.p-body-main--withSideNav.is-active .p-body-sideNav {         width: 0;         height: 0;         opacity: 0;         overflow: hidden;         display: none;     }

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

ان اصبت فهذا من فضل الله علي وان اخطأت فجل من لايخطأ

الدرس مقدم من معهد زين العربية

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