这个Facebook提要对话框“共享”URL如何使用官方FB弹出窗口?

时间:2015-03-12 23:11:46

标签: facebook facebook-graph-api facebook-sharer

当您向下滚动时,这会显示在Upworthy story (for example, here)的页面顶部:

enter image description here

当您单击它时,您将获得官方Facebook共享对话框弹出窗口。到现在为止还挺好。现在,这里是按钮的Upworthy HTML代码的简化片段:

<a data-url="https://www.facebook.com/dialog/feed?
   app_id=153163221468956
   &display=popup
   &link=URL_TO_SHARE
   &picture=http%3A%2F%2Fsampleimage.jpg
   &redirect_uri=http%3A%2F%2Fwww.upworthy.com%2Ffb-share"
   target="_new" rel="share_popup">

   <span class="text-node"><svg class="icon facebook"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#ico-facebook"></use></svg><span class="preface">Share on</span> Facebook</span>

</a>

他们正在使用feed dialog feature不是 Javascript版本)的网址版本的变体,但他们如何让弹出窗口显示,而不仅仅是打开一个新的一页? (另请注意,分享的链接甚至没有指定;在页面上的Upworthy代码中,它会像上面看到的那样读取URL_TO_SHARE ...那里发生了什么?!)

以下是Facebook's feed dialog feature的示例代码;注意它几乎完全是Upworthy使用的,但这将转到一个新页面(而不是显示弹出窗口)。但我想要弹出窗口。 ;-) Upworthy如何做到这一点?

<a href='https://www.facebook.com/dialog/feed?
  app_id=145634995501895
  &display=popup&caption=An%20example%20caption 
  &link=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
  &redirect_uri=https://developers.facebook.com/tools/explorer'>

  <img src='http://faculty.orangecoastcollege.edu/sgilbert/book/10-5-ButtonsAndAction-B/images/button.png'>

</a>

0 个答案:

没有答案