facebook, twitter, linkedin等的分享功能

1. facebook分享

方法一：传入参数，此时标题获取的是页面title标签中的内容

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
</head>
<body>
    <a href="https://www.facebook.com/sharer.php?u=https://www.google.com">facebook share</a>
</body>
</html>
复制代码

 

方法二：使用meta参数

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 开放图谱 以便分享出去的内容更准确 -->
    <meta property="og:url" content="需要分享的网址" />
    <meta property="og:type" content="article" />
    <meta property="og:title" content="标题" />
    <meta property="og:description" content="描述" />
    <meta property="og:image" content="图片地址" />
    <!-- 开放图谱 以便分享出去的内容更准确 -->
    <title>Document</title>
</head>
<body>
    <a href="https://www.facebook.com/sharer.php?u=需要分享的网址">facebook share</a>
</body>
</html>
复制代码

 

 

2. twitter分享

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
</head>
<body>
    <a href="https://twitter.com/share?url=需要分享的网址&text=title">twitter share</a>
</body>
</html>
复制代码

 

3. linkedin 此时标题获取的是页面title标签中的内容　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
</head>
<body>
    <a href="https://www.linkedin.com/shareArticle?url=需要分享的网址">linkedin share</a>
</body>

</html>　　　　

被分享的页面使用的头：

<meta name="title" property='og:title' content='Title of the articleAAAAAAAAAAAAAAB'/>
<meta name="image" property='og:image' content='https://iof-1312006075.cos.accelerate.myqcloud.com/meeting/banner/170832383817809072.jpg'/>
<meta name="description" property='og:description' content='Description that will show in the previewBBBBBBB'/>　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

参考来源：

针对linkedin分享图片和名称推荐设置，官方在线调试地址(清除缓存)、参考2:

 

posted on 2024-02-27 18:33  andydaopeng  阅读(126)  评论(0)  编辑  收藏  举报

导航