Topic-icon Custom EasyTag share buttons

Active Subscriptions:

None
10 years 11 months ago #53910 by alidan
Hi there,
I am trying to add Facebook Share, Twitter Share and Pinterest Share easytags to my custom design within com_content article view (template override)

How can i add my custom buttons layout ? How can i customize the output of these easy-tags ? Any other way to achieve what i want ?

Thanks in advance !
The topic has been locked.
Support Specialist
10 years 11 months ago #53917 by alzander
Most social share buttons don't allow for completely customizing the output. The social networks want you to use a familiar button that each of your users will recognize. Allowing fully custom buttons introduces ways to game the system by causing "Likes" when a user clicks something else.

With that said, if you can let us know specifically what you're trying, we'll gladly help. The social button easy-tag descriptions give a good overview of the settings we support. If you want to test using the Facebook configuration tool to see the options they support though, you can test below:
developers.facebook.com/docs/plugins/like-button

I hope that helps get you started, but if there's anything else you think we can help with, just let us know.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 11 months ago #53922 by alidan
Replied by alidan on topic Custom EasyTag share buttons
Thanks for the reply.
Basically the output i want to achieve for the share buttons is shown below

Facebook Share
<a href="javascript:void(0)" class="btn btn-facebook btn-lg mb5" data-original-title="Share on Facebook" data-toggle="tooltip" data-placement="top"><i class="ico-facebook22"></i></a>

Twitter Share
<a href="javascript:void(0)" class="btn btn-twitter btn-lg mb5" data-original-title="Share on Twitter" data-toggle="tooltip" data-placement="top"><i class="ico-twitter22"></i></a>

Pinterest Share
<a href="javascript:void(0)" class="btn btn-danger btn-lg mb5" data-original-title="Share on Pinterest" data-toggle="tooltip" data-placement="top"><i class="ico-pinterest22"></i></a>

Those are just some bootstrap buttons customized to match my desired layout. Thanks !
The topic has been locked.
Support Specialist
10 years 11 months ago #53956 by alzander
As noted above, many networks don't allow a custom share button to be used. They want their branding to always be visible so that the user always knows what they are clicking without any confusion.

Facebook does have a way to use a custom button, which we support. It's a little difficult though as you need to specify all the information for each share button you create, which can be tricky to do on multiple pages. To implement, you'd change your Facebook code from above to:
<a href="javascript:jfbc.social.feedPost('Title for share', 'Caption for the share', 'Description for the share', 'http://yoursite.com/link-to-page', 'http://yoursite.com/link-to-image.jpg')" class="btn btn-facebook btn-lg mb5" data-original-title="Share on Facebook" data-toggle="tooltip" data-placement="top"><i class="ico-facebook22"></i></a>
Each of those fields must be filled out or else it will not work.

We don't have any support for a custom image using Twitter or Pinterest and, to my knowledge, it's not easily possible.

I hope that helps. In general, we recommend using the standard, branded Facebook, Twitter and Pinterest buttons. They are what each social network recommends and what your users are familiar with interacting with, which usually helps engagement.

Thanks,
Alex
The topic has been locked.