Friday, April 8, 2011

Tutorial Blog : Cara letak butang facebook dan twitter yang comel kat blog anda

assalamualaikum


Today mama qist nk buat satu tutorial yg sangat comel untuk para newbie blogger cam mama.. apa salahnya sharing kan..ilmu tu kepunyaan semua, maka sebar2 kan lah. tapi ni original dari mama qist ye, so korang yang nak copy paste article ni minta kebenaran dr mama dulu, kreditkan blog mama pun boleh..cayang korang..


mana satu ek???..alah butang comel facebook yang terapung2 tu la..comel sgt, mama suka butang tu..senang nk berhubung terus dari twitter mahupun facebook...konfius lagi??..ok ni prt scrn dr blog mama macammana rupa  sebenar button comel tu..tadaa


ok jom layan step by step..baca betul2..kalau tak nanti tak menjadi..

  • Langkah 1 ~ Go to design>> page element >> add a gadget >>Pilih Html
  • Langkah 2 ~ Copy & Paste code di bawah
  • <style type='text/css'> a.linkopacity img { filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5;} a.linkopacity:hover img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; -khtml-opacity: 1.0; } </style> <div style='display:scroll; position:fixed; top:200px; left:-12px;'>

        <a class='linkopacity' href=' http://www.facebook.com/USERNAME ' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://YOUR_Facebook_IMG_URL" /></a><br />

        <a class='linkopacity' href=' http://twitter.com/USERNAME' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://YOUR_twitter_IMG_URL" /></a><br />

        <a class='linkopacity'  href=' http://formspring.me/USERNAME '  imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='formspring'><img border="0" src="http://YOUR_Formspring_IMG_URL" /></a><br /></div>


ok dah buat belum?..langkah seterusnya..


Langkah 3 ~ Edit kod yang berwarna merah di atas dengan menggantikan dengan username korang. Contohnya : http://www.twitter.com/aesyamie


Langkah 4 ~ Edit setiap kod yang berwarna biru di atas jika korang nak gantikan gambar butang tu ikut warna pilihan korang sendiri. 


Contohnya : original link http://YOUR_twitter_IMG_URL menjadi seperti ni http://1.bp.blogspot.com/-hvTCTyQZ5gI/TZiB92OO0wI/AAAAAAAABXc/F2RWWNyJNt0/s1600/oranges-twitter.png


caranya mudah sahaja..korang pilih gambar mana satu yang korang nak di bawah ni..Pilih >> Kemudian >> Right Click pada cursor >> Click copy image URL >> Pastekan image URL tu tu pada kod yang berwarna biru semasa langkah 4 tadi..


mudahkan??


jom pilih2 gambar mana yang anda suka..



Biru Gelap


Biru Cerah

Hijau

Pink

Merah

Kuning

Unggu

Turqoise

Hitam/Putih

Coklat

Oren


kalau yang xde akaun formspring, delete je kod untuk formspring tu okay..

alhamdulillah siap satu tutorial..harap semua mendapat faedah..

meh bagitahu sekelian alam ttg tutorial ini..klik like aje..