facebook|Twitter|linkedin分享

最新推荐文章于 2023-10-29 15:12:29 发布

奋飛

最新推荐文章于 2023-10-29 15:12:29 发布

阅读量3.9k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： facebook分享 Twitter分享 linkedi分享

本文链接：https://blog.youkuaiyun.com/ligang2585116/article/details/44977279

JavaScript 专栏收录该内容

66 篇文章

订阅专栏

本文全面介绍了从前端HTML、CSS、JavaScript到后端PHP、Java、MySQL的技术要点，同时深入探讨了移动开发、游戏开发、大数据开发等领域的最新趋势与实践。

<!DOCTYPE html>
<html lang="en" prefix="og: http://ogp.me/ns#">
<head>
	<meta charset="UTF-8">
	<title>Document</title>

	<!-- facebook、linked参数配置 start -->
	<meta property="og:site_name" content="site name"/>
	<meta property="og:title" content="title"/>
	<meta property="og:type" content="website"/>
	<meta property="og:description" content="description"/>
	<meta property="og:image" content="http://yourdomain.com/images/hatenablog.png"/>
	<meta property="og:url" content="http://yourdomain.com/test.htm">
	<!-- facebook、linked参数配置 end -->
	
	<!-- Twitter参数配置 start -->
	<meta name="twitter:card" content="http://yourdomain.com/images/logo_fb.jpg">
	<meta name="twitter:site" content="@yourdomain">
	<meta name="twitter:title" content="test title">
	<meta name="twitter:description" content="Up than 200 characters.">
	<meta name="twitter:creator" content="@creator_username">
	<meta name="twitter:image:src" content="http://yourdomain.com/images/logo_fb.jpg">
	<meta name="twitter:domain" content="content">
	<!-- Twitter参数配置 end -->

</head>
<body>
	<!-- facebook分享 start -->
	<script>
		function fbs_click(){
			window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent('http://yourdomain.com/test.htm?facebook=123'),'facebook share','toolbar=0,status=0,width=626,height=436');
			return false;
		}
	</script>
	<a onclick="return fbs_click()" target="_blank">
		<img src="ADD_IMAGE_URL_HERE" alt="Share on Facebook" />
	</a>
	<!-- facebook分享 end -->
	
	<!-- Twitter分享 start -->
	<script>
		function twitter_click(){
			window.open('https://twitter.com/intent/tweet?hashtags=Invitedusers&original_referer=http://yourdomain.com/test.htm&related=domain&text=Content Test&tw_p=tweetbutton&url='+encodeURIComponent('http://yourdomain.com/test.htm?twitter=123')+'&via=ligang','share','toolbar=0,status=0,width=626,height=436');
			return false;
		}
	</script>
	<a onclick="return twitter_click()" target="_blank">
		<img src="ADD_IMAGE_URL_HERE" alt="Share on Twitter">
	</a>
	<!-- Twitter分享 end -->


	<!-- Linkedin分享 start-->
	<script>
		function linkedin_click(){
			window.open('https://www.linkedin.com/cws/share?url='+encodeURIComponent('http://yourdomain/test.htm?linkedin=123')+'&token=&isFramed=false&lang=en_US','Linkedin share','toolbar=0,status=0,width=626,height=436');
			return false;
		}
	</script>
	<a onclick="return linkedin_click();" target="_blank">
		<img src="ADD_IMAGE_URL_HERE" alt="Share on Linkedin">
	</a>
	<!-- Linkedin分享 end-->


	<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>
  	<script type="in/share" data-url="http://tzyourdomain.com/test.htm" data-counter="top"></script>

</body>
</html>

注意问题：
1. facebook和linkedin对于"sample open graph meta tags"的要求格式一样，所以如果同一个页面既要做facebook又要做linkedin，对于图片等信息必须一致
2. linkedin具有七天缓存期限，官方原文“The first time that LinkedIn's crawlers visit a webpage when asked to share content via a URL, the data it finds (Open Graph values or our own analysis) will be cached for a period of approximately 7 days.”

开发文档
facebook：https://developers.facebook.com/docs?locale=zh_CN
Twitter：https://dev.twitter.com/web/embedded-tweets
linked：https://developer.linkedin.com/docs