Tổng hợp tiện ích chia sẻ mạng xã hội cực đẹp cho blogger/blogspot

Chia sẻ bài viết lên mạng xã hội là một phần không thể thiếu của một blogger. 

Dưới đây là tổng hợp những widget share button social dành cho blogger/blogspot cực đẹp.

Share Social Style 1

Bước 1: Vào mục Mẫu trong phần quản trị blogger, sau đó chọn Chỉnh sửa HTML.
Bước 2: Ấn tổ hợp Ctrl + F để tìm <b:includable id='post' var='post'>
Bước 3: Thêm vào phía dưới đoạn code sau:

<br /> <b:if cond='data:blog.pageType == "item"'><br /> <br /> <b:if cond='data:blog.pageType != "static_page"'> <br /> <br /> <style type='text/css'> /*<![CDATA[*/ #btnt-social { bottom: 10%; margin-left: -50px; position: fixed; } #btnt-social ul { list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;} #btnt-social ul li { display: inline;background:none;margin:0;padding:0;} #btnt-social ul li a { display:block; width: 32px; height:32px; margin: 5px 0; } #btnt-social ul li a.twitter { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdj2XhRomDerUYvEy3WOAm_djzLNf6hAPQbAku-A2la7WLvyQf3acLlA69ZtltMPsoj265qt4ozVHeib8f-NRfeT1yHUGpyw18UZvcAZG-C8YXtC15af6Ztc43ap5IeHOKOEUwVq2Yv2jx/s32/twitter.png") repeat scroll 0 0 transparent; } #btnt-social ul li a.facebook { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLgOOGmOpGD_y7T3w88RN9oJ1ucnpPkAr1WHs_gYwT32xSOlUo8K1eWTbFGHT7AXKvrszjxrWvdOdiWyP6yuHDcK7EGCo0eSzyWGIZ-A6f3jh1NYhLBi1wu_fovH2D2EtLrZms3yBMxOGb/s32/facebook.png") repeat scroll 0 0 transparent; } #btnt-social ul li a.stumbleupon { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKOjFQK3_p4xLDJX_L3alQFwpiWDAU_3OpKIugvTVa0pXSCbKNXNPcNx0LLJnUFh1gZdCmZu3hH4QUNPljLpKXflrVH_J2Yrw2LPP-YFgsl96eDWzfWogs8RgQEP38UWPyoR93VwGDGYg6/s32/stumbleupon.png") repeat scroll 0 0 transparent; } #btnt-social ul li .google-plus { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUOiBXleKqWPIyPsOTz6iAK6-8b_dKrR5bRwSXEx0_NLu1UCpYuj5uk45hejcGrWl3GNSq-D07A1pJaAT-xeLedf83TxXs5GweyAh7x3e_bi-mAnhe3LT2KIhd_Gb15iGh7ppJ8pgzY_X/s1600/g-plus.png") repeat scroll -1px 0 transparent; } #btnt-social ul li a.pin-it-button { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIrOnSExAePwn7RdyGbpjjmuLb4vluOJvAeYWkm5PfwENfyVn-whvw7l56zIIQhexGKsu7sJfiybZqSbW-S81RYWx7n12TpApdl_U_e5_lMqdCuw86DdZI86dVdetXLcaOGIwUhSLgEWuC/s32/pinterest.png") repeat scroll 0 0 transparent; } #btnt-social ul li .addthis_32x32_style .dummy .at300bs, #btnt-social ul li .addthis_32x32_style .at300bs, #btnt-social ul li .addthis_32x32_style .at15t { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrHzp4h5CFyMFTBckf5j3RKFjDVei15unIJxlug23b1ejpq-CsIEfkN_MGoEhJTrMQ_jGqJavZEiedpI7bX1YpxFxUPNsJEBlQG8tyQ_ceffcbr9nuqayvrb8Ric-P6i6HXNK9iHglePda/s32/sharethis.png") repeat scroll 0 0 transparent; } /*]]>*/ </style><br /> <br /> <div id='btnt-social'><br /> <br /> <ul><li><a class='twitter' expr:href='"http://twitter.com/?status=" + data:post.title + " - " + data:post.url ' rel='nofollow' target='_blank' title='Share this post on twitter'/></li> <li><a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Facebook'/></li> <li><a class='stumbleupon' expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Stunbleupon'/></li> <li><a class='google-plus' expr:href='" http://plus.google.com/share?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Share this post on Google+ '/></li> <li><a class='pin-it-button' href='javascript:void(run_pinmarklet())'/><br /> <br /> <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> <script type='text/javascript'> function run_pinmarklet() { var e=document.createElement('script'); e.setAttribute('type','text/javascript'); e.setAttribute('charset','UTF-8'); e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r=' + Math.random()*99999999); document.body.appendChild(e); } </script></li> <li><div class='addthis_toolbox addthis_32x32_style'><br /> <br /> <a class='addthis_button_compact'/><br /> <br /> </div><br /> <br /> <script type='text/javascript'> var addthis_config = { ui_cobrand: "blogtipsntricks.com", ui_header_color: "#ffffff", ui_header_background: "#0080FF" } </script><br /> <br /> <script src='http://s7.addthis.com/js/300/addthis_widget.js' type='text/javascript'/></li> </ul></div></b:if></b:if> Bước 4: Kích Lưu mẫu để lưu lại kết quả. 

Share Social Style 2

Bước 1: Vào mục Mẫu trong phần quản trị blogger, sau đó chọn Chỉnh sửa HTML. Bước 2: Ấn tổ hợp Ctrl + F để tìm </body> Bước 3: Thêm vào phía trên đoạn code sau:

<div class='shr_ss shr_publisher'> </div><!-- End Shareaholic Sassy Bookmarks HTML --> <!-- Start Shareaholic Sassy Bookmarks settings --> <script type='text/javascript'> var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}}; </script> <!-- End Shareaholic Sassy Bookmarks settings --> <!-- Start Shareaholic Sassy Bookmarks script --> <script type='text/javascript'> (function() { var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true; sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s); })(); </script><br />

Bước 4: Kích Lưu mẫu để lưu lại kết quả.