XF 1.2 Best way to create and share a style without avatars?

I'm in the middle of creating a style without avatars to be used for my board (it's a serious effort for an 8M post big board), and I'm looking for advice on what would be the best way to make it clean and sharable.

It turns out that getting rid of avatars is mostly repetitive but easy template editing, and some minor CSS changes to get rid of "margin-left" padding.

However I do have questions on the following issues:

1. What's the best way to replace the lists of avatars and nothing else for stuff like followers and online staff?

Right now I just copied the sidebar code that lists all online users as text links, but it's not perfect. For example in the code that displays avatars of all followed users online, I replaced it as follows:

            <xen:foreach loop="$onlineUsers.records" value="$user">
               <xen:if is="{$user.followed}">
<!-- OLD
                 <li title="{$user.username}" class="Tooltip"><xen:avatar user="$user" size="s" img="true" class="_plainImage" /></li>
<!-- NEW BEGIN-->
                 <a href="{xen:link members, $user}"
                 class="username{xen:if '!{$user.visible}', ' invisible'}">{$user.username}</a>,
<!-- NEW END END -->
One glitch is that there's an extra comment at the end of this list. I'm a programmer who doesn't know much PHP, especially with these "xen" statements, so is there a quick way to find how many users are in $onlineUsers.records so that I can suppress the comma at the end of the list?

2. Is it possible to disable avatars by global variable, such as one linked to a checkbox in the style properties? I have no previous experience with XenForo styles. The problem I see is that there are a lot of "margin-left" values in the CSS that need to be changed, and I don't have a clue about how to make conditionals in CSS.

3. Would it be possible/useful to allow avatars to be disabled as part of responsive design, to save bandwidth on mobile devices? I've had user feedback that XenForo is much more painful for some mobile users than VB 3.8.

4. What's the best way to share my code here? Upload the style as a free resource?

Should I try to implement it using the template replacement system so that it could be applied to different styles? I've never used that.

Thanks for any help!


Well-known member
You can use {xen:helper dump, $onlineUsers.records} to dump out the contents. If you want just a simple number, you can set the count to a variable in the xen:foreach tag using count="$variable" then printing the variable out within the foreach.

2. This isn't possible without editing templates or an add-on.

3. Responsive design doesn't save bandwidth, it just reformats it. Have you enabled responsive design? I find it much easier to browse the site.

4. You can share it however you wish. Its really up to you.

You may want to watch my resource here, I'm documenting the full suite of xen:tags in the system:

And, the xen:foreach, documentation can be found here:
It turns out I can use the $count variable from xen:foreach to know when I'm at the last member in a list and I shouldn't put a comma after their name.

The only place this doesn't work is "Members you follow" in sidebar_online_users. I can use code like this to change the list of avatars into a list of names:

            <xen:foreach loop="$onlineUsers.records" value="$user" i="$i" count="$count">
               <xen:if is="{$user.followed}">
                 <a href="{xen:link members, $user}"
                 class="username{xen:if '!{$user.visible}', ' invisible'}{xen:if {$user.followed}, ' followed'}">{$user.username}</a><xen:if is="{$i} < {$count}">,</xen:if>
However, there's still a comma after the name of the last followed user, because they are typically not the last entry in the array of all online users.

It looks to me like a php change would be necessary to do provide any special styling for the name of the last user who is both followed and online...


Well-known member
The comma appears because the list of followers is a subset of the members online, so if per chance, the last follower is the last account in the online list, the comma won't display. You can use xen:set to set a scalar value of true after you've set a follower and move your comma placement to before the follower list using your new variable.
Last edited: