Minggu, 08 April 2012


Dari hasil uji coba sementara, script ini bisa disematkan pada widget jenis html/javascript, dan berhasil di beberapa penyedia layanan blog, semisal BloggerUntuk menggunakakannya, hampir sama dengan pemasangan widget biasa. berikut langkah2nya;

Cara Pertama :

1.      1. Login ke blogger.com
2.      2. Klik “Rancangan”->”edit HTML”
3.      3. Centanglah kotak kecil “Expand Template Widget”
4.      4. Kemudian carilah kode </head> dan copy kode di bawah ini, lalu letakkan di atan kode </head>


<!– save your energy –>
<script language=’javascript’ src=’http://acbary.16mb.com/file_akbari/green.js’ type=’text/javascript’></script>
<!– save your energy end –>

5.     5.  Jika anda ingin memiliki modus save energy seperti punya saya silahkan anda copy kode dibawah ini dan letakkan di atas kode </head>

<!-- save your energy -->
<script language='javascript' src=’http://acbary.16mb.com/file_akbari/green2.js’ type='text/javascript'/>
<!-- save your energy end -->

6.     6.  Klik tombol “simpal template” sekarang lihatlah blog sobat sekarang,,




sebuah buku tamu (guestbook) pada sebuah blog adalah hal yang cukup penting,karena buku tamu ini merupakan salah satu sarana untuk berinteraksi antara yang Anda dengan para pengunjung blog. Dengan adanya buku tamu di dalam blog, maka para pengunjung dapat mengungkapkan isi hatinya tentang blog yang Anda buat, yang pasti isi dari sebuah buku tamu ini sangatlah bervariasi bisa merupakan pujian, pertanyaan, sekedar iseng, atau ada juga merupakan kritikan terhadap isi blog anda, dan justru dengan adanya variasi itulah membuat blog kita jadi lebih menarik.
Pastinya Anda penasaran kan dengan buku tamu di blog saya ini. Ternyata buku tamu ini bisa disembunyikan dengan tujuan tidak memakan tempat seperti di sidebar blog Anda dan membuat blog Anda jadi lebih menarik.Namun sebelum Anda membuat buku tamu, Anda harus menggunakan penyedia buku tamu dari pihak ketiga, tapi Anda nggak usah khawatir, ada kok penyedia buku tamu yang servernya lumayan bagus dan jarang sekali mengalami down yakni http://www.shoutmix.com atau http://www.cbox.ws. Nah, dari penyedia buku tamu inilah kita nanti akan mendapatkan kode buku tamu yang akan kita pasang bersama script di bawah ini.Ahh.. sepertinya kita tidak usah bertele-tele lagi kali yaa, berikut ini cara membuat buku tamu seperti yang saya miliki :[1]. Masuk ke Blogger

[2]. Pilih "Rancangan/Layout" kemudian "Page Elements" [3]. Klik "Add a Gadget" lalu pilih "HTML/JavaScript" dan copy-paste kode di bawah ini :

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8J0CLAidZ5d2a59YPoaGw20MqlkmIZ-VzSCnhxsM8YGPsjtnX1ZRO4_gSB1FoGh631hAH_GlVTV92jwpwvaAeVGVUiCNzNFdx_kX3o29TXDIBBbTpPivnjV5Pixp0S0ZEAHKsAkxrOyo5/s128/345o85i.gif') 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">
<!-- GANTI INI DENGAN KODE BUKU TAMU ANDA -->
<br/>
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>



[4]. Pada kode di atas, cari kode <!-- GANTI INI DENGAN KODE BUKU TAMU ANDA -->  dan ganti kode tersebut dengan kode buku tamu yang kamu dapatkan dari situsnya. Sebagai referensi, saya tambahkan cara mendapatkan kode buku tamu dari Cbox.
[5]. Yang terakhir klik "Simpan", selesai deh.
Catatan :
Jika Anda ingin mengatur posisinya. Ubah aja nilai atribut top-nya. Kalau mau lebih ke atas dikit, ubah jadi 30px atau 20px, terserah Anda.
Bagaimana..?? Makin penasaran..??? Saran saya lebih baik Anda langsung aja deh mencobanya, mudah kok.
Selamat mencoba yaa dan semoga bermanfaat.. 
[5]. Yang terakhir klik "Simpan", selesai deh.
Catatan :
Jika Anda ingin mengatur posisinya. Ubah aja nilai atribut top-nya. Kalau mau lebih ke atas dikit, ubah jadi 30px atau 20px, terserah Anda. Bagaimana..?? Makin penasaran..??? Saran saya lebih baik Anda langsung aja deh mencobanya, mudah kok.
Selamat mencoba yaa dan semoga bermanfaat.. 



<font color="#000000">Mau punya buku tamu seperti ini?</font><br/>
Klik
<a href="http://www.akbari-syahputra.com/2012/04/cara-membuat-buku-tamu-pada-blog.html">
disini
</a>
<div style="text-align:right">












LANGSUNG KE TUTORIAL AJa


Berikut langkah - langkah nya
1. Login ke Akun Blogger anda masing-masing
2. Klik Design atau Rancangan, kemudian pilih edit html
3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)
4. Cari kode ]]></b:skin>
Kemudian paste kode ini di atas nya


#japarusimgfb:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}
#japarusimgfb{-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}



Kemudian Masuk Kebagian rancangan, tambah gatget HTMLjavascript
paste kode di bagian ..


<div id='japarusimgfb'><center><a href="URL FACEBOOK ANDA" target="_blank"title="by www.akbari-syahputra.blogspot.com"><img src="URL FOTO FACEBOOK ANDA" width="120" height="203" style="border: 0px;" /></a></center></div>




NB ..
dibagian URL FACEBOOK ANDA, ganti dengan URL facebook anda misal Http://www.facebook.com/akbar.putra61


dibagian URL FOTO FACEBOOK ANDA, ganti dengan url foto anda, misal
http://acbary.16mb.com/file_akbari/akbari.png


Selama Mencoba

Blog Archive

Popular Posts