SaveTheWest
Member
A while ago I stumbled onto this customization:
![Screenshot from 2021-09-04 19-09-14.png Screenshot from 2021-09-04 19-09-14.png](https://xenforo.com/community/data/attachments/256/256314-2df5107e85354fc3872d1757d5fab7c3.jpg?hash=LfUQfoU1T8)
Instructions for how to achieve this were given here. However, I, and other people, couldn't get this to work. One person did, but didn't elaborate on how.
I suspect the instructions are mostly correct, BUT, the indenting in the provided code was incorrect.
As I understood it, part of the following section of code within 'message_macros' of a particular theme is meant to be modified/replaced:
It seems like it was this part that needed to be replaced:
With something like this:
I tried different indenting of the above, but, it wouldn't let me save any of the changes. I presume that means that there was an error in there somewhere.
After that, they gave some code to add to extra.less, which I never tried adding, given that the above wasn't working.
Can anyone please help point out how to make this work?
![Screenshot from 2021-09-04 19-09-14.png Screenshot from 2021-09-04 19-09-14.png](https://xenforo.com/community/data/attachments/256/256314-2df5107e85354fc3872d1757d5fab7c3.jpg?hash=LfUQfoU1T8)
Instructions for how to achieve this were given here. However, I, and other people, couldn't get this to work. One person did, but didn't elaborate on how.
I suspect the instructions are mostly correct, BUT, the indenting in the provided code was incorrect.
As I understood it, part of the following section of code within 'message_macros' of a particular theme is meant to be modified/replaced:
<div class="message-avatar {{ ($xf.options.showMessageOnlineStatus && $user && $user.isOnline()) ? 'message-avatar--online' : '' }}">
<div class="message-avatar-wrapper">
<xf:avatar user="$user" size="m" defaultname="{$fallbackName}" itemprop="image" />
<xf:if is="$xf.options.showMessageOnlineStatus && $user && $user.isOnline()">
<span class="message-avatar-online" tabindex="0" data-xf-init="tooltip" data-trigger="auto" title="{{ phrase('online_now')|for_attr }}"></span>
</xf:if>
</div>
</div>
It seems like it was this part that needed to be replaced:
<xf:if is="$xf.options.showMessageOnlineStatus && $user && $user.isOnline()">
<span class="message-avatar-online" tabindex="0" data-xf-init="tooltip" data-trigger="auto" title="{{ phrase('online_now')|for_attr }}"></span>
</xf:if>
With something like this:
<xf:if is="$xf.options.showMessageOnlineStatus && $user && $user.isOnline()">
<div class="xgt-avatar2">
<div class="xgt-avatar-border2">
<xf:avatar user="$user" size="m" defaultname="{$fallbackName}" itemprop="image" />
</div>
</div>
<xf:else />
<div class="xgt-avatar">
<div class="xgt-avatar-border">
<xf:avatar user="$user" size="m" defaultname="{$fallbackName}" itemprop="image" />
</div>
</div>
</xf:if>
I tried different indenting of the above, but, it wouldn't let me save any of the changes. I presume that means that there was an error in there somewhere.
After that, they gave some code to add to extra.less, which I never tried adding, given that the above wasn't working.
Can anyone please help point out how to make this work?
Last edited: