Facebook Share Button

[laura66a]

Hello.

I am looking for a way to add a Facebook Share button to my articles that picks up the thread link, our logo image, and a properly formatted summary. So far I have no success in finding a way to do this in individual publications.

I have a Tweet button that works great that I can insert into individual articles without the need for any template modifications.

Has anyone come up with a way to add a Facebook Share button without template modifications?

Thanks

[darnoldy]

Has anyone come up with a way to add a Facebook Share button without template modifications?There is no way to add anything to a page without modifying a template (even if there is an installer that does it for you, the template is still modified.) Why do you not want to modify a template?

[laura66a]

That's not true.

I have a Javascript Tweet button that works just fine and I can call Google maps from another Javascript - both directly from individual articles without template modifications.

The Javascript Tween button looks like this:

<a href="https://twitter.com/share" class="twitter-share-button" data-via="connectedcom" data-size="large">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementB yId(id)){js=d.createElement(s) ;js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}} (document, 'script', 'twitter-wjs');</script>

A template modification affects every future article and I want more flexibility.

[darnoldy]

I have a Javascript Tweet button that works just fine and I can call Google maps from another Javascript - both directly from individual articles without template modifications.So, you have enabled HTML in posts, and are manually pasting that code into the body of those messages that you want to have the button?

This is an unusual methodology.

Its been a while since I looked, but there is (or was) similar code that you could get from Facebook's site (https://developers.facebook.com/docs/plugins/like-button/) to put a like button on a web page—have you tried it and had it not work?

[laura66a]

All of my publications are HTML.

I don't exactly manually paste. All of the publications are based on HTML templates created for the specific content. All I had to do was add the Javascript Tweet one time to each of the master templates.

The Javascript code I got for for the Facbook button works to a point. I can't include my own logo graphic, I can't change the format to include a summary, and it doesn't work when viewed with Internet Explorer. This is the Javascript code I have for Facebook:

<script>function fbs_click() {u=location.href;t=document.title;window.open ('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t), 'sharer','toolbar=0,status=0,width=6 26,height=436');return false;}</script><a href="http://www.facebook.com/share.php?u=<url>" onclick="return fbs_click()" target="_blank"> <img src= "/pictures/fb-share.jpg"></a>

I need to figure out how to add the image and summary specifications.

[darnoldy]

I need to figure out how to add the image and summary specifications.Maybe somebody will come along who has more experience with this....but I think you need to set up "og codes" (which are a special form of meta tag) to tell facebook where to find those things.

[Simon Lloyd]

So something like (inside body tag)<div id="fb-root"></div>

<script>
(function(d, s, id) {

var js, fjs = d.getElementsByTagName(s)[0];

if (d.getElementById(id)) return;

js = d.createElement(s);
js.id = id;

js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.0";

fjs.parentNode.insertBefore(js, fjs);

}
(document, 'script', 'facebook-jssdk'));
</script>Below goes Where you want the button to appear<div class="fb-share-button" data-href="/showthread.php?$session[sessionurl]t=$thread[threadid]" data-width="The pixel width of the plugin" data-type="button"></div>you can change the url...etc in the above.

[laura66a]

This is right from Facebook's documentation. It doesn't work.

[Simon Lloyd]

Works perfect, it all depends on whether you are using it correct, go to this thread http://www.thecodecage.com/forumz/showthread.php?p=1055010875#post1055010875 and at the very last post, left hand side above the reply button you'll see the share button i have just added using the above code, click it and you'll see it works!

[laura66a]

The Facebook Share is above the reply button. It is not inside the associated article which is what I want. Since you have html off the only way to do this is with a template modification.

I want to be able to position the share button next to the Tweet button in a publication like this:

http://connectedcommunities.us/showthread.php?t=61647

I am close to getting it right. The button in this publication works, but not the way I want. It is missing the logo graphic and summary I want:

http://connectedcommunities.us/showthread.php?t=61646

[darnoldy]

maybe this article (http://swarminglabs.com/facebook-open-graph-meta-tags/) will help.

[laura66a]

Ok.

I've tried this about a zillion different ways and nothing works.

Open Graph Properties don't help at all.

The Facebook Share command line: <a href="http://www.facebook.com/sharer.php... [there is more to this] works and it does post to Facebook. It is picking up the thread URL just fine but I cannot specify a specific image or summary on the command line. The image being picked up is a small portion of the vBulletin header graphic and the summary is a repeat of the thread title.

I must not have the syntax right.

Can anyone come up with a command line syntax that works on their site and specifies a specific image and summary?

Thanks.