Monday, April 04, 2011

Tutorial : Cara Pasang Butang Facebook, Twitter & Formspring Terapung !

Salam !

Pernah tengok tak orang pasang widget social networks terapung kat blog ? Kalau tak pernah, cuba korang tengok blog adamxs, and blog testing aku ni. Ha...kat tepi tu ada widget comel yang terapung kan ? Comel tak ? Sape nak letak widget ni jom kita teruskan tutorial =)

print screen dari :  blog adamxs
 baca lagi...

Cara Letak Butang Facebook, Twitter & Formspring Terapung
  • Langkah 1 Go to >> Add page element >> 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>
  • Langkah 3 Edit kod di bawah yang berwarna merah dengan menggantikan dengan username korang. Contohnya : http://www.twitter.com/silampuneon.
  • Langkah 4 Edit kod di bawah yang berwarna biru, jika korang nak gantikan gambar widget ikut warna pilihan korang sendiri. Contohnya : dari original link http://YOUR_twitter_IMG_URL menjadi seperti ni http://1.bp.blogspot.com/-hvTCTyQZ5gI/TZiB92OO0wI/AAAAAAAABXc/F2RWWNyJNt0/s1600/oranges-twitter.png



Macam mana nak tukar image dan pilih image comel kat bawah ni ? Senang je, korang pilih je mana satu gambar kat bawah ni yang korang suka. Pilih >> Kemudian >> Right Click pada cursor >> Click copy image location >> Paste url image location tu di kod yang bewarna biru semasa langkah 4 tadi.
Biru Gelap


Biru Cerah


Hijau


Pink


Merah


Kuning


Unggu


Turqoise


Hitam/Putih


Coklat


Oren




Tips : Bagi yang takde formspring, tak payang la letak code untuk formspring yer = ) Kepada yang nak letak gambar sendiri bagi image tu, kena edit dulu la gambar korang di photoshop baru lah cool ! Haha...

Credit : Adamxs
Feeling Lucky?


 

Designed by Alieff Artwork