新浪自定义html链接地址,自定义新浪微博分享按钮样式

最新推荐文章于 2022-03-18 09:35:20 发布

晓剑15703836037

最新推荐文章于 2022-03-18 09:35:20 发布

阅读量458

点赞数

新浪微博分享按钮自定义样式 JS代码动态链接

关键词由CSDN通过智能技术生成

本文介绍了如何使用新浪开放平台的分享按钮组件来实现自定义样式。通过分析新浪生成的JS代码，展示了可以自定义的参数，如count、url、appkey、title、pic、ralateUid和language等，以及如何生成动态链接地址以控制分享内容的展示。通过示例代码，演示了如何创建带参数的分享链接，从而实现分享按钮样式的完全自定义。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

新浪开放平台虽然有分享按钮的组件(http://open.weibo.com/sharebutton)并且提供了两种格式的应用方法：WBML和JS，但还是无法据自己的需求做到自定义样式。

为了解决该问题，我们首先来看下新浪所生成的JS代码：

(function(){

var _w = 32 , _h = 32;

var param = {

url:location.href,

type:'1',

count:'', /**是否显示分享数，1显示(可选)*/

appkey:'', /**您申请的应用appkey,显示分享来源(可选)*/

title:'', /**分享的文字内容(可选，默认为所在页面的title)*/

pic:'', /**分享图片的路径(可选)*/

ralateUid:'', /**关联用户的UID，分享微博会@该用户(可选)*/

language:'zh_cn', /**设置语言，zh_cn|zh_tw(可选)*/

dpc:1

}

var temp = [];

for( var p in param ){

temp.push(p + '=' + encodeURIComponent( param[p] || '' ) )

}

document.write('')

})()

在这里，可以看到新浪允许参数的自定义：

count:'' 表示是否显示当前页面被分享数量(1显示)(可选，允许为空)

url:'' 将页面地址转成短域名，并显示在内容文字后面。(可选，允许为空)

appkey:'' 用于发布微博的来源显示，为空则分享的内容来源会显示来自互联网。(可选，允许为空)

title:'' 分享时所示的文字内容，为空则自动抓取分享页面的title值(可选，允许为空)

pic:'' 自定义图片地址，作为微博配图(可选，允许为空)

ralateUid:'' 转发时会@相关的微博账号(可选，允许为空)

language:'' 语言设置(zh_cn|zh_tw)(可选)

附：

AppKey申请地址：http://open.weibo.com/webmaster/add

新浪微博用户UID/数字ID查看方法：

1. 进入到用户微博主页，点击其关注和粉丝的连接，便能在地址栏中看用户的UID/数字ID。例(http://weibo.com/用户用户UID/myfllow)

2. 打开http://open.weibo.com/sharebutton，在关联账号中输入微博ID，便能在下方获得代码区域出现相关的ralateUid内容。

此时你有没发现，当单击分享以后，能够看到如带有相关参数的动态链接地址：http://service.weibo.com/share/share.php?url=&appkey=&title=&pic=&ralateUid=&language=zh_cn

如此一来，我们可以通过变量自己来创建动态链接地址，那么样式和各种细节就全由我们自己所掌控。

/* weiboShare */

function weiboShare(){

var wb_shareBtn = document.getElementById("shareBtn")

wb_url = document.URL, //获取当前页面地址，也可自定义例：wb_url = "http://www.bluesdream.com"

wb_appkey = "",

wb_title = "【蓝色梦想 BluesDream.com】自定义新浪微博分享按钮样式",

wb_ralateUid = "1654619591",

wb_pic = "https://file.bluesdream.com/wp-content/uploads/2013/01/CSS3-3D%E5%9B%BE%E4%B9%A6%E5%B1%95%E7%A4%BA-3D-Book-Showcase.jpg",

wb_language = "zh_cn";

wb_shareBtn.setAttribute("href","http://service.weibo.com/share/share.php?url="+wb_url+"&appkey="+wb_appkey+"&title="+wb_title+"&pic="+wb_pic+"&ralateUid="+wb_ralateUid+"&language="+wb_language+"");

}

weiboShare()