Russ

Pixel Exit Staff
Yep!

Just load an HTML widget with this as the content:

Code:
<xf:include template="xb_sidebar_login" />
Make sure to check the "advanced" option at the bottom of the widget setup to avoid a double container.
 

Blatchy

Customer
Yep!

Just load an HTML widget with this as the content:

Code:
<xf:include template="xb_sidebar_login" />
Make sure to check the "advanced" option at the bottom of the widget setup to avoid a double container.
You da man. Thank you.
 

Blatchy

Customer
Anyone looking to use this.. use a html widget then use as your template

Code:
<xf:if is="!$xf.visitor.user_id"><xf:include template="xb_sidebar_login" /></xf:if>
 

Blatchy

Customer
Can I make the two login/register buttons on the same line?

At least to me, it looks kind of funny the way it currently is.

9449
 

Russ

Pixel Exit Staff
Probably going to actually change this in an update to them being next to each other.

For now, open xb_sidebar_login.

Find:
Code:
                    <xf:submitrow icon="login" />
                  
                <xf:if is="$xf.options.registrationSetup.enabled">
                    <div class="block-outer block-outer--after block-outer--register">
                        <div class="block-outer-middle">
                            {{ phrase('dont_have_account_question') }} <xf:button href="{{ link('register') }}">{{ phrase('register_now') }}</xf:button>
                        </div>
                    </div>
                </xf:if>
Replace with:
Code:
                    <div class="login-buttons">
                        <xf:button type="submit" class="button--primary button button--icon button--icon--login"><span class="button-text">{{ phrase('log_in') }}</span></xf:button>
                        <xf:button href="{{ link('register') }}" class="register-button button--icon button--icon--user">{{ phrase('register_now') }}</xf:button>
                    </div>
Then add this in your extra.less:

Code:
.login-buttons
{
    display: flex;
    margin-top: 10px;
    > *
    {
        display: block;
        flex-grow: 1;
        margin: 0 5px;
    }
}
 
Last edited:

Blatchy

Customer
Probably going to actually change this in an update to them being next to each other.

For now, open xb_sidebar_login.

Find:
Code:
                    <xf:submitrow icon="login" />
                 
                <xf:if is="$xf.options.registrationSetup.enabled">
                    <div class="block-outer block-outer--after block-outer--register">
                        <div class="block-outer-middle">
                            {{ phrase('dont_have_account_question') }} <xf:button href="{{ link('register') }}">{{ phrase('register_now') }}</xf:button>
                        </div>
                    </div>
                </xf:if>
Replace with:
Code:
                    <div class="login-buttons">
                        <xf:button type="submit" class="button--primary button button--icon button--icon--login"><span class="button-text">{{ phrase('log_in') }}</span></xf:button>
                        <xf:button href="{{ link('register') }}" class="register-button">{{ phrase('register_now') }}</xf:button>
                    </div>
Then add this in your extra.less:

Code:
.login-buttons
{
    display: flex;
    margin-top: 10px;
    > *
    {
        display: block;
        flex-grow: 1;
        margin: 0 5px;
    }
}
Yeah man, that looks (at least to me) so much better.

Reason number 1012 why you would be foolish not to be using Pixelexit designs.

EDIT.. I know this is trivial but, there is a icon next to the login button, Shouldnt there be one next to the register button as well?
 

Russ

Pixel Exit Staff
I've edited my post, specifically added classes:

Code:
button--icon button--icon--user
next to register-button
 

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.