XF 2.2 How can I add another icon to the visitors tab?

[Chernabog]

Hi all! I was wondering, and sorry if this is posted elsewhere and I've not seen it yet, but I'd like to add another icon to my visitors tabs -- ideally before messages and alerts that I can link to a URL.

Not sure where or how I'd do that, can anyone provide some insight, please?? Thank you much!

Jason

 

[Mr Lucky]

I can tell you what I did to add an icon before the Search.

In page_container template find

<xf:if is="$xf.visitor.canSearch()">

And before that I added

<div class="p-navgroup palette">
        <a href="{{ link('misc/style') }}" data-xf-click="overlay" data-xf-init="tooltip" title="{{ phrase('style_chooser')|for_attr }}" rel="nofollow">
              <xf:fa style="color:white" icon="fas fa-palette" />
        </a>
       </div>

In extra.less I styled the palette icon:

.palette
{
    padding:2px 6px;
    opacity:0.8
}

I think I removed the top padding from mobile (I can’t remember exactly as I now don’t have the extra icon showing on mobile size)

 

[Chernabog]

I can tell you what I did to add an icon before the Search.

In page_container template find

<xf:if is="$xf.visitor.canSearch()">

And before that I added

<div class="p-navgroup palette">
        <a href="{{ link('misc/style') }}" data-xf-click="overlay" data-xf-init="tooltip" title="{{ phrase('style_chooser')|for_attr }}" rel="nofollow">
              <xf:fa style="color:white" icon="fas fa-palette" />
        </a>
       </div>

In extra.less I styled the palette icon:

.palette
{
    padding:2px 6px;
    opacity:0.8
}

I think I removed the top padding from mobile (I can’t remember exactly as I now don’t have the extra icon showing on mobile size)

Thanks for that! Do you know of any way to add an icon before all the other icons are displayed? Like before the message icon, perhaps?

 

[Chernabog]

Just bumping in the event that someone knows a solid way to get a new icon to appear before the messages icon in the visitors bar -- want to put a 'homepage' icon there.

Thanks!

 

[Chernabog]

@Jeremy P I apologize for pulling you into this thread, but I was hoping maybe you could give some insight, please?

Appreciate you and the team!

 

[Jeremy P]

Just pop this before the direct message link in PAGE_CONTAINER:

<a href="{{ link('some-link')}}" class="p-navgroup-link"
    title="Some label"
    aria-label="Some label">

    <xf:fa icon="fa-alien" />
</a>