Cara Menambah Widget Social Sharing di Blog

Bookmark and Share
Widget Socila Sharing diblog itulah nama yang Nurulcall akan post kali ini biasanya kalau ada pengunjung yang ingin share ke Yahoo,Fb atau juga anda mau share ke Digg dan banyak lagi social gak bisa nyebutin satu-persatu nih kalau ada sobat yang mau silahkan dicoba saja mudah cara pemasanganya sob tapi..! sebelumnya mungkin ini juga yang anda cari Widget Mata Mengikuti Cursor masih banyak lagi silahkan anda cari diblog Nurulcall untuk Langkah pemasangan Widget Social Sharing silahkan ikuti langkah-langkah dibawah:

  • Login ke blogger dashboard-->Klik Design-->Edit HTML
  • Cari kode ]]></b:skin> Paste kode dibawah ini tepat diatasnya

#w2b-share ul {list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;}
#w2b-share ul li {display: inline;background:none;margin:0;padding:0;}
#w2b-share ul li a {display: block;float: left;width: 32px;height:32px;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUWcD5aeq-BddxXMCzFhvmCfwEES0VTFJ4hAMsQAVxKOYRUK-AGnWA6Ts-POVDvmA7NbSE4pngQbiYVfMlmZm0CF4fxXM3_HpehJbKFE0PV3ulUCYvRwbWmsLJYdqqYLtv6D8WUur73HkM/s1600/way2blogging-share-icons-sprite.png') ;margin-left:3px;background-repeat: no-repeat;margin-right: 2px;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
#w2b-share ul li a.twitter {background-position: -0px -0px; }
#w2b-share ul li a.twitter:hover {background-position: -0px -33px; }
#w2b-share ul li a.facebook {background-position: -32px -0px; }
#w2b-share ul li a.facebook:hover {background-position: -32px -33px; }
#w2b-share ul li a.stumbleupon {background-position: -64px -0px; }
#w2b-share ul li a.stumbleupon:hover{background-position: -64px -33px; }
#w2b-share ul li a.digg {background-position: -192px -0px; }
#w2b-share ul li a.digg:hover {background-position: -192px -33px;}
#w2b-share ul li a.reddit {background-position: -160px -0px; }
#w2b-share ul li a.reddit:hover {background-position: -160px -33px;}
#w2b-share ul li a.google {background-position: -128px -0px; }
#w2b-share ul li a.google:hover {background-position: -128px -33px;}
#w2b-share ul li a.del-icio-us {background-position: -480px -0px; }
#w2b-share ul li a.del-icio-us:hover{background-position: -480px -33px;}
#w2b-share ul li a.mixx {background-position: -96px -0px; }
#w2b-share ul li a.mixx:hover {background-position: -96px -33px; }
#w2b-share ul li a.technorati {background-position: -416px -0px; }
#w2b-share ul li a.technorati:hover {background-position: -416px -33px;}
#w2b-share ul li a.linkin {background-position: -256px -0px; }
#w2b-share ul li a.linkin:hover {background-position: -256px -33px;}
#w2b-share ul li a.yahoobuzz {background-position: -448px -0px; }
#w2b-share ul li a.yahoobuzz:hover {background-position: -448px -33px;}
#w2b-share ul li a.myspace {background-position: -512px -0px; }
#w2b-share ul li a.myspace:hover {background-position: -512px -33px;}
#w2b-share ul li a.more {background-position: -576px -0px; }
#w2b-share ul li a.more:hover {background-position: -576px -33px;}

  • Seterusnya cari kode <data:post.body/>
  • Paste kode social sharing ini dibawahnya

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='w2b-share'>
<ul>
<li><a class='twitter' expr:href='&quot;http://twitter.com/?status=&quot; + data:post.title + &quot; - &quot; + data:post.url ' rel='nofollow' target='_blank' title='Share this post on twitter'/></li>
<li><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Facebook'/></li>
<li><a class='stumbleupon' expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Stunbleupon'/></li>
<li><a class='digg' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Digg'/></li>
<li><a class='reddit' expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Reddit'/></li>
<li><a class='google' expr:href='&quot;http://www.google.com/bookmarks/mark?op=add&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark this post on Google'/></li>
<li><a class='del-icio-us' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on delicious'/></li>
<li><a class='mixx' expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank' title='Share this post on Mixx'/></li>
<li><a class='technorati' expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Fav on Technorati'/></li>
<li><a class='yahoobuzz' expr:href='&quot;http://buzz.yahoo.com/submit/?url=&quot;+ data:post.url' rel='nofollow' target='_blank' title='Share this post on Yahoo!Buzz'/></li>
<li><a class='myspace' expr:href='&quot;http://www.myspace.com/Modules/PostTo/Pages/?u=&quot;+ data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Sahre this post on Myspace'/></li>
<li><a class='a2a_dd more' expr:href='&quot;http://www.addtoany.com/share_save?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title '/><script src='http://static.addtoany.com/menu/page.js' type='text/javascript'/></li>
</ul>
</div>
</b:if>
  • Perhatian!sekiranya kode <data:post.body/> ada tiga dalam template anda cari mana2 kode dibawah dan pastekan kode social sharing dibawah/selepasnya.


<div class='post-footer-line post-footer-line-1'>
<div class='post-footer'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>


{ 0 komentar... Views All / Send Comment! }

Posting Komentar

Powered By Blogger