• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.4 Problem with social buttons

imthebest

Formerly Super120
#1
Hi,

On the template share_page I have moved the <xen:if is="{$xenOptions.facebookLike}"> block to the top so it becomes the first button available:

fb1.png

But now still on share_page I replaced:

<div class="fb-like" data-href="{$url}" data-width="400" data-layout="standard" data-action="{$xenOptions.facebookLikeAction}" data-show-faces="true" data-colorscheme="@fbColorScheme"></div>

With:

<div class="fb-share-button" data-href="{$url}" data-width="400" data-layout="button_count" data-action="{$xenOptions.facebookLikeAction}" data-show-faces="true" data-colorscheme="@fbColorScheme"></div>

And this is the end result:

fb2.png

The question is: how I can set an spacer between the Facebook and Twitter buttons just like the one present between the Twitter and Google buttons?

Thanks,
Super120
 

kaieivindm

Active member
#3
Hi,

On the template share_page I have moved the <xen:if is="{$xenOptions.facebookLike}"> block to the top so it becomes the first button available:

View attachment 103442

But now still on share_page I replaced:

<div class="fb-like" data-href="{$url}" data-width="400" data-layout="standard" data-action="{$xenOptions.facebookLikeAction}" data-show-faces="true" data-colorscheme="@fbColorScheme"></div>

With:

<div class="fb-share-button" data-href="{$url}" data-width="400" data-layout="button_count" data-action="{$xenOptions.facebookLikeAction}" data-show-faces="true" data-colorscheme="@fbColorScheme"></div>

And this is the end result:

View attachment 103443

The question is: how I can set an spacer between the Facebook and Twitter buttons just like the one present between the Twitter and Google buttons?

Thanks,
Super120
Think you could share your share_page template?
I can't get this to work at all.

Thanks!
 

kaieivindm

Active member
#4
Think you could share your share_page template?
I can't get this to work at all.

Thanks!
Nevermind. I fixed it my self for once! Yay!

Anyway, in XF 1.4 the code above is not the same.

So here is what my code looks like (Just to remove facebook recommend, and in with facebook share:
This is for share_page templates

<xen:if is="{$xenOptions.facebookLike}">
<div class="facebookLike shareControl">
<xen:container var="$facebookSdk">1</xen:container>
<fb:share-button href="{$url}" width="400" data-action="{$xenOptions.facebookLikeAction}" font="trebuchet ms" colorscheme="@fbColorScheme" data-layout="button_count" share="true"></fb:like>
</div>
</xen:if>

upload_2015-4-13_22-45-15.png

upload_2015-4-13_22-46-16.png

Just FYI: Del = Share in Norwegian.

& sidebare_share_page

<xen:if is="{$xenOptions.facebookLike}">
<div class="facebookLike shareControl">
<xen:container var="$facebookSdk">1</xen:container>
<fb:share-button href="{$url}" width="400" data-action="{$xenOptions.facebookLikeAction}" font="trebuchet ms" colorscheme="@fbColorScheme" data-layout="button_count" share="true"></fb:like>
</div>
</xen:if>
 
#6
kaieivindm, thanks for the update. it works great for me. Do you know how to change picture that load as default (XenForo) to something more relevant to the website?
It looks like it is pulling image from somewhere else. Facebook usually get image from post etc..

Do you have any suggestion? I am new to XF...

Thanks in advance. Charles