2012-11-04 17 views
9

Shareボタンを実装する方法を正確に実装する方法を理解しようとしていますhere。私は、ユーザーがニュースフィードに特定のリンクを投稿できるようにするために、追加できるいくつかのオプションのテキストでアプリの権限を必要としないようにしたい。 BuzzFeedはどうしたのですか? Facebookのドキュメントは非常に混乱しているので、私は自分でそれを実装するのが苦労しています。誰かが取る必要のあるステップをレイアウトすることができれば素晴らしいだろう。私はHTMLページに正確に何を入れる必要がありますか? Facebookアプリを作成する必要はありますか?Facebookの共有ボタン:実装方法

答えて

8

あなたのウェブページを共有するには、は、のFacebookブックアプリケーションを作成する必要はありません。

あなただけhref = "http://www.facebook.com/sharer.php?u=<your url>"

とFacebookのようなボタンが同様に共有することができ、そこにそのFacebookのシェア画像を置くことができます。あなたのウェブサイト用にそれを生成するコードはofficial documentationです。

+0

ええ、本当にすべて私が必要とするということであるのに役立ちますか? JSについてはどうですか? Facebookのjsを私のウェブページに追加する必要がない場合、fbポップアップはどのように表示されますか? –

+0

http://jsfiddle.net/ER4Zy/を参照してください。 HTMLだけのJavascriptはありません。しかし、あなたは 'like'ボタンを使うことができます。これは、共有ボタンと同様に機能します。 –

+0

私は参照してください。投稿の画像とリンクのテキストの説明を指定する方法はありますか? –

2

あなたがその共有ページをカスタマイズしたい場合は、この試してみてください。

Javascriptのポップアップ例:

var title = 'My Title'; 
var summary = 'This is my summary'; 
var url = 'http://www.mydomain.com/path/to/page'; 
var image = 'http://www.mydomain.com/images/myimage.png'; 

var fb = window.open('http://www.facebook.com/sharer.php?s=100&p[title]='+encodeURIComponent(title)+'&p[url]='+encodeURIComponent(url)+'&p[summary]='+encodeURIComponent(summary)+'&p[images][0]='+encodeURIComponent(image)); 
fb.focus(); 
1

これはどのような作品です。 HTMLで

:あなたのURLでhttp://google.comを置き換える

<a href="http://www.facebook.com/sharer.php?u=<http://google.com">Facebook Link</a> 

。 PHPで

、あなたはそれはあなたが上にあるURLを引っ張るしたい場合:

<a href="http://www.facebook.com/sharer.php?u=<<?php echo "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; ?>">Facebook</a> 
5

編集して、共有したいページを、頭の中でメタタグにこれらを追加します。

<meta property="og:image" content="http://www. XXXX url of a jpg image you want to be displayed on shared content has to be 200x200 pixels (make it in photoshop ect.) XXXX"/> 
<meta property="og:title" content="xxxx A title you want to be dispayed in shared content xxxx"/> 
<meta property="og:url" content="http://www. url of the page you want shared including the slash after .com xxx .com/"/> 
<meta property="og:description" content="xxxx discription of the shared content xxx "/> 

これらhere- http://ogp.me/

次の自分のページ上の共有ボタンを配置したい場所を、これを挿入

<a title="xxx Share mypage.com xxx" href="http://www.facebook.com/sharer.php? u=http://www. xxx url of page you edited above xxx .com &t=xxx a title you want to use xxx" target="_blank"><img src="http://www. xxx an image for the share button (make it in photoshop ect.)xxx" width="xx" height="xx" alt="Share"/></a> 

が明らかXXX年代を取る以外のOGのプロパティのリストがありますテスト中に上記のいずれかを変更すると、facebookデバッガに行き、時には元の内容を保持するようにデバッグする必要があるかもしれません。

希望は、これは私がいることを読んで、私はところで:)好きではない、シェアを探していたので、私は少し混乱していた

+0

これは完全に機能します! – rohitnaidu19

関連する問題