MAAF BLOG SEDANG DALAM PERBAIKAN...

Saturday, April 16, 2011

Membuat Widget Followers Yang Tersembunyi Di Sisi Blog

Untuk menghemat ruang blog widget followers bisa dibenamkan disisi blog. Jadi yang muncul disisi blog cuma judul widgetnya aja dan kalo di klik baru muncul halaman widgetnya. Untuk langkahnya sebagai berikut : 

1.  Login ke akun blogger anda, sebelumnya anda masuk dulu ke Google Friend Connect atau  klik aja disini untuk masuk ke Google Friend Connect, tujuannya untuk mendapatkan kode widget follower anda. Setelah masuk ke Google Friend Connect, klik tambahkan gadget anggota dan atur lah warna widget follower anda. Setelah selesai klik buat kode. Dan kode script follower anda akan mucul. Simpan dulu ya.
2. Lanjut masuk ke dasbor blogger anda setelah anda tadi sudah mendapatkan kode follower anda, buka Rancangan, Lemen Halaman, Klik Tambah Gadget dan pilih HTML/JavaScript.
3. Masukkan kode berikut :
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:350px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i1094.photobucket.com/albums/i443/irawan9/folllowers.jpg') no-repeat;
}

.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}

</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}

function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}

</script> <div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

Kode Widget Follower Anda Disini

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (10-gb.offsetWidth).toString() + "px";
</script></div></div>
4. Ganti tulisan yang dicetak miring berwarna merah diatas dengan kode follower yang sudah anda simpan tadi, dan ganti tulisan yang berwarna biru dengan alamat url gambar anda atau bisa juga menggunakan alamat diatas.
5. Simpan gadget dan lihat hasilnya.



Artikel Terkait Lainnya Seputar:



12 comments:

Anonymous said...

Way cool! Some very valid points! I appreciate you penning
this post plus the rest of the site is really good.

my blog: outlook 2010 email templates

Anonymous said...

Do you have any video of that? I'd want to find out more details.

my web site: email signature generator

Anonymous said...

Thanks for sharing your thoughts. I truly appreciate your efforts and I will be waiting for your next write ups thanks once again.


Feel free to visit my blog post ... free email newsletter templates

Anonymous said...

Hello! Would you mind if I share your blog with my
facebook group? There's a lot of people that I think would really appreciate your content. Please let me know. Thanks

Look at my web-site: email templates in outlook

Anonymous said...

Greate post. Keep writing such kind of information on your site.
Im really impressed by your blog.
Hi there, You've done an incredible job. I will definitely digg it and for my part suggest to my friends. I am confident they will be benefited from this web site.

Feel free to visit my site: Email Templates Design

Anonymous said...

I have read so many posts on the topic of the blogger lovers but this post is truly a good paragraph, keep it up.



Also visit my webpage :: reputed

Anonymous said...

Good day! This post could not be written any better! Reading through this post reminds me of my old
room mate! He always kept talking about this. I will forward this
page to him. Pretty sure he will have a good read. Thank you for
sharing!

My page email marketing templates

Anonymous said...

Hi friends, how is everything, and what you desire to say
about this piece of writing, in my view its really amazing designed for me.


My blog post: bridal makeup

Anonymous said...

Hello, I enjoy reading all of your post. I wanted to write a little comment to support you.


My site email marketing strategy

Anonymous said...

Very rapidly this site will be famous among all blogging and site-building viewers, due to it's good articles or reviews

Also visit my weblog ... free email signature templates

Anonymous said...

My family members always say that I am wasting my time here at net, however I know I am getting familiarity every day by reading such good content.



Here is my webpage relevant Internet site

Anonymous said...

Hey, I think your website might be having browser compatibility issues.

When I look at your website in Chrome, it looks fine but when opening
in Internet Explorer, it has some overlapping.
I just wanted to give you a quick heads up!
Other then that, great blog!

Feel free to visit my webpage free email marketing templates

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | GreenGeeks Review