» » » » Avatarda Online Üyeyi Gösterme

Avatarda Online Üyeyi Gösterme

memo_qx
memo_qx 1-09-2017, 13:53
bu sitedeki gibi yorumlarda avatarda online olup olmağını nasıl yapıyoruz birde aynı avatarda sag üstüne bay bayan oldugunu nasıl gösterebiliriz kucuk ikonlar seklınde yardımcı olurmusunuz.
Çözüldü İşleme Alındı Çözülemedi
Bilgilendirme
Yorum Ekleyebilmeniz için Sitemize Kayıt Olmanız Gerekmektedir.
0
memo_qx 5 Eylül 2017 23:18
teşekkürler işime yaradı ellerin dert görmesin
0
Reborn 3 Eylül 2017 18:14
Kendi sitemden örnek vereyim. Epey uğraşmıştım kendim için ve sonunda yapmıştım. Online üyeler yeşilimsi halka ile offline olanlar gri halka ile gösterilebiliyor tıpkı bu sitedeki gibi.

Userinfo.tpl Aç ve aşşağıdaki gibi benzer düzenlemeleri yap. Dikkat ettiysen CSS'deki "AVATAR" class'ından alıyor görünümü, ve online ofline özelliğinide aynı isimdeki taglardan alıyor yeterki doğru yerleştirilsin.
<div class="userinfo_top">
		<div class="avatar">
			<a href="#"><span class="cover" style="background-image: url({foto});">{usertitle}</span></a>
		</div>
		<h1 class="title h2">Profil: {usertitle}</h1>
		<div class="userinfo_status">[online]<span style="color: #70bb39;">Online</span>[/online][offline]Offline	
1;/offline]</div> <ul class="user_tab"> <li class="active"><a href="#user1" data-toggle="tab">Detaylar</a></li>[not-logged]&l
t;li><a href="#user2" data-toggle="tab">Profilimi Düzenle</a></li>[/not-logged][not-group=5]<li>
;{pm}</li>[/not-group] </ul> </div>



Sytles.css Kodları, yukarıda bahsettiğim avatar class'ının kodlarıda böyle.

.avatar { display: inline-block; }
.avatar .cover { width: 100px; height: 100px; border-radius: 50%; white-space: nowrap; text-indent: -9999px; display: inline-block; }

.com_info { border: rgba(196, 190, 190, 0.778); height: 12px; border-radius: 0px; margin-bottom: 2.3em; background: ; position: relative; }
.com_info:after { clear: both; display: block; content: ""; }
.com_info .avatar .cover { width: 55px; height: 55px; border: 5px solid #B0B0B0; margin: 0 0 0 -25px; }
.com_info .avatar { float: left; margin: -6px 15px 0 -6px; }
.com_info .avatar .offline .cover { width: 55px; height: 55px; border: 5px solid #B0B0B0; margin: 0 0 0 -25px; }
.com_info .avatar .online .cover { width: 55px; height: 55px; border: 5px solid #1FED33; margin: 0 0 0 -25px; }


Örnek için imzamdaki siteyi ziyaret edebilirsin.
deneme bonusu veren siteler