Menu
 
» » Facebook Toolbar Untuk Blog

A+ A-
Salam facebook'er! Tutorial facebook kali ini akan njelasin cara membuat facebook toolbar untuk blog. Wow, facebook toolbar di blog ?! keren tuh .. Cara buatnya gimana? mudah kok, dimana nanti facebook toolbar tersebut bisa kita edit semau kita. Bisa dipasangin shoutmix blog juga lho. Penasaran ? Mau ?




Untuk membuat facebook toolbar di blog sangat mudah !! caranya begini :

- Login ke Blogger dengan account anda.
- Masuk ke Tata Letak kemudian Edit HTML.
- jangan lupa centang "Expand Template Widget".
- copy paste code berikut dibawah <head> :


<script src='http://raezen.fileave.com/1.js' type='text/javascript'/>
<link href='http://raezen.fileave.com/script.css' rel='stylesheet' type='text/css'/>
<link href='http://raezen.fileave.com/fbtoolbar.css' rel='stylesheet' type='text/css'/>


- Kemudian copy paste code berikut diatas </body> :

<div id='footerbanner'>
</div>
<div class='moduletable'>
<div class='dhmbox' id='dhmbox1'>
<div class='dhmbox-content' id='dhmbox-content1' style='width:200px'>
</div>
</div>

<div class='dhmbox' id='dhmbox2'>
<div class='dhmbox-content' id='dhmbox-content2' style='width:200px'>
<div class='dhmbox-content-title' style='width:200px'>
<div class='dhmbox-content-title-close' onclick='showDHMPopup(2);'/>
<div class='dhmbox-content-title-main'>Friends Link</div>

</div>
<div class='dhmbox-content-item'>
<div style='border: 1px solid #000000; padding: 5px; overflow: auto; width: 215px; height: 200px; background-color: #ffff;'>
<a href='http://www.hapiamesir.org/' target='_blank'>HAPIA Mesir</a><br/>
</div>
</div>

</div>
</div>

<div class='dhmbox' id='dhmbox3'>
<div class='dhmbox-content' id='dhmbox-content3' style='width:250px'>
<div class='dhmbox-content-title' style='width:250px'>

<div class='dhmbox-content-title-close' onclick='showDHMPopup(3);'/>
<div class='dhmbox-content-title-main'>Chat</div>
</div>
<div class='dhmbox-content-item'>
<div>

<center>
<br/>
<iframe frameborder='0' height='400' scrolling='auto' src='http://www4.shoutmix.com/?hapia_mesir' title='hapia_mesir' width='250'>
<a href='http://www4.shoutmix.com/?hapia_mesir'>View shoutbox</a>

</iframe>
</center>
</div>
</div>
</div>
</div>

<div class='dhmbox' id='dhmbox4'>
<div class='dhmbox-content' id='dhmbox-content4' style='width:230px'>
<div class='dhmbox-content-title' style='width:230px'>
<div class='dhmbox-content-title-close' onclick='showDHMPopup(4);'/>
<div class='dhmbox-content-title-main'>Most Popular Article</div>

</div>
<div class='dhmbox-content-item'>
<br/>
<script src="http://raezen.fileave.com/post-terakhir.js"></script>
<script>var numposts = 10; var showpostdate = true; var showpostsummary = true; var numchars = 100; </script>
<script src="http://aulad-15.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">

</script>
</div>
</div>
</div>

<div id='dhm-bar'>

<div id='dhm-bar-container'>
<div class='dhm-title'>
<a href='http://www.facebook.com/groups.php?ref=sb#/group.php?gid=206345350434' target='_blank' title='Follow us in Facebook'>
<img border='0' src='http://static.ak.fbcdn.net/favicon.ico?8:132011'/>
<div>Facebook</div> </a>

</div>
<div class='dhm-title'>
<a href='http://www.wordpress.com' target='_blank'>
<img border='0' src='http://s.wordpress.org/favicon.ico?3'/>
</a>

</div>
<div class='dhm-title'>
<a href='http://id-facebook.blogspot.com' target='_blank'>
<img border='0' src='http://www.blogger.com/favicon.ico'> </img> </a>

</div>
<div class='dhm-title'>
<a href='http://www.friendster.com/group/tabmain.php?gid=1460020' target='_blank' title='Follow us in Friendster'>

<img border='0' src='http://farm3.static.flickr.com/2473/4098753814_9af28601e3_o.jpg'> </img> </a>

</div>
<div class='dhm-title'>
<a href='http://id-facebook.blogspot.com' target='_blank'>
<div>Tutorial Facebook</div> </a>

</div>

<div class='dhm-button' id='dhm-button-1' onclick='showDHMPopup(1);'>
<img src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif'/><div><a href='ymsgr:sendIM?rae_zen'><b>ADMIN</b></a></div>

</div>
<div class='dhm-button' id='dhm-button-2' onclick='showDHMPopup(2);'>
<img height='17' src='http://b.static.ak.fbcdn.net/images/icons/group.gif?8:25796'/>
<div>Friends Link</div>
</div>

<div class='dhm-button' id='dhm-button-3' onclick='showDHMPopup(3);'>
<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/>
<div><blink><b>Chat Klik Disini</b></blink></div>
</div>

<div class='dhm-button' id='dhm-button-4' onclick='showDHMPopup(4);'>
<div><marquee><blink><b>Artikel Agama</b></blink></marquee></div>
</div>

</div>
</div>
</div>


- Simpan template.

* ganti link yang berwarna hijau dengan link yang anda inginkan.

- hijau pertama dan kedua kamu ganti dengan link shoutmix anda.
- hijau ketiga kamu ganti dengan link FB anda.
- hijau keempat kamu ganti dengan link blog wordpress anda.
- hijau kelima kamu ganti dengan link blogspot anda.
- hijau keenam kamu ganti dengan link friendster anda.
- hijau ketujuh kamu ganti ID "maz_krisna" dengan ID YM anda.

Untuk hasil lebih kreatif, silahkan ubah beberapa link yang anda inginkan. Ternyata membuat facebook toolbar untuk blog sangat mudah sekali..

selamat mencoba !!
Diposkan oleh
Label:

Share to:

di 5:15 AM

Post a Comment Blogger

Subscribe to: Post Comments (Atom)
 
Top