web-dev-qa-db-ja.com

Facebook共有リンク-JavaScriptなし

次のリンクは、Twitterでページを共有するためのものです。

http://Twitter.com/share

FacebookにJavaScriptを必要としない同様のオプションはありますか？

http://facebook.com/sharer.php を知っていますが、そのためにはgetパラメーターを手動で挿入する必要があります（これは行いません）、またはJavaScriptを使用して（これは行いません）私の状況に合わせて）。

facebookfacebook-likefacebook-sharer
116
Web_Designer

使用できます

<a href="https://www.facebook.com/sharer/sharer.php?u=#url" target="_blank">Share</a>

現在、現在のURLをパラメーターとして渡さない共有オプションはありません。これを達成するために間接的な方法を使用できます。

  1. たとえば、「/ sharer.aspx」というサーバーサイドページを作成します
  2. 共有機能が必要なときはいつでもこのページをリンクしてください。
  3. 「sharer.aspx」で参照URLを取得し、ユーザーを「 https://www.facebook.com/sharer/sharer.php?u= {referer}」にリダイレクトします

例ASP .Netコード：

public partial class Sharer : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        var referer = Request.UrlReferrer.ToString();

        if(string.IsNullOrEmpty(referer))
        {
            // some error logic
            return;
        }

        Response.Clear();
        Response.Redirect("https://www.facebook.com/sharer/sharer.php?u=" + HttpUtility.UrlEncode(referer));
        Response.End();
    }
}
160
Medeni Baykal

PS 2： ジャスティン で指摘されているように、 Facebookの新しい共有ダイアログ をチェックしてください。後世のためにそのまま答えを残します。この回答は廃止されました

簡単に言えば、はい、FacebookにはJavaScriptを必要としない同様のオプションがあります（強制ではない最小限のインラインJSがあります。注を参照）。

Ps：onclickの部分は、ポップアップを少しだけカスタマイズするのに役立ちますが、コードが機能するためには不要です 。それなしでも問題なく動作します。

Facebook

<a href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Facebook">
</a>

Twitter

<a href="https://Twitter.com/share?url=URLENCODED_URL&via=Twitter_HANDLE&text=TEXT"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Twitter">
</a>

Googleplus

<a href="https://plus.google.com/share?url=URLENCODED_URL"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=350,width=480');return false;"
   target="_blank" title="Share on Google+">
</a>
118
King'ori Maina

コードにJavaScriptを含め、JavaScript以外のユーザーを引き続きサポートすることができます。

ユーザーがJavaScriptを有効にせずに次のリンクのいずれかをクリックすると、単純に新しいタブが開きます。

<!-- Remember to change URL_HERE, TITLE_HERE and Twitter_HANDLE_HERE -->
<a href="http://www.facebook.com/sharer/sharer.php?u=URL_HERE&t=TITLE_HERE" target="_blank" class="share-popup">Share on Facebook</a>
<a href="http://www.Twitter.com/intent/tweet?url=URL_HERE&via=Twitter_HANDLE_HERE&text=TITLE_HERE" target="_blank" class="share-popup">Share on Twitter</a>
<a href="http://plus.google.com/share?url=URL_HERE" target="_blank" class="share-popup">Share on Googleplus</a>

これらにはshare-popupクラスが含まれているため、jQueryでこれらを簡単に参照し、共有するドメインに合わせてウィンドウサイズを変更できます。

 $（ "。share-popup"）。click（function（）{
 var window_size = "width = 585、height = 511"; 
 var url = this.href ; 
 var domain = url.split（ "/"）[2]; 
 switch（domain）{
 case "www.facebook.com"：
 window_size = "width = 585、height = 368"; 
 break; 
 case "www.Twitter.com"：
 window_size = "width = 585、height = 261"; 
 break; 
 case "plus.google.com"：
 window_size = "width = 517、height = 511"; 
 break; 
 } 
 window.open（url、 ''、 'menubar = no、toolbar = no、resizable = yes、scrollbars = yes、' + window_size）; 
 return false; 
 }）;

これ以上JavaScriptいインラインJavaScriptや、ウィンドウサイズ変更の無数の変更はありません。また、非JavaScriptユーザーも引き続きサポートしています。

34
rybo111

Feed Dialog ページで説明されているように、Feed URLの「Direct URL」オプションを使用できます。

ユーザーを明示的に/ dialog/feedエンドポイントに誘導することで、フィードダイアログを表示することもできます。

  https://www.facebook.com/dialog/feed?  
  app_id=123050457758183&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=http://www.example.com/response`

ドキュメントのどこにも「共有」について言及していないようです。これは、フィードに追加するという概念に置き換えられました。

7
Jordan Reiter

これらの答えの多くはもはや適用されないので、ここに私のものがあります：

Facebook Dev Page で説明されている共有ダイアログを使用します。

例：

https://www.facebook.com/dialog/share?
  app_id=<your_app_id>
  &display=popup
  &href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
  &redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

ただし、登録済みのapp_id、href、リダイレクトURIを入力する必要があります。

6
Justin Skiles

ウェブサイトにアクセスすると、Facebook、google +、Twitterの共有リンクが表示されます http://www.sharelinkgenerator.com/

4
Mazhar Iqbal

これらのリンクタイプを実際に試してみてください。

https://www.facebook.com/sharer.php?u=YOUR_URL_HERE
https://Twitter.com/intent/tweet?url=YOUR_URL_HERE
https://plus.google.com/share?url=YOUR_URL_HERE
https://www.linkedin.com/shareArticle?mini=true&url=YOUR_URL_HERE
4
Asitha Yomal

http://facebook.com/sharer.php は非推奨です

いくつかのオプションがあります（iframeバージョンを使用）：

http://developers.facebook.com/docs/reference/plugins/like/

http://developers.facebook.com/docs/reference/plugins/send/

https://developers.facebook.com/docs/reference/plugins/like-box/

3
DMCS

@ rybo111のソリューションに加えて、LinkedInの共有は次のようになります。

<a href="http://www.linkedin.com/shareArticle?mini=true&url={articleUrl}&title={articleTitle}&summary={articleSummary}&source={articleSource}" target="_blank" class="share-popup">Share on LinkedIn</a>

これをJavascriptに追加します：

case "www.linkedin.com":
    window_size = "width=570,height=494";
    break;

LinkedInドキュメントに従って： https://developer.linkedin.com/docs/share-on-linkedin （「カスタマイズされたURL」セクションを参照）

興味のある人のために、これをLinkedInロゴ付きのRailsアプリで使用したので、助けになるかもしれない私のコードは次のとおりです。

<%= link_to image_tag('linkedin.png', size: "50x50"), "http://www.linkedin.com/shareArticle?mini=true&url=#{job_url(@job)}&title=#{full_title(@job.title).html_safe}&summary=#{strip_tags(@job.description)}&source=SOURCE_URL", class: "share-popup" %>
2
Kyle Carlson

JavaScriptを使用したいが、Facebook JavaScriptライブラリを使用したくない場合：

<a id="shareFB" href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"   target="_blank" title="Share on Facebook">Share on Facebook</a>
<script type="text/javascript">document.getElementById("shareFB").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=" + document.URL);</script>

Javascriptが無効になっていても機能しますが、javascriptが有効になっている場合は、共有プレビューのポップアップウィンドウが表示されます。

Facebook jsスパイウェアを使用せずに、1回のクリックだけで保存できます。

2
Marek Andreansky

コンテンツを共有する方法： https://developers.facebook.com/docs/share/

JSなしで非推奨の機能を使用することを選択し、毎日確認するか、JSを使用して楽しんでください。

1
Sándor Tóth

私はそれが古いスレッドであることを知っていますが、プロジェクトのためにそのようなことをしなければならなかったので、2019年のソリューションを共有したいと思いました。

新しいdialog APIは、パラメーターを取得し、javascriptなしで使用できます。

パラメーターは次のとおりです。

  • app_id（必須）
  • href何も渡されなかった場合に共有したいページのURLは現在のURLを使用します。
  • hashtagには、たとえば#amsterdamのように#シンボルが必要です
  • リンクと共有されるquoteテキスト

JavaScriptなしでhrefを作成できます。

<a href="https://www.facebook.com/dialog/feed?&app_id=APP_ID&link=URI&display=popup&quote=TEXT&hashtag=#HASHTAG" target="_blank">Share</a>

考慮すべきことの1つは、Facebookが Open Graph を使用していることです。そのため、OGタグが適切に設定されていない場合、希望する結果が得られない可能性があります。

0
Shahar

より多くのフォーラムで共有したい場合は、ここに解決策があります。 https://github.com/bradvin/social-share-urls

0
Ahmad Hassan