Parse HTML

Untuk memasang kode HTML maka perlu di jinakkan dulu sobat2. . . nah caranya ada dibawah ini.
silahkan masukkan kode sobat, kemudian tekan convert. jadi dech!!!



Mau tahu cara Buat???? silahkan lihat disini

Blog

Cara Membuat Spoiler Tombol

Apa itu spoiler nda??? Spoiler yaitu suatu tombol atau script yang dapat menyembunyikan suatu teks, gambar, kode, atau yang lain sehingga bisa menyingkat atau menghemat tempat posting. Bisa juga untuk memperindah tampilan sehingga konten kita tidak langsung terbuka seperti tulisan ini. Lebih jelasnya silahkan sobat lihat contoh dibawah ini.
Buka Gambar Dibawah ini hati2..........

Atau

Buka Gambar Ini:

Mau tahu gimana cara buatnya sob? Langsung aja kita pelajari.
Kita ambil aja script dibawah ini,
<div id="spoiler" style="display:none">
Konten Yang Disembunyikan
</div>
<button title="Klik untuk melihat/menyembunyikan" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Buka/Tutup</button>


Kemudian letakkan script tersebut dalam notepad, simpan dengan nama apa saja yang penting inget. Nah sekarang silahkan posting sesuatu pada mode HTML, copas script yang udah diambil tadi dalam posting isi sesuai keinginan ente pada warna merah dan sesuaikan. Ntah itu gambar atau teks atau terserah.
Mudah kan?? Sekian tentang Cara Membuat Spoiler Tombol. Semoga bermanfaat. Keep Spirit

Blog

Cara Membuat Buku Tamu Blog Melayang Atau Sembunyi

Yaitu model buku tamu akan terbuka ketika kita klik, berbeda dengan buku tamu tanpa di klik bisa muncul yang ane posting disini sob, kalau mau coba silahkan aja langsung ke TKP:

1. Siapkan dulu sob, script buku tamu kalian. Bisa Shoutmix, bisa Cbox. Lalu simpan di notepad.
2. Login ke blogger, lalu klik Rancangan, Add Widget, HTML/Javascript ( Tips : Tempatkan widget di samping kiri dan jangan diberi judul)
3. Copy paste script berikut :

<style type="text/css">
#gb{
position:fixed;
top:23px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') 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">
Tempatkan Script Buku Tamu kalian disini
<br/>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[Close]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

 
Warna Biru : Ganti dengan script buku tamu kalian yang telah disimpan di notepad
Warna Merah : Bisa diganti dengan url gambar tombol buku tamu. Kalau malas, dibiarkan saja juga tidak apa-apa.

4. Tinggal save, jadi deh...
Kalau sudah sukses harap konfirmasi sob. Okay. . . .
Nah sekian dulu cara membuat buku tamu tersembunyi dari saya meskipun sudah banyak sekali tutorial lain, tapi ini masih diperlukan untuk menjalin tali silaturahmi. . . wassalam.

Blog , Tutorial

Cara Memasang Animasi Lucu di Pojok blog

Cara menampilkan gambar animasi di pojok-pojok blog. Terkadang untuk menghias blog agar tampak lebih fresh maka bisa memasang gambar animasi di blog.Bisa ditempatkan di pojok atas (kiri dan kanan), pojok bawah kiri dan kanan, atau semua pojok diisi gambar lucu-lucu.wkwkwk

Untuk menampilkan gambar lucu, cukup copy salah satu script html di bawah ini kemudian masukkan ke dalam gadget html. Script ini dibuat menggunakan kode html ditambah gambar dari situs sweetim.

Contoh dan scriptnya bisa dilihat di bawah ini :
1.Gajah loncat


Script:

<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BC.gif" title="Click to get more." /></a><small><center><a href="trimudareog.blogspot.com" target="_blank">Widget-Animasi</a></center></small></div>

2. Boring


Script :

<div style="position: fixed; bottom: 0px; left: 20px;width:80px;height:120px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002016B.gif" border="0" /></a><small><center><a href="http://kwoolcomunity.blogspot.com" target="_blank">Widget-Animasi</a></center></small></div>

3.Tuyul ketawa

Script:
<div style="position: fixed; bottom: 0px; right: 20px;width:82px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002031F.gif" border="0" /></a><small><center><a href="http://terang-bulan.co.cc" target="_blank">Widget-Animasi</a></center></small></div>

4. Panda main bola

Script:

<div style="position: fixed; bottom: 0px; right: 30px;width:160px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002032D.gif" border="0" /></a><small><center><a href="http://trimudareog.blogspot.com" target="_blank">Widget-Animasi-Blog</a></center></small></div>

5. Panda biru


Script:

<div style="position: fixed; bottom: 0px; left: 20px;width:100px;height:100px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002033D.gif" title="Click to get more." /></a>
<small><center><a href="http://trimudareog.blogspot.com" target="_blank">Free-Widget-Animasi</a></center></small></div>

6. Panah


Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:210px;height:120px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020236.gif" title="Click to get more." /></a><small><center><a href="http://terang-bulan.co.cc" target="_blank">Widget Animasi</a></center></small></div>
7.Lumba-lumba

Script:
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BA.gif" title="Click to get more." /></a><small><center><a href="http:trimudareog.blogspot.com" target="_blank">Widget Animasi</a></center></small></div>

8.Kucing tidur

Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203C0.gif" title="Click to get more." /></a><small><center><a href="http://trimudareog.blogspot.com" target="_blank">Widget Animasi</a></center></small></div>

9.Ikan

Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020479.gif" title="Click to get more." /></a><small><center><a href="http://terang-bulan.co.cc" target="_blank">Widget Animasi</a></center></small></div>

10. Helikopter

Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020389.gif" title="Click to get more." /></a><small><center><a href="http://terang-bulan.co.cc" target="_blank">Widget Animasi</a></center></small></div>

11. Bunga

Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020322.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>

Caranya muddah sob. . .copas aja scriptnya kemudian log in blogger-pilih desain-add gadget yang masih kosong - simpan deh. . .ok




Kata terkait: Cara Memasang Animasi Lucu di Pojok blog, Membuat animasi bergerak, animasi blog, membuat background animasi, membuat widget animasi

Blog , Tutorial

Cara Pasang Pagerank Checker di Blog

Ini sobat, share tentang cara pasang pagerank checker di BLOG dan cara pasang indexs checker di blog. Buat sobat yang lagi ngejar SEO, daripada lihat disitus lainnya mending pasang di blog sendiri. Kalau saya tidak lagi ngejar pagerank blog sob, saya cukup sitelink ajalah.. nanti biar google sendiri yang menilai.
Daripada lama-lama mending langsung aja di praktekin sob, ikuti langkah2 dibawah ini sob.

1. Login blogger,
2. Pilih design
3. Add widget, pilih HTML/ Javascript
4. Masukkan Kode dibawah
5. Perhatikan w: widht h: height (sesuaikan dengan lebar dan tinggi gadget sobat)

Untuk demo dan kelebihannya lihat Pagerank checker dan Index checker

<script src="http://www.gmodules.com/ig/ifr?url=http://pagerank.databot.nl/igoogle/gadget.xml&amp;up_pagerank_checker=&amp;synd=open&amp;w=320&amp;h=400&amp;title=Google+PageRank+Checker&amp;border=%23ffffff%7C0px%2C1px+solid+%23ff9977%7C0px%2C1px+solid+%23ffddcc%7C0px%2C1px+solid+%23ff9977%7C0px%2C1px+solid+%23ffddcc%7C0px%2C1px+solid+%23ff9977&amp;output=js"></script>

Untuk pemasangan Indexs Page Checker ada dibawah kodenya, demonya dilihat index checker dan pagerank checker

<script src="http://www.gmodules.com/ig/ifr?url=http://www.search24online.com/gadgets/index_checker.xml&amp;synd=open&amp;w=320&amp;h=400&amp;title=Index+Checker+-+Search24online+SEO+Tool&amp;border=%23ffffff%7C0px%2C1px+solid+%23ff9977%7C0px%2C1px+solid+%23ffddcc%7C0px%2C1px+solid+%23ff9977%7C0px%2C1px+solid+%23ffddcc%7C0px%2C1px+solid+%23ff9977&amp;output=js"></script>

Demikian cara pasang pagerank checker di blog dan cara pasang indexs checker di blog.
Semoga bermanfaat buat sobat semua, semangat mengejar SEO ya.... :)

Blog , SEO