Cara Membuat Tombol Share Ke Sosial Media Seperti Milik Mas Sugeng

Cara Membuat Tombol Share Ke Sosial Media Seperti Milik Mas Sugeng - Teman-teman blogger pasti pernah mempergunakan atau melihat template milik mas sugeng. Nah salah satu template tersebut sudah pasti memiliki tombol share artikel ke sosial media pastinya. Pada kesempatan kali ini saya pada blog saya newbie code news ingin membagikan sebuah kode yang dapat kita pergunakan untuk memasang tombol sharing artikel ke media sosial ala buatan mas sugeng.

Tombol sharing ini sangat ringan dan yang pasti tidak membuat loading dari blog anda lambat atau lemoot. Dan tombol ini sudah dipastikan dapat membagikan semua artikel kita dengan lancar dan tidak perlu modifikasi yang rumit untuk kita dapat menampilkan tombol ini pada blog milik kita ini.

baca juga : Cara Menambahkan Artikel Terbaru Berdasarkan Label Pada Blog

Untuk memasang tombol share ke sosial media ini kita dapat mengikuti langkah-langkah mudah berikut ini.

• Silahkan login ke blog anda
• Masuk ke template > edit html
• Cari kode berikut ini pada template blog anda ]]</b:skin> atau </style>
• Masukkan kode dibawah ini di atas kode tersebut

.share-buttons-box {height: 67px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCOP-iazlBe9uLgSf4yUx3U_8QJaEzqXr4QiuLljaLIFfaw37SW40pnGTAEt6sAmfUL2asgE7ubCmUm8tjCJRp-Si4vL5i0SajhCBZYVeDD8LlQc8YxXEX2PwhYD5B-KQQGHusmXy8SyQV/s1600/share.png) no-repeat 330px 10px;margin:20px 0 15px;overflow:hidden;}

.share-buttons{margin:0 0;height:67px;float:left}

.share-buttons .share{float:left;margin-right:10px;display:inline-block}

• Jika sudah maka selanjutnya cari kode ini <data:post.body/> namun kode yang ke dua yaaa.
• Nah silahkan masukkan kode dibawah ini.

 <div class='share-buttons-box'>

<div class='share-buttons'>

<div class='share gplus'><div class='g-plusone' data-size='tall' expr:data-href='data:post.url'/></div>

<div class='share like'><div class='fb-like' data-action='like' data-layout='box_count' data-share='false' data-show-faces='false' expr:data-href='data:post.url'/></div>

<div class='share fbshare'><div class='fb-share-button' data-type='box_count' expr:data-href='data:post.url'/></div>

<div class='share tweet'><a class='twitter-share-button' data-count='vertical' data-lang='en' data-size='normal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a></div>

<div class='share linkedin'><script src='//platform.linkedin.com/in.js' type='text/javascript'>

lang: en_US </script><script data-counter='top' expr:data-url='data:post.url' type='IN/Share'/></div>

</div>

</div>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?&#39;http&#39;:&#39;https&#39;;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+&#39;://platform.twitter.com/widgets.js&#39;;fjs.parentNode.insertBefore(js,fjs);}}(document, &#39;script&#39;, &#39;twitter-wjs&#39;);</script><right><a href="http://goo.gl/zAnmTu"><font style='font-size: 9px; color: #CECECE; float: right; margin: 5px;'>share widget</font></a></right><br/>

Nah kemudian simpan template anda. Jika berhasil maka tombol sharing ke sosial media ala mas sugeng akan tampil pada setiap artikel pada blog anda.

Demikian artikel saya yang berjudul Cara Membuat Tombol Share Sosial Media Seperti Milik Mas Sugeng kali ini. Semoga artikel tutorial ngeblog terbaru saya ini berguna bagi rekan-rekan sekalian dan tidak lupa saya mengucapkan terimakasih.

Share this post