Question

我正在使用一个网站，其前端位于angularjs，后端位于ROR，同一ROR API也用于android app。现在我有一个情况。我需要在社交媒体上分享我的网络帖子，例如facebook，twitter和google plus。除了单个帖子的链接外，还应该有一个small preview（帖子的预览会在发布之前抓取，例如在facebook中）。我是使用角度插件做的。但是当谈到Android方面时，他们分享的内容以及Facebook上显示的内容仅限于链接。然后我做了一些R＆amp; D，我开始知道它必须在social media meta tags的服务器端完成。我做了一点但它仍然无效。我坚持下去了。以下是我到目前为止所做的工作。

 def show
  @post = Post.find_by_permalink(params[:id])
    respond_to do |format|
        format.html
        format.js
    end
end

在我的观看次数posts / show.html.erb

<!DOCTYPE html>
<html>
<head>
    <title> Shared Question</title>

    <meta property="og:title" content="My Page" />
    <meta property="og:description" content="A description of my page." />
    <meta property="og:image" content="http://www.example.com/images/my_lovely_face.jpg" />
    <!-- etc. -->
</head>
<body>
Here is the body
</body>
</html>

每当某个用户在任何媒体上分享我的网络帖子链接时，我只需要显示一个小预览

Answer 1

您是对的，您需要为自定义社交共享功能实现特殊的开放图（和其他）标签。

请记住，例如Facebook将缓存您的页面。

因此，您可以尝试https://developers.facebook.com/tools/debug/来测试您的代码而不进行缓存 - 代码本身看起来很好。

示例代码：

将此代码放在<head>和</head>之间以及其他元标记。

<meta property="og:title" content="Title">
<meta property="og:site_name" content="Name">
<meta property="og:url" content="URL">
<meta property="og:description" content="Description Text">
<meta property="og:type" content="article">

<!--- network Specific --> 
<meta property="fb:app_id" content="AppID">
<meta name="twitter:card" content="app">
<meta name="twitter:site" content="@FernerJohannes">

如果您想要专门定位Twitter，请参阅以下卡片指南： https://dev.twitter.com/cards/getting-started

您可能还想结帐：Open Graph validation for HTML5

Answer 2

您可以为您的网站设置自定义图片，以便在fb帖子中显示 -

将OG XML添加到您的html标记

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:fb="http://ogp.me/ns/fb#">

添加这些元标记以设置OG将使用的自定义图像

<meta property="og:image" content="url_to_image" />

您可以尝试阅读this以获取更多信息。

希望这有帮助。

在社交媒体Ruby On Rails上共享链接时的小预览

2 个答案: