閱讀目錄

• 1.社會化分享
• 2.選擇一個分享按鈕
• 3.添加到博客園博客

　　博客園美化相關(guān)文章目錄：博客園博客美化相關(guān)文章目錄

　　在前2篇博客“博客美化(1)基本后臺設(shè)置與樣式設(shè)置”與"博客美化(2)自定義博客樣式細節(jié)"中詳細介紹了博客樣式設(shè)置的相關(guān)問題，當然可能是自己角度的問題，不是所有人都能完全搞明白，我個人的建議是，自己一邊改，一邊測試，只要花時間，肯定沒問題，想我這種js,css小白都可以慢慢修改一點，大家也都沒問題的，只是看想不想去折騰了。還是那句話，人生在于折騰。這一篇文章來一個實際的案例，也算是前2篇文章的一個補充，為自己的博客添加一個“分享按鈕”。很多人可能也見到過類似的按鈕，博客園的很多大神都在使用。效果就是您看這篇文章當前頁面，最右邊的那個按鈕。如下圖所示：

　　下面將像大家介紹幾種分享按鈕以及使用步驟。當然可能對很多人是小菜一碟，這里也算是一個拋磚引玉的作用，希望大家分享更多自己折騰博客園的插件，因為我找這個東西花了很長時間(不懂原理，不知道搜索啥關(guān)鍵字)，現(xiàn)在看來當然是非常簡單了。進入主題之前，先感謝博客園團隊，sevennight，marvin，博皮小組以及@Newlife群-長沙老豬，以及其他博客園關(guān)于樣式設(shè)計制作文章的作者，沒有一一列出，也記不清了。本文是在很多文章和現(xiàn)有博客模版的基礎(chǔ)上，自己磕磕碰碰，總結(jié)下來的。?

本文原文地址：博客美化(3)為博客添加一個漂亮的分享按鈕

當然這里的分享按鈕也可以用于大家各自的項目中，很多網(wǎng)站場合都可以使用，而不僅僅是博客園，使用方法大家模式和參考說明，本文只針對博客園的使用。

回到目錄

1.社會化分享

　　最近幾年所謂的SNS(Social Networking Services)，即社會性網(wǎng)絡(luò)服務(wù)非常火，啥微博，空間，蘑菇街。。開心，人人啦。。。數(shù)不勝數(shù)，雖然我不太經(jīng)常用，但總歸看到身邊人在用，而且比較頻繁。以前沒有數(shù)量的概念，但看到下面一些數(shù)字后，我也很吃驚。在這里也給大家分享以下，作為使用這個按鈕的原因之一：

下面的數(shù)據(jù)和圖片來源與下面網(wǎng)站，純屬引用:

http://www.jiathis.com/report/html/2014-1-18

　　上述更詳細的報告可以參考源鏈接。所以在社會化網(wǎng)絡(luò)如此發(fā)到的今天，看到微信朋友圈每天的那些轉(zhuǎn)發(fā)，的確是很有沖動給自己的博客添加一個按鈕，讓分享更快，更美麗。（同時也發(fā)現(xiàn)很多網(wǎng)友，使用復(fù)制粘貼來把文章分享到自己的博客，比較費勁，有了這個工具，事半功倍)。接下來就看看幾款優(yōu)秀的分享工具吧。

回到目錄

2.選擇一個分享按鈕

　　以前不知道有這種現(xiàn)成的東西，一直以為網(wǎng)友的這種按鈕效果是自己用js寫出來的，所以非常羨慕這些朋友。但自從發(fā)現(xiàn)這個東西后，百度了一下，非常多，我找了幾個，一起都分享給大家吧。大家根據(jù)自己的喜好以及需要來選用。使用方法將在下一小節(jié)中提到，過程也很簡單，獲取代碼后粘貼到博客園的頁首Html代碼中就可以了。

1.JiaThis分享按鈕

　　我最先了解和接觸，也是目前在使用的分享按鈕就是“JiaThis”按鈕，也就是大家目前右側(cè)看到的。這個使用量應(yīng)該很廣泛吧，講到好多園友都是使用的這個。其網(wǎng)址為：http://www.jiathis.com/index2。這個按鈕的特點是樣式多，支持的網(wǎng)站也多大122個，非常全面。還有一個高級的“自定義”的功能，可以生成滿足自己需求的按鈕，比其他的功能要全面些吧，效果還不錯。

2.分享家按鈕

　　分享家按鈕是后來百度到的，稍微試了一下，感覺支持的網(wǎng)站不多，樣式也沒有JiaThis那么豐富，湊合著用吧。分享家官網(wǎng)是：http://addthis.org.cn/，這個分享家網(wǎng)站還提供一個訂閱按鈕，功能類似吧，有興趣的可以去看看。

3.百度分享按鈕

　　本人一直對百度的產(chǎn)品比較反感，感覺是啥都要做，啥都做不好，要不是迫于無奈，百度搜索都不會用。這個百度分享按鈕雖然提供的樣式比較多，但沒發(fā)現(xiàn)有多少在用，看了網(wǎng)站的介紹，總體感覺一般的，可能使用它的好處是流量統(tǒng)計做得比較好。支持的網(wǎng)站也不如JiaThis的多。樣式可能比較簡潔，大家看看，喜歡可以用用。這個百度分享有 一個專業(yè)開發(fā)版 和 自由版，專業(yè)版可能是供自己網(wǎng)站開發(fā)用的，像博客園使用自由版就好了。百度分享按鈕網(wǎng)址：http://share.baidu.com/

4.bShare分享按鈕

　　bShare也是非常專業(yè)的一個分享按鈕，據(jù)網(wǎng)站介紹使用的人挺多吧，樣式也挺多，不過也都差不多，其支持的網(wǎng)站挺多130+，比JiaThis還多啊。有一些特殊的樣式，比較贊一個吧。這個我也沒去嘗試，留個腳印吧。這個網(wǎng)站也有不少其他產(chǎn)品，值得用用。bShare網(wǎng)址：http://www.bshare.cn/

回到目錄

3.添加到博客園博客

?　　大家根據(jù)上面選擇的按鈕，獲取到代碼之后，直接粘貼到博客園后臺-頁首Html代碼 的文本框中就可以了，如下圖我的代碼和截圖：

<script charset="utf-8" type="text/javascript" src="http://v3.jiathis.com/code/jiathis_r.js?move=0&amp;btn=r3.gif"></script>

至此，大功告成，大家保存后就可以看到效果。

?

來源

轉(zhuǎn)載于:https://www.cnblogs.com/skullboyer/p/8269844.html

總結(jié)

以上是生活随笔為你收集整理的【转】博客美化(3)为博客添加一个漂亮的分享按钮的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。