شرح اضافة متواجد وغير متواجد في زاوية الصورة الرمزية للمنتديات الزين فورو الجيل الثانى

[ابومازن]

شرح اضافة متواجد وغير متواجد في زاوية الصورة الرمزية للمنتديات الزين فورو الجيل الثانى

[اسم الشرح] : شرح خاصية متواجد وغير متواجد في زاوية الصورة الرمزية للمنتديات Xenforo 2 الزين فورو الجيل الثانى
[التوافق] : متوافق مع جميع النسخ الجيل الثانى حتى تاريخ النشر XF 2.0.4

الشرح :
-ادخل الى لوحة التحكم المنتدى >>> المظهر >>>>>>>البحث فى القوالب >>>>>>اسم القالب هو message_macros ابحث بداخله عن هذا الكود

<span class="message-userArrow"></span>

اعلاه ضع الاتي

<xf:if is="$user.isOnline()">
    <div class="message-threadStarter"><span class="message-threadStarter--indicator">متصل</span></div>
<xf:else />
     <div class="message-threadStarter"><span class="message-threadStarter--indicatorOff">غير متصل</span></div>
</xf:if>

بعد ذلك نعيد عملية البحث ونبحث عن القالب EXTRA.less ثم نقوم بفتحه ووضع الكود التالى فيه

.message-threadStarter{
position:absolute;
right:70px;
top:-5px;
z-index:1;
overflow:hidden;width:75px;
height:75px;
text-align:left
}
.message-threadStarter .message-threadStarter--indicator
{
font-size:9px;
color:#fefefe;
font-weight:700;
position:absolute;
top:10px;
left:-17px;
text-transform:uppercase;
text-align:center;
line-height:20px;
width:75px;
display:block;
background:#79A70A;
background: linear-gradient(#9bc90d 0%, #79a70a 100%);
box-shadow:0 3px 10px -5px #000;
-webkit-transform:rotate(45deg);
-ms-transform:rotate(45deg);
transform:rotate(45deg)
}
.message-threadStarter .message-threadStarter--indicator:before,.message-threadStarter .message-threadStarter--indicator:after
{
content:"";
position:absolute;
top:100%;
z-index:-1;
border:3px solid;
border-top-color:#79a70a;
border-bottom-color:transparent
}
.message-threadStarter .message-threadStarter--indicator:before
{
left:0;
border-left-color:#79a70a;
border-right-color:transparent
}
.message-threadStarter .message-threadStarter--indicator:after{
right:0;
border-left-color:transparent;
border-right-color:#79a70a
}

.message-threadStarter .message-threadStarter--indicatorOff
{
font-size:10px;
color:#fefefe;
font-weight:700;
position:absolute;
top:10px;
left:-17px;
text-transform:uppercase;
text-align:center;
line-height:20px;
width:75px;
display:block;
background:#2577b1;
background:linear-gradient(#3492d5 0%, #2577b1 100%);
box-shadow:0 3px 10px -5px #000;
-webkit-transform:rotate(45deg);
-ms-transform:rotate(45deg);
transform:rotate(45deg)
}
.message-threadStarter .message-threadStarter--indicatorOff:before,.message-threadStarter .message-threadStarter--indicatorOff:after
{
content:"";
position:absolute;
top:100%;
z-index:-1;
border:3px solid;border-top-color:#2577b1;
border-bottom-color:transparent
}
.message-threadStarter .message-threadStarter--indicatorOff:before
{
left:0;
border-left-color:#2577b1;
border-right-color:transparent
}
.message-threadStarter .message-threadStarter--indicatorOff:after{
right:0;
border-left-color:transparent;
border-right-color:#2577b1
}


.message-avatar-wrapper .message-avatar-online {
    border: 0;

}

@media (max-width: @xf-responsiveNarrow)
{
        .message-threadStarter
     {
    display: none;
        }
    }

 

[الوردانى]

بارك الله فيك

 

[aboemad]

بارك الله فيك و سلمت يداك أخي الكريم
شكرا لك​

 

[عبدالله المنشاوى]

بارك الله فيك أخي
زادك الله من فضله ​

 

[۩◄عبد العزيز شلبى►۩]

بارك الله فيك

 

[ايمن مغازى]

بارك الله فيك

 

[nadjm]

بارك الله فيك اخي على الموضوع