آموزش هک نمایش وضعیت در ویجت

سلام دوستان
شما با استفاده از این آموزش میتونین وضعیت هک رو در قسمت نوار کناری ایجاد کنین.
برای انجام اینکار ابتدا به پنل مدیریت» شکل و ظاهر» ویجت ها» برین و روی اضافه کردن ویجت کلیک کنین.
حالا نوع ویجت رو روی HTML قرار بدین و اضافه کردن ویجت رو بزنین.



مواردی که در تصویر پایین مشاهده میکنین را به ترتیب وارد کنین.
Widget key: hackstatus
عنوان: Hack Status (یا عنوان دلخواه خود)
موقعیت: لیست انجمن ها: ساید بار



و بعد کد زیر رو در Template قرار داده و ذخیره بزنین



در اخر کد زیر رو به قالب extra.less اضافه کنین

.hackStatus {
    color: rgba(255,255,255,0.8);
    border-radius: 2px;
    display: inline-block;
    position: relative;
    padding: 10px 6px 8px 32px;
    margin-bottom: 4px;
    cursor: pointer;
    font-weight: normal;
    list-style: none;
    font-size: 12px;
    width: 100%;
    a {
        color: #FFF;
    }
    &:before {
        background-color: rgba(0,0,0,0.2);
        position: absolute;
        border-right: 2px solid rgba(0,0,0,0.1);
        top: 0;
        bottom: 0;
        left: 0;
        padding: 6px 1px 0 5px;
        width: 20px;
        .m-faBase();
        text-align: center;
        font-size: 17px;
    }
}
.HackLoader {
    background-color: #2196F3;
    &:before {
        content: "\f12a";
    }
}
.hackUpdate {
    background-color: #ef8216;
    &:before {
        content: "\f021";
    }
}
.hackRun {
    background-color: #259845;
    &:before {
        content: "\f00c";
    }
}
.hackNotrun {
    background-color: #e30a17;
    &:before {
        content: "\f00d";
    }
}

خروجی نهایی: