Cara
Membuat Tweet Box Melayang di sebelah kanan Blog
merupakan widget yang banyak dipasang. Media Blogger juga akan
memberikan informasi mengenai
Cara Membuat Tombol Like Facebook
dan
Follow Twitter di blogspot.
Social networking memang merupakan kegiatan banyak orang di era
teknologi saat ini. Bagaimana tidak? Kecanggihan transaksi secara
online, menghubungi kerabat dan saudara,
mendapatkan
penghasilan di internet dapat dilakukan dengan media social.
Untuk itu apabila anda ingin lebih memajukan blog anda dan agar lebih
dikenal, bisa juga dengan menambahkan sebuah kotak yang dapat
menghubungkan mereka dengan anda. Bagaimana cara memasang widget
tersebut, langsung saja ikuti tips dan tutorialnya.
Cara
Membuat Twitter Box Melayang di Blog :
1. Silahkan buat terlebih dahulu tampilan widget tersebut di
http://twittercounter.com/
2. Login dengan menggunakan akun Twitter anda.
3. Jika sudah Lalu klik
My Widget, Lalu Klik
Widget Setting
and Code, sesuaikan dengan selera dan tampilan blog kita, jika sudah
cocok lalu copy kode script widget yang telah disediakan.
4. Masuk ke Blogger.
5. Pilih Dashboard, lalu klik Layout / Tata Letak.
6. Tambahkan Gadget Baru dengan klik
Add a Widget / Add a Gadget.
Sesuaikan dengan posisi letak yang ingin anda pasang.
7. Pilih
HTML/Javascript.
8. Ganti kode warna merah pada script berikut ini dengan kode yang tadi
diperoleh dari
twittercounter.com
<style type="text/css">
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZ4rFdl6KO-aMdPzG0bVfCIdrnVc380wXqLuM0RmjdiNfuPtpuGIskEZm0dLtRpYVp1_812V9Pn4Vr0W2j3nhlHLkRwVpx_abWfilprltfMu7ECPnyT-U52js1L6Y5XVBfAQ5R4fIhDFeD/');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/AVvXsEh4AyLclQacIushMrHpv2CjtEQtu9XWsmoLdfWL8NV3z-QD4WvUBja6DNDydVy4JizVHFFMcwwjO6iPOSwP-QEAxZ8Iz29y8VXtZpFX6amrmS1lDE3ZOru0eGqI7T6OgrmRPqAkXJYNmfUz/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px;
z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
</style>
<div class="barrighttwitter"
onmouseover="this.className='barrighttwitterc'"
onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
PASTEKAN KODE SRIPT
TwitterCounter
</div>
</div>
9. Setelah anda ganti, copy semua kode yang telah digabungkan dengan
twittercounter diatas.
10. Masukkan ke dalam kotak HTML/Javascript di Blogger tadi.
11. Save Widget.
Maka pada halaman anda, telah terpasang box twitter melayang di blog.
Source : abufarhan
Cara Memasang Tombol Like Facebook dengan Follow Twitter Simple
:
1. Masuk ke Blogger.com
2. Pilih Blog Anda, lalu ke Layout / Tata Letak
3. Tambah Widget anda.
4. Pilih HTML/Javascript
5. Copy kode CSS dan HTML berikut :
<style type="text/css">
#AGCnavbar3{border:4px solid #000;border-radius:5px; width:155px;
height:57px; margin-bottom:460px; margin-left:10px; font-family:Comic
Sans Ms; color:white;text-align:left;
background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGZam1MJqgIZkeKGOJp7yuuIj5rrs43iNo3QbHthrUeRqP3HOikNfJo6NIddu9do3O8cN0QrpZ-0246VsmP4Y3H_y8RhC2_i_P4gzs6JgHyo9VJQGwMiXanTxcMBSLXDX3zOSz1ow7HdE/s1600/grid.png");
background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGZam1MJqgIZkeKGOJp7yuuIj5rrs43iNo3QbHthrUeRqP3HOikNfJo6NIddu9do3O8cN0QrpZ-0246VsmP4Y3H_y8RhC2_i_P4gzs6JgHyo9VJQGwMiXanTxcMBSLXDX3zOSz1ow7HdE/s1600/grid.png");
background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGZam1MJqgIZkeKGOJp7yuuIj5rrs43iNo3QbHthrUeRqP3HOikNfJo6NIddu9do3O8cN0QrpZ-0246VsmP4Y3H_y8RhC2_i_P4gzs6JgHyo9VJQGwMiXanTxcMBSLXDX3zOSz1ow7HdE/s1600/grid.png");
padding:2px; z-index:999; bottom:1px; left:1px; right:1px;
position:fixed;-webkit-transition: all 0.9s ease-out;-moz-transition:
all 0.9s ease-out;-ms-transition: all 0.9s ease-out;-o-transition: all
0.9s ease-out;transition: all 0.9s ease-out;}
#AGCnavbar3 .left{float:left; text-align:left; font-family:Supermercado;
font-size:10px; font-style:normal; font-weight:normal; color:White;
padding:2px 10px}
#AGCnavbar3:hover{box-shadow:1px 1px 5px black;font-size:20px;
font-style:bold; width:155px; height:57px; margin-bottom:460px;
margin-left:10px; margin-right:120px;-webkit-transition: all 0.9s
ease-out;-moz-transition: all 0.9s ease-out;-ms-transition: all 0.9s
ease-out;-o-transition: all 0.9s ease-out;transition: all 0.9s
ease-out;}
</style>
<div id='AGCnavbar3' style='position:fixed;'>
<span class='left'><img src='' title=''/>
<iframe allowTransparency='true' frameborder='0' scrolling='no'
src='http://www.facebook.com/plugins/like.php?href=https://www.facebook.com/http://impoint.blogspot.com&send=false&layout=button_count&width=85&show_faces=false&action=like&colorscheme=light&font&height=21'
style='border:none; overflow:hidden; width:85px; height:21px;'/>
<div style='margin-right:3px;margin-left:2px;'>
<a
class='twitter-follow-button' data-lang='id' data-show-count='false'
href='https://twitter.com/ravdania'>Ikuti @Media Blogger</a>
<script>!function(d,s,id){var
js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
</span></div>
Keterangan :
- Ganti kode berwarna hijau dengan ID Facebook Anda / URL Fans Page FB
kalian.
- Ganti kode berwarna orange dengan kode tombol twitter anda.
Anda dapat mengganti nama twitter di widget tersebut dengan nama twitter
anda (di dalam kode warna orange).
Tidak ada komentar :
Posting Komentar