How do I move the FB login button?

[=MGN=RedEagle]

Hey guys,

I would like to make a copy of the Facebook login button and paste it below the sign up button. Do you know how I would do that? Also, I would like to make another copy of the "Watch Thread" button.

Loving Xenforo and this great community!

Thanks for all the help!

 

[Paul B]

Moved from development questions.

For the Facebook login button, add this to EXTRA.css:

/* Add Facebook login button to visitor panel */
.cta_fbButton {
margin: 10px 30px;
text-align: center;
}

Edit the sidebar_visitor_template as follows:

<div class="section loginButton">
<div class="secondaryContent">
<label for="LoginControl" id="SignupButton"><a href="{xen:link login}" class="inner">{xen:phrase sign_up_now}</a></label>

<xen:if is="{$xenOptions.facebookAppId}">
<div class="cta_fbButton">
<a href="{xen:link register/facebook, '', 'reg=1'}" class="fbLogin"><span>{xen:phrase login_with_facebook}</span></a>
</div>
</xen:if>
</div>
</div>

You didn't say what it was you wanted to do with the Watch Thread link.
This is the code for it:

<xen:if is="{$canWatchThread}">
    <a href="{xen:link 'threads/watch-confirm', $thread}" class="OverlayTrigger" data-cacheOverlay="false">{xen:if $thread.thread_is_watched, '{xen:phrase unwatch_thread}', '{xen:phrase watch_thread}'}</a>
</xen:if>

 

[=MGN=RedEagle]

Oops, my bad, what I meant to say is I would like to put a FB login next to the watch thread button.

 

[Euroman]

I like to move the facebook login to.

Just under the signup now button. But I can't find the extra.css is there a step by step manual for it? For dummies?

 

[Paul B]

EXTRA.css is a default blank template for entering your own custom CSS.

Just search for the template in the ACP.

 

[ineedhelp]

Moved from development questions.

For the Facebook login button, add this to EXTRA.css:

/* Add Facebook login button to visitor panel */
.cta_fbButton {
margin: 10px 30px;
text-align: center;
}

Edit the sidebar_visitor_template as follows:

<div class="section loginButton">
<div class="secondaryContent">
<label for="LoginControl" id="SignupButton"><a href="{xen:link login}" class="inner">{xen:phrase sign_up_now}</a></label>
 
<xen:if is="{$xenOptions.facebookAppId}">
<div class="cta_fbButton">
<a href="{xen:link register/facebook, '', 'reg=1'}" class="fbLogin"><span>{xen:phrase login_with_facebook}</span></a>
</div>
</xen:if>
</div>
</div>

Ok so I've added the code into the EXTRA.css as described above.

The sidebar is actually called: sidebar_visitor_panel

I've added the code as above, which makes the template look like this:

<xen:if is="{$visitor.user_id}">
 
<div class="section visitorPanel">
    <div class="secondaryContent">
 
        <xen:avatar user="$visitor" size="m" img="true" />
     
        <div class="visitorText">
            <h2>{xen:phrase signed_in_as_x_sidebar, 'name={xen:helper username, $visitor, 'NoOverlay'}'}</h2>     
            <div class="stats">
            <xen:hook name="sidebar_visitor_panel_stats">
                <dl class="pairsJustified"><dt>{xen:phrase messages}:</dt> <dd>{xen:number $visitor.message_count}</dd></dl>
                <dl class="pairsJustified"><dt>{xen:phrase likes}:</dt> <dd>{xen:number $visitor.like_count}</dd></dl>
                <dl class="pairsJustified"><dt>{xen:phrase points}:</dt> <dd>{xen:number $visitor.trophy_points}</dd></dl>
            </div>
            </xen:hook>
        </div>
     
    </div>
</div>
 
<xen:else />
 
 
<div class="section loginButton">
<div class="secondaryContent">
<label for="LoginControl" id="SignupButton"><a href="{xen:link login}" class="inner">{xen:phrase sign_up_now}</a></label>
 
<xen:if is="{$xenOptions.facebookAppId}">
<div class="cta_fbButton">
<a href="{xen:link register/facebook, '', 'reg=1'}" class="fbLogin"><span>{xen:phrase login_with_facebook}</span></a>
</div>
</xen:if>
</div>
</div>
</xen:if>
 
<xen:include template="ad_sidebar_below_visitor_panel" />

My template also has this at the end:

</xen:if>
 
<xen:include template="ad_sidebar_below_visitor_panel" />

Do I keep it or delete it?

 

[Paul B]

Keep those two lines.

For reference, this is how a modified sidebar_visitor_panel template should look:

<xen:if is="{$visitor.user_id}">
 
<div class="section visitorPanel">
    <div class="secondaryContent">
   
        <xen:avatar user="$visitor" size="m" img="true" />
       
        <div class="visitorText">
            <h2>{xen:phrase signed_in_as_x_sidebar, 'name={xen:helper username, $visitor, 'NoOverlay'}'}</h2>       
            <div class="stats">
            <xen:hook name="sidebar_visitor_panel_stats">
                <dl class="pairsJustified"><dt>{xen:phrase messages}:</dt> <dd>{xen:number $visitor.message_count}</dd></dl>
                <dl class="pairsJustified"><dt>{xen:phrase likes}:</dt> <dd>{xen:number $visitor.like_count}</dd></dl>
                <dl class="pairsJustified"><dt>{xen:phrase points}:</dt> <dd>{xen:number $visitor.trophy_points}</dd></dl>
            </div>
            </xen:hook>
        </div>
       
    </div>
</div>
 
<xen:else />
 
<div class="section loginButton">       
    <div class="secondaryContent">
        <label for="LoginControl" id="SignupButton"><a href="{xen:link login}" class="inner">{xen:if $xenOptions.registrationSetup.enabled, {xen:phrase sign_up_now}, {xen:phrase log_in}}</a></label>
 
        <xen:if is="{$xenOptions.facebookAppId}">
            <div class="cta_fbButton">
                <a href="{xen:link register/facebook, '', 'reg=1'}" class="fbLogin"><span>{xen:phrase login_with_facebook}</span></a>
            </div>
        </xen:if>
 
    </div>
</div>
 
</xen:if>
 
<xen:include template="ad_sidebar_below_visitor_panel" />