Cara Membuat Widget Tombol Share Warna-Warni untuk Website atau Blog

Punya situs atau blog jarang ada orang yang share artikel atau apa pun yang terdapat di pada situs kita. Tenang, caranya kini gampang supaya ada orang yang mau share konten yang terdapat di situs milik kita. Caranya membangun tombol share berupa widget yang dapat diletakkan dimana saja, tetapi rekomendasi letakkan di bawah artikel. Berikut ini Cara Membangun Widget Tombol Share Warna-Warni bagi Laman atau Blog.

• Hal yang perlu kalian lakukan cari kode ]]></b:skin> atau <style> dengan cara tekan tombol F3 dan ketik kode tersebut.




• Setelah itu letakkan script di bawah ini di atas kode ]]></b:skin> atau di bawah kode <style>.

#share-button-lanonadio {margin:0 0 8px;padding:0;overflow:hidden;}

#share-button-lanonadio p {float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);background:#eaeaea;font-color:#000;display:block;padding:5px 8px !important;margin:0 3px 3px 0;border-radius:6px 6px;border:1px solid #fff;}

#share-button-lanonadio a {position:relative;float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);border-radius:6px 6px;display:block;color:#fafafa;padding:5px 8px;margin:0 3px 3px;border:1px solid #fff;}

#share-button-lanonadio a:hover {top:1px;left:1px;box-shadow:0px 0px 3px rgba(1,1,1,.1);}

• Setelah itu cari kode <data:post.body/> (bagi blog berupa blogspot)




• Letakkan script di bawah ini di bawah kode <data:post.body/> atau letakkan secara bebas di mana posisi yang menurut kalian enak dipandang (rekomendasi di bawah artikel).

<b:if cond='data:blog.pageType == quot;itemquot;'>

<div class='clear'/>

<div id='share-button-lanonadio'>

<p>Share On</p>

<a class='facebook' expr:href='quot;http://www.facebook.com/sharer.php?u=quot; + data:post.url + quot;amp;title=quot; + data:post.title' style='background:#3b5998;' target='_blank' title='Facebook'>Facebook</a>

<a class='facebook' expr:href='quot;https://plus.google.com/share?url=quot; + data:post.url' style='background:#c0361a;' target='_blank' title='Google+'>Google+</a>

<a class='twitter' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' style='background:#4099ff;' target='_blank' title='Twitter'>Twitter</a>

<a class='stumbleupon' expr:href='quot;http://www.stumbleupon.com/submit?url=quot; + data:post.url + quot;amp;title=quot; + data:post.title' style='background:#1BE105;' target='_blank' title='StumbleUpon'>StumbleUpon</a>

<a class='linkedin' expr:href='quot;http://www.linkedin.com/shareArticle?mini=trueamp;url=quot; + data:post.url + quot;amp;title=quot; + data:post.title' style='background:#3b5998;' target='_blank' title='LinkedIn'>LinkedIn</a>

<a class='twitter' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://digg.com/submit?url=http://www.erjud-chayob.com/2013/03/tombol-share-lintas-me-modified.htmlamp;title=Tombol Share Lintas Me Modified' rel='nofollow' style='background:#000000;' target='_blank'>Digg</a>

<!-- script begin here -->

<script>

//<![CDATA[

var uri = window.location.href;

var ttle = document.title;

document.write(<a href='http://www.lintas.me/?c=bookmarkleturl=+uri+title=Cara Membangun Widget Tombol Share Warna-Warni bagi Laman atau Blog' rel='nofollow' style='background:#FF9900;'>Lintaskan</a>);

//]]>

</script>

<!-- End script -->

<div class='clear'/>

</div>

</b:if>

Perhatian :

Kode <data:post.body/> ada tiga kode, coba cari satu-persatu dan letakkan di bawahnya sekiranya tombol share masih belum muncul.

 Demikianlah sedikit informasi mengenai Cara Membangun Widget Tombol Share Warna-Warni bagi Laman atau Blog. Semoga apa yang saya sampaikan dapat bermanfaat bagi kalian.

Sumber https://kursuswebsite.org