微博html5到桌面,HTML 分享页面到QQ/微信、微博等平台

本文介绍了一种自定义社交媒体分享组件的方法,详细展示了如何配置不同平台的分享参数,包括窗口标题、分享摘要、URL地址及图片等。同时,还提供了代码示例说明如何修改分享按钮的样式。

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

详细的代码示例(完整的分享媒体id对应表详见转载链接)

//QQ空间

//新浪微博

//百度

//人人网

//QQ

window._bd_share_config = {

common : {

bdPopTitle:'窗口标题',

bdText : '发现一个新的网页,快来围观啊~',

bdDesc : 'Custom share summary', //自定义分享摘要

bdUrl : 'Custom share URL address', //自定义分享url地址

bdPic : 'http://obs-hwe2-p2.obs.cn-east-2.myhwclouds.com/upfile/72180503/15411509626726.jpg' //自定义分享图片

},

share : [{

"bdSize" : 16

}],

slide : [{

bdImg : 0,

bdPos : "right",

bdTop : 100

}],

image : [{

viewType : 'list',

viewPos : 'top',

viewColor : 'black',

viewSize : '16',

viewList : ['qzone','tsina','huaban','tqq','renren']

}],

selectShare : [{

"bdselectMiniList" : ['qzone','tqq','kaixin001','bdxc','tqf'] //自定义弹出浮层中的分享按钮类型和排列顺序

}]

}

with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];

bVbwVSf?w=345&h=93

做的时候发现这些图标都是很过时的了,如果想要修改这些图标得自己重新做一张图片,通过图片位移来显示对应的图片

.bdshare-button-style0-16 a, .bdshare-button-style0-16 .bds_more{

background-image: url('./icon.png') !important;

padding-left: 32px !important;

height: 32px !important;

line-height: 32px !important;

}

.bdshare-button-style0-16 .bds_tsina{

background-position: 0 -30px !important;

}

修改后

bVbwVRX?w=334&h=199

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值