新浪微博分享按鈕介面:樣式自定義
阿新 • • 發佈:2019-01-26
為了解決該問題,我們首先來看下新浪所生成的JS程式碼:
<script type= "text/javascript" charset= "utf-8" >
( 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( '<iframe allowTransparency="true"
frameborder="0" scrolling="no" src="http://service.weibo.com/staticjs/weiboshare.html?' + temp.join( '&' )
+ '" width="' + _w+ '"
height="' +_h+ '"></iframe>' )
})()
</script>
|
在這裡,可以看到新浪允許引數的自定義:
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 = "http://www.bluesdream.com/blog/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()
|