关于把文章分享到facebook,google,twtter,whatsapp的总结

关于把文章分享到facebook,google,twtter,whatsapp的总结

在网站的mete标签处还需要添加内容

<!-- twitter share-->

<meta name="title" content="lopScoop">

<meta name="twitter:site" content="@lopscoopNews">

<meta name="twitter:card" content="summary_large_image">

<meta name="twitter:url" class="share_url" content="http://hotintoday.com/content?id=92003">

//分享链接  http://hotintoday.com/content?id=92003

<meta name="twitter:title" class="share_title" content="${contentInfo.title }">

//分享标题  ${contentInfo.title } 根据自己情况而定 eg：content="分享的链接标题内容"

<meta name="twitter:description" content="${contentInfo.description }">

//分享描述  ${contentInfo.description } 根据自己情况而定 eg：content="分享的链接描素内容"

<meta name="twitter:image" content="${contentInfo.thumbnail}">

//分享图片  ${contentInfo.thumbnail} 根据自己情况而定 eg：content="图片链接地址"

<!-- FaceBook share-->以及<!-- google+ share -->

<meta property="og:url" class="share_url" content="http://hotintoday.com/content?id=92003" />

<meta property="og:type" content="article" />

<meta property="og:title" class="share_title" content="${contentInfo.title }" />

<meta property="og:description" content="${contentInfo.description}" />

<meta property="og:image" content="${contentInfo.thumbnail }" />

//分享到facebook

function fbShare(contentId) {

u = document.getElementsByClassName("share_url")[0].content;

t = document.getElementsByClassName("share_title")[0].content;

window.open("http://www.facebook.com/sharer.php?u="+ encodeURIComponent(u) + "&t="+ encodeURIComponent(t), "sharer","toolbar=0,status=0,width=626,height=436");

"sharer","toolbar=0,status=0,width=626,height=436" 设定分享窗口视图高度

} 

//分享到google

function googleShare(contentId) {

u = document.getElementsByClassName("share_url")[0].content;

t = document.getElementsByClassName("share_title")[0].content;

//window.open("https://plus.google.com/share?url="+encodeURIComponent(u), "sharer","menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600");

}

//分享到twtter

function twitterShare(contentId) {

u = document.getElementsByClassName("share_url")[0].content;

t = document.getElementsByClassName("share_title")[0].content;

//window.open("http://twitter.com/home?status="+encodeURIComponent(u)+""+encodeURIComponent(t),"sharer", "toolbar=0,status=0,width=626,height=436");

}

分享到whatsapp

function whatsApp(contentId){

u = document.getElementsByClassName("share_url")[0].content;

t = document.getElementsByClassName("share_title")[0].content;

location="whatsapp://send?text="+ encodeURIComponent(t) + encodeURIComponent("\n\n"+u)+"&via=lopscoop";

}

页面调用的方法（html）

<div class="xq-loginshare">

<a href="javascript:fbShare();" class="xq-facebook">facebook</a>

<a href="javascript:googleShare();" class="xq-google">google</a>

<a href="javascript:twitterShare();" class="xq-twtter">twtter</a>

<a href="javascript:whatsApp();" class="xq-whatsapp" data-action="share/whatsapp/share">whatsApp</a>

</div>

红色是内容重点，分享的地方，加上要分享的url，share_url 是要分享的地址

例如分享facebook，点击发布，就可以看到facebook 内容了

重要注意事项
我要在a页面通过点击按钮分享b页面到facebook，b页面要写mete标签各种配置的 <meta property="og:image" content="分享标题" />，还有分享链接，facebook，google，twttwe，whatsapp通过抓取你的分享链接页面的mete标签，来展示 等