Staff Online In Columns (With Overlay) On xenForo

Staff Online In Columns (With Overlay) On xenForo. Here I will discuss how to create an online staff forum on design xenforo, for that you please follow the tutorial which I will share below and note how carefully.

Preview :

Open Sidebar.css

Add this:

Code:

.sidebar .avatarListInline li
{
overflow: hidden; zoom: 1;
float:left;
margin: 5px 0 0 0;
width:25%;
}

Next open sidebar_online_users

Replace:

Code:

<xen:if hascontent="true">
<!-- block: sidebar_online_staff -->
<div class="section staffOnline avatarList">
<div class="secondaryContent">
<h3>{xen:phrase staff_online_now}</h3>
<ul>
<xen:contentcheck>
<xen:foreach loop="$onlineUsers.records" value="$user">
<xen:if is="{$user.is_moderator} OR {$user.is_admin}">
<li>
<xen:avatar user="$user" size="s" img="true" />
<xen:username user="$user" rich="true" />
<div class="userTitle">{xen:helper userTitle, $user}</div>
</li>
</xen:if>
</xen:foreach>
</xen:contentcheck>
</ul>
</div>
</div>
<!-- end block: sidebar_online_staff -->
</xen:if>

With:

Code:

<xen:if hascontent="true">
 <!-- block: sidebar_online_staff -->
 <div class="section staffOnline avatarListInline">
 <div class="secondaryContent">
 <h3>{xen:phrase staff_online_now}</h3>
 <ul>
 <xen:contentcheck>
 <xen:foreach loop="$onlineUsers.records" value="$user">
 <xen:if is="{$user.is_moderator} OR {$user.is_admin}">
 <li>
 <xen:avatar user="$user" size="s" text="{$user.username} ({xen:helper userTitle, $user})" class="Tooltip" title="{$user.username}, {xen:helper userTitle, $user}" />
 </li>
 </xen:if>
 </xen:foreach>
 </xen:contentcheck>
 </ul>
 <div style="clear:both;"></div>
 </div>
 </div>
 <!-- end block: sidebar_online_staff -->
</xen:if>

It is easy to Staff Online In Columns (With Overlay) On xenForo, good luck!

Title: Staff Online In Columns (With Overlay) On xenForo
Posted by:Stuard Van
Published :2013-08-16T10:00:00-07:00
Rating: 5
Reviewer: 5 Reviews
Staff Online In Columns (With Overlay) On xenForo

Share :

Related articles: