Cara Membuat Widget Melayang Google Friend Connect, Twitter dan Facebook Like Box

Hallo para wapper, blogger, dan yang gemar berkeliling dunia maya, sudah kenal saya donk pastinya :D sayakan admin blog www.kolose.blogspot.com hehe. Dimulai yuk tips dan triknya.

Cara Membuat Widget Melayang Google Friend Connect, Twitter dan Facebook Like Box :
1.   Login ke dashboard blogger anda, pilih Rancangan > Elemen Laman > Add gadget (HTML/Javascript).

2.       Copy script master widget dibawah ini dan paste pada gadget.

<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3XyriTTjdn-wrbh_SNsicAD2y6_M8I1ZmUx7rT65UGk5MYuc_Kpb3EiPRqGD9banD7tMd7w4eTIyn0G3ZzqAumED3FoM8G2O29oSatEGxlVg3jGYkuqeXTUODTq21RosT1U9XySiiJ0mE/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:50px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2L3h5ImBjpa7Vl985fUX9gxmCOBs_5o0Tri7o7IbLI8BByxExTF2gIxoOtXHmBx1IrHfL71SriyJULMRYYG3hdXMm2-2Z-c7qexPs25TUO_qhEFuNgiey8zvTwg7dyRWe_3gNbrV6zIus/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgad9uvDqUhiigijf-uxMV-YSqgXcD8STyvEBF4cyk2tmv1qEDZnHxBbHXASdk-RI0kbI12HIpcbFARKM7MMGxS66zk8szq7JwJls2_vk9Ht3GaX4-KrMSZGLlk-s4yFFFZ7r-FeAGvdKtx/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:210px;z-index:1000;}
.barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh54iWbqwzKHwBJHuHoRvCm2ErOVIBqEGUCMQ0zgKrb-F73TH30nAbKGDuSqAvsjvpwbxQELRcEKfz19MGOFfVflmVoKwfTTkCEHAgBwuXc8XYw1kvjj0Nssx5iiWGm65qIwtD4iPBqG7Gb/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAyW5w45rC3BZoJK4_qCppcg9rpIvEWkC-zLuCrHpw849SZGZynhpU_Rfi7UimA8QbIkeKE2qRqX7Q0ZjLl22kVrto9dhnakrPBVWmy6fwqs09xJkI46405X1OryFGukt5NAriTbE-2Lvx/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}
.barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR1nU6EsTZ24j_1FyRNp_rsn-6iZCtJaVJr8l7WAVbkPSWQGiK2pEDW3pDGF-TLYahsBhdpQshcusoCN5xm4hHPI5P5rc_TxR8aq-uz5bGw_vDmkXSsnVsNo54aCWTUl6dOo2dPZTM_wPH/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
.barcontefacebook{margin:5px 0 0 47px}
</style>
<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
<div class="barconteblogger">
CONTENT BLOGGER HERE
</div>
</div>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
CONTENT TWITTER HERE
</div>
</div>
<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">
CONTENT FACEBOOK HERE
</div>
</div>

3.       Kustomisasi widget :

• Ganti tulisan CONTENT BLOGGER HERE dengan kode HTML Google Friend Connect anda.
• Ganti tulisan CONTENT TWITTER HERE dengan kode HTML widget status Twitter anda.
• Ganti tulisan CONTENT FACEBOOK HERE dengan kode HTML Facebook Like Box anda.

Source : http://kertas-kecilkita.blogspot.com/2012/02/cara-membuat-widget-3-in-1-melayaang.html

Semoga Bermanfaat.. Follow Blog Ini Ya Sobat. Cantumkan Link Sumber Blog Ini Sob, Jika Mau Copy Paste (Copas) Ok Sob. Salam Saya Admin blog www.kolose.blogspot.com :) Berkomentarlah sobat, berikan blog ini saran dan kritikan, agar blog ini makin maju.
Post by : http://www.kolose.blogspot.com

Anda baru saja membaca artikel yang berkategori Blog / Mobile Blog / Mobile Site / Trick and Tips / Xtgem dengan judul Cara Membuat Widget Melayang Google Friend Connect, Twitter dan Facebook Like Box. Anda bisa bookmark halaman ini dengan URL https://kolose.blogspot.com/2013/04/cara-membuat-widget-melayang-google.html. Terima kasih!

Ditulis oleh: Unknown - Tuesday, 16 April 2013