2

Is it possible to share content from my web application on different social media sites (fb, twitter, google+, soundcloud) in one click? Instagram has similar feature.

Is there rails gem available for that? Pointers to tutorials will be appreciated.

4

2 回答 2

3

这些是简单的 HTML/JavaScript 插件。除了在模板中放置所需的标记之外,您不需要在 Rails 堆栈中涉及任何内容。

https://twitter.com/about/resources/tweetbutton

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

http://www.hyperarts.com/blog/tutorial-how-to-add-facebook-share-button-to-your-web-site-pages/

于 2013-11-29T10:16:21.250 回答
3

为什么要使用宝石

虽然实现社交分享按钮的代码确实非常简单,并且通常可以直接从该站点的示例复制到您的模板中,但使用 gem 来管理该代码是有好处的:

  • 它有助于保持代码库 (DRY) 中的关注点分离。如果您要在多个视图中使用这些按钮,您可能还是想编写一些帮助模板函数。

  • 您不必通过每个共享按钮的实现中的任何更改来使您的应用程序保持最新(前提是您选择的 gem 维护良好)

我知道这是一个旧线程,但我偶然发现它正在寻找 Rails 的“社交共享宝石”,并且因为我找到了一个我想分享的可行解决方案。

哪个宝石

我能够找到两个积极维护的宝石:

  • https://github.com/huacnlee/social-share-button - 这支持大量站点,但使用简单的实现。它不支持更高级的功能,如计数器和其他格式,因为它没有调用完整的 iframe 实现。但它似乎很好地覆盖了主要的亚洲社交网络。
  • https://github.com/iffyuva/social-buttons - 这仅支持 Facebook、G+、Twitter 和 Pinterest。然而,它是一个功能更全面的抽象,所以它适用于我的用例(FB、G+、Twitter,带有计数器)。

示例实现

要使用后者,一般可以按照 github 页面上的说明进行操作,有几个例外:

我不得不将 gem 的源设置为 github 而不是 ruby​​gems,因为 ruby​​gem 行已经过时并且有一些阻塞错误。所以:

gem 'social-buttons', git: 'git://github.com/iffyuva/social-buttons.git', branch: 'master'

如果他们的爬虫无法访问他们的 url,facebook 对话框会在您打开它后立即关闭 - 如果您从 localhost 工作,则会发生这种情况,因此请确保指定 URL。实际上,您的应用程序应该知道您的内容的规范 url 是什么,所以在您看来:

url = request.protocol + HOST_FOR_CRAWLERS + model_path(@model)

最后,文档有点不清楚如何为 facebook 函数形成参数,或者您需要script: truegoogle plus 标签来部署其脚本。

这是我的看法:

<ul class="social-share-list list-inline"> <li class="twt"> <%= tweet_button count: 'horizontal', related: 'realted_twitter_handle', text: @model.title + ' ' + url, url: url, via: 'your_twitter_handle' %> </li> <li class="gp"> <%= google_plus_button href: url, script: true, annotations: :bubble, size: :medium %> </li> <li class="fb"> <%= like_button your_facebook_app_id, action: 'like', href: url, layout: :button_count, send: true %> </li> </ul>

在我的 sass 中,我添加了一些规则来将 iframe 标准化为常规的内联大小:

ul.social-share-list { li { &.twt {margin-right: -35px;margin-bottom: -5px;} &.gp {margin-right: -33px;margin-bottom: -5px;} &.fb { position: absolute;} } }

于 2014-03-28T07:36:36.317 回答