XF 2.1 How to move the style selector from footer to top of the page?

[gogo]

It's more convenient for it to be placed next to the login/user icon.

 

[Lukas W.]

The style selector trigger is located in the PAGE_CONTAINER template. On the default style, it's the block from line 538 to 543:

<xf:if is="$xf.visitor.canChangeStyle()">
    <li><a href="{{ link('misc/style') }}" data-xf-click="overlay"
        data-xf-init="tooltip" title="{{ phrase('style_chooser')|for_attr }}" rel="nofollow">
        <xf:fa icon="fa-paint-brush" /> {$xf.style.title}
    </a></li>
</xf:if>

You can basically just move that wherever it's convenient to you, plusminus some style adjustments you'll need to make based on how you want it to display. If you want a more generic button that you can just throw anywhere, try this:

<xf:if is="$xf.visitor.canChangeStyle()">
    <xf:button href="{{ link('misc/style') }}" data-xf-click="overlay"
        data-xf-init="tooltip" title="{{ phrase('style_chooser')|for_attr }}" rel="nofollow">
        <xf:fa icon="fa-paint-brush" /> {$xf.style.title}
    </xf:button>
</xf:if>

 

[gogo]

Thanks! I tried to simplified the block and moved it to the top of the page.

I got this:



Why is there such a white spot?

This is the code:




How do I get ride of it?

And it's not vertically aligned.. Also, is this simple code safe enough?

Thanks!

 

[Brad Padgett]

Hey @gogo you may like my free add-on. It's a style chooser you can set up in several positions. Header, footer, or in the sub-navigation. It also has a nifty light switch for alternating light and dark styles. It hasn't been updated in a while but works fine with 2.1. It adds little colored boxes of the color of the style you setup to alternate styles.

If you have any issues reach out to me and I will help.

Unmaintained - [BP] Light Switch and Style Chooser

This add-on only supports Xenforo 2.1.x and does not support 2.0.x because of Font Awesome 5 This is another free add-on I've decided to contribute to the community. It's a Light Switch and a Style Chooser based on style ids. Simply put the...

xenforo.com