Sunday, July 24, 2016

Tombol Sosial Media untuk blogger

Tags

thumb




Sore 😀 , kali ini agiel mau bagi cara pasang tombol sosial media berikut dengan hover keren 😀 . sangat kurang rasanya kalo website gak ada tombol jejaring sosial 😀 . Nah untuk itu kita harus taruh widget sosial media agar pengunjung dapat berbagi kepada teman.
oke kita langsung ke tutorial.


pertama kita taruh kode CSS ini tepat di atas kode <b:skin>
<link rel="stylesheet" type="text/css" href="https://googledrive.com/host/0B3CUuMWORS28WWFpZ2FqQ0xLMEk"/>

lalu save template


kemudian setelah itu kalian taruh kode di bawah dimana saja untuk menampilkan tombol sosial media , bisa di bawah postingan , di sidebar atau di navigation 😀
<div class="container">

< -- social media start -- >
<ul class="cv-social-media">
<a class="animated fadeIn" href="#"><li id="facebook" class="icon-facebook facebook"></li></a>
<a class="animated fadeIn" href="#"><li id="twitter" class="icon-twitter"></li></a>
<a class="animated fadeIn" href="#"><li id="pinterest" class="icon-pinterest"></li></a>
<a class="animated fadeIn" href="#"><li id="youtube" class="icon-youtube"></li></a>
<a class="animated fadeIn" href="#"><li id="tumblr" class="icon-tumblr"></li></a>
<a class="animated fadeIn" href="#"><li id="flickr" class="icon-flickr"></li></a>
<a class="animated fadeIn" href="#"><li id="digg" class="icon-digg"></li></a>
<a class="animated fadeIn" href="#"><li id="delicious" class="icon-delicious"></li></a>
<a class="animated fadeIn" href="#"><li id="smashmag" class="icon-smashmag"></li></a>
<a class="animated fadeIn" href="#"><li id="email" class="icon-email"></li></a>
<a class="animated fadeIn" href="#"><li id="stackoverflow" class="icon-stackoverflow"></li></a>
<a class="animated fadeIn" href="#"><li id="vimeo" class="icon-vimeo"></li></a>
</ul>
<div id="clear"></div>

selesai silahkan lihat hasil nya 😀

Penggunaan Markup
  • Untuk memasukan gambar dan youtube link silahkan taruh link gambar dan youtube link tanpa tag <img> dan <iframe>.
  • Untuk menulis huruf bold silahkan gunakan [strong]KONTEN[/strong] atau [b]KONTEN[/b].
  • Untuk menulis huruf italic silahkan gunakan [em]KONTEN[/em] atau [i]KONTEN[/i].
  • Untuk menulis huruf underline silahkan gunakan [u]KONTEN[/u].
  • Untuk menulis huruf strikethrought silahkan gunakan [strike]KONTEN[/strike].
  • Untuk menulis kode HTML silahkan gunakan [code]KONTEN[/code] atau [pre]KONTEN[/pre] atau [pre][code]KONTEN[/code][/pre], dan silahkan parse dulu kodenya pada kotak parser di bawah ini.

Penggunaan Parse Kode Dan Emoticon Tidak Berlaku Di Ponsel.
Show EmoticonHide Emoticon Off Topic