文档章节

手把手教你如何将网站内容分享到Facebook/Twitter/Google+

卢玮
 卢玮
发布于 2016/05/19 23:08
字数 387
阅读 1689
收藏 0

       前段时间帮一朋友建了一个外贸网站,完了朋友说需要添加一个分享到Facebook/Twitter/Google+的功能,百度出来的东西大家可想而知,唯一能用的就是一个四五年前的链接分享的例子,实现太渣了,google出来的东西,大都是别人集成好的,而且是收费的。所以只能揣着4级都过不了的英文水平去看官方文档了,闲话少说,上菜。

1,Facebook

拿到应用编码之后,在你的网站加入如下代码:

//引入JS库,我已经下载下来了,或则:https://connect.facebook.net/en_US/sdk.js

<script src="js/fb_sdk.js"></script>

FB.init({
    appId: '110xxxxxxxxxx101',//此处填上应用编码
    version: 'v2.5' 
});

//给你的按钮点击事件加上这行代码

$("#share-facebook").on("click",function(){
    FB.ui({
        method: 'share',
        href: 'http://www.creativesmokes.com',
    }, function(response){
          console.log("share success");
    }); 
});

最后很重要的一步:

<meta property="og:title"       content="Glass Water Pipes Bong Factory Creative Smokes" />
<meta property="og:type"        content="article" />
<meta property="og:site_name"   content="creativesmokes.com"/>
<meta property="og:url"         content="http://www.creativesmokes.com" />
<meta property="og:description" content="描述文字" />
<meta property="og:image"       content="图片地址" />
<meta name="description"        content="Creative Smokes Factory" />
 

完美

 

2,Twitter

推特只能发文字

$("#share-twitter").on('click',function(){
    var text = "Glass Water Pipes Bong Factory Creative Smokes. @CreativeSmokes  http://www.creativesmokes.com/";
    window.open("https://twitter.com/intent/tweet?text="+encodeURIComponent(text));    
});

3,Google+

上面的步骤完成后,只需要加这段代码就可以

$("#share-google").on('click',function(){
    window.open("https://plus.google.com/share?url="+window.location.href);
});

 

FBI警告:记得翻墙哦

© 著作权归作者所有

卢玮
粉丝 2
博文 1
码字总数 387
作品 0
浦东
程序员
私信 提问
加载中

评论(1)

danle
danle
可以发一下您的联系方式嘛,关于您发的这个https://my.oschina.net/u/177565/blog/678248,我的微信18049680520
关于社交网络影响力的一份调查报告

社交网络的影响力与其在网络上的渗透程度密切相关。目前,在各网站(各种应用)集成的社交分享中,最常见的就是 Facebook 和 Twitter。 BrightEdge,一个企业级 SEO 平台,发布了一份关于网站...

红薯
2011/07/09
1K
0
30个最具影响力的高质量网页设计博客

我曾经花了一些时间浏览互联网来找到行业内高质量和最有影响力的网站设计博客。结果是很难找到可靠的高质量的网站来源。我特别对网页设计,WordPress, UI, UX, HTML5, CSS3, jQuery以及响应...

曾沙
2013/08/15
9.5K
10
利用Twitter找工作——如何建立个人品牌

专栏 | 九章算法 网址 | www.jiuzhang.com 找工作时,个人品牌的建立是十分重要的。 根据最近的《JobVite社会招聘调查》,92%的企业使用或计划使用社交媒体进行招聘。 因此,一个属于你个人...

2018/01/03
0
0
添加社交网络到您的站点(Adding Social Networking to Your Website)

本章详细讲述如何整合,在你的站点上建立社交网络服务。 在本章中,您将学习如何让社交网站的书签链接、Facebook或Digg等网站的链接、Twitter的feeds, gravatar头像和Xbox玩家卡添加到您的网...

剑了
2012/04/06
0
0
TOP 21大社交媒体管理和社交媒体分析工具

  【IT168 评论】什么是社交媒体管理和分析软件?社交媒体管理和分析软件通过测量、分析和解释人与人,主题和想法之间的互动和联系,为社交媒体监测,度量和为品牌价值提供平台。社交媒体分...

it168网站
2017/12/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周四乱弹 —— 当你简历注水但还是找到了工作

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @花间小酌 :#今日歌曲推荐# 分享成龙的单曲《男儿当自强》。 《男儿当自强》- 成龙 手机党少年们想听歌,请使劲儿戳(这里) @hxg2016 :刚在...

小小编辑
今天
2.8K
22
靠写代码赚钱的一些门路

作者 @mezod 译者 @josephchang10 如今,通过自己的代码去赚钱变得越来越简单,不过对很多人来说依然还是很难,因为他们不知道有哪些门路。 今天给大家分享一个精彩的 GitHub 库,这个库整理...

高级农民工
昨天
4
0
用好项目管理工具,人人都可以成为项目经理

现在市面上的项目管理工具越来越多了,但是大多数都是一些协同工具或轻量项目管理工具。如果是多团队、跨部门使用或者企业级的项目管理,从管理思想到工具运用,需要适应企业的业务流程体系,...

cs平台
昨天
12
0
只需一步,在Spring Boot中统一Restful API返回值格式与统一处理异常

统一返回值 在前后端分离大行其道的今天,有一个统一的返回值格式不仅能使我们的接口看起来更漂亮,而且还可以使前端可以统一处理很多东西,避免很多问题的产生。 比较通用的返回值格式如下:...

晓月寒丶
昨天
69
0
区块链应用到供应链上的好处和实际案例

区块链可以解决供应链中的很多问题,例如记录以及追踪产品。那么使用区块链应用到各产品供应链上到底有什么好处?猎头悬赏平台解优人才网小编给大家做个简单的分享: 使用区块链的最突出的优...

猎头悬赏平台
昨天
32
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部