Laman

Sunday, December 27, 2009

MEMBUAT TEXT MENU BAR BERJALAN




Menu judul atau title bar ini letaknya ada di atas dan di pojok kiri pada browser milik sobat. Jika ingin title bar tersebut nampak berjalan,sobat bisa tambahkan kode script seperti di bawah ini:

<script language="JavaScript">
var txt=" SELAMAT DATANG ";
var kecepatan=200;var segarkan=null;function bergerak(){ document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</script>


CARA MEMASUKKAN KODENYA:
  • Yang pasti login dulu ke blog sobat.
  • Klik tata letak.
  • Pilih edit html.
  • Cari kode </head.>
  • Jika sudah ketemu masukkan kode diatas tadi tepat di atas kode </head.>
  • Yang bisa sobat edit:
    Kata SELAMAT DATANG bisa dirubah sesui keinginan sobat.
    Nilai kecepatan semakin tinggi semakin lambat jalannya.
    Supaya kata yang berjalan tidak berhimpitan beri spasi pada sebelum atau sesudah kata SELAMAT DATANG.
  • Pratinjau dulu kemudian simpan
  • Lihat hasilnya.

Tuesday, December 22, 2009

CARA MEMBUAT SPOILER DI BLOG



Fungsi dari spoiler ini adalah untuk menampilkan (show) atau menyembunyikan (hide) image maupun text pada halaman posting atau bisa juga di letakkan pada sidebar. Untuk menghemat tempat biasanya para blogger menyiasati dengan menggunakan spoiler tersebut. Bagi sobat yang ingin membuat spoiler dan belum tahu caranya bisa ikuti cara ini:

Di bawah ini adalah kode yang bisa sobat gunakan untuk membuat spoiler:
<div id="spoiler"><div><input style="margin: 10px; padding: 0px; height:60px; font-size: 50px; font-weight:bold;" value="OPEN" onclick="if
(this.parentNode.parentNode.getElementsByTagName('div') ['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')
['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')
['hide'].style.display= 'none'; this.innerText = ''; this.value = 'CLOSE'; } else {
this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display= ''; this.innerText = ''; this.value = 'OPEN'; }" type="button"/><div id="show" style="border: 5px; solid red; margin 5px; padding: 2px; display: none; width: 90%;">
Sobat bisa memasukkan text atau alamat gambar di sini.
<br>
<img src="http://i761.photobucket.com/albums/xx252/darma_bucket/th_garudajpn.png"a>
</div><div id="hide"></div></div></div>

Ganti yang berwarna merah dengan text atau alamat gambar sobat.
Di bawah ini adalah hasil dari kode-kode di atas.
Silahkan diklik untuk melihat hasilnya.



Thursday, December 17, 2009

MEMBUAT RECENT POST DI BLOGGER



Untuk sobat yang ingin membuat recent post di blogspot rasanya tidak perlu repot lagi,karena blogspot sendiri sudah menyediakan sarana ini untuk para blogger. Guna dari recent post ini adalah untuk menampil artikel terbaru,bahkan sobat bisa menampilkan 10 dari artikel terbaru.

Untuk sobat yang baru memulai bikin blog dan belum tahu bagaimana cara membuat recent post bisa ikuti cara di bawah ini:
  • Login ke blog sobat.
  • Pilh tata letak.
  • Tambahkan Gadget.
  • Jika pada pop up halaman pertama tidak muncul recent post,sobat klik pada link yang bertuliskan Gadget lainnya. Maka akan muncul beberapa gadget,pilih dan klik gadget yang betuliskan recent posts yang gambar iconnya seperti di bawah ini.
    Photobucket
    Setel Gadget.
  • Beri judul atau tetap dengan judul yang ada yaitu Recent posts.
  • Atur ketinggian,jika yang ingin ditampilkan kurang dari 10 mungkin bisa dikurangi.
  • Number of posts to display : ini jumlah recent post yang ingin sobat tampilkan,bisa 10 atau bisa kurang.
  • Display Posts data : jika ingin menampilkan tgl-bln-thn beri tanda centang.
  • Show a summary of your blog posts? : jika ingin sebagian isi artikel ditampilkan beri tanda centang.
  • Summary Length : ini jumlah huruf yang ingin sobat tampilkan,bisa ditambah bisa dikurangi.
  • kliksimpan.
  • Lihat hasilnya.

Wednesday, December 16, 2009

MEMASANG BUKU TAMU DENGAN SHOUTMIX


Untuk mempererat hubungan antara pengunjung dan pemilik blog alangkah indahnya jika si pengunjung bisa meninggalkan jejak untuk sekedar bersalam sapa. Untuk hal yang satu ini biasanya si pemilik blog memasang shoutbox atau buku tamu pada blog mereka. Saya ingin sedikit berbagi dengan sobat yang belum tahu bagaimana cara memasang buku tamu tersebut. Kali ini kita memasang buku tamu dengan menggunakan shoutmix.
    Caranya :
  • Masuk ke www.shoutmix.com.
  • Dari halaman ShoutMix klik create shoutbox.
  • Isi kotak yang tersedia:
    Shoutbox informationShoutbox ID : Nama ID sobat.>
    Choose passsword : Masukkan password.
    Retype password : Ulangi masukkan password yang sama.
    Contact information
    Name : Nama sobat.
    Email : Masukkan alamat email sobat.
  • Beri tanda ceckbox pada kotak kecil.

  • Klik Continue
    Tunggu sampai proses loading selesai,sobat akan di bawa ke halaman setting. Sesuaikan dengan keinginan sobat.
  • Untuk mengambil kodenya pada kolom Quick Start klik Get codes.
    Jika sudah terbuka halaman baru sobat bisa menyesuaikan ukurannya sesui dengan template sobat. Kemudian ambil kodenya,kopi dan paste. Bisa disimpan pada notepad terlebih dahulu.

    Untuk memasukkan kodenya.
  • Login ke blog sobat.
  • Pilih tata letak.
  • Tambahkan Gadget.
  • Pilih HTML/JAVAScript.
  • Masukkan kode yang sobat ambil tadi ke bagian konten.
  • Klik simpan.
  • Lihat hasilnya.

SMOGA BERHASIL

Saturday, December 12, 2009

PASANG GOOGLE TRANSLATE DI BLOG


Mungkin diantara sobat ada yang ingin pasang google translate di blog,siapa tahu ada pengunjung blog yang butuh penterjemah,sehingga kita tidak perlu lagi menyewa seorang guide. Sobat bisa pasang translate ini disebar.
Caranya:
  • Login dulu ke blog sobat
  • Pilih tata letak
  • Tambahkan gadget
  • Pilih HTML/JAVAScript
  • Masukkan kode di bawah ini pada bagian konten

    <div id="google_translate_elemen"></div><script>
    function googleTranslateElementInit() {
    new google.translate.TranslateElement({
    pageLanguage: 'id'
    }, 'google_translate_element');
    }
    </script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>


  • Klik simpan

Friday, December 11, 2009

MEMBUAT MENU DROP DOWN


Untuk menghemat tempat pada halaman template terutama pada bagian sidebar, yang biasa digunakan untuk meletakkan berbagai link atau sejenisnya. Kadang kita perlu meringkas agar tidak memenuhi halaman pada sidebar.

Salah satu cara untuk meringkas tersebut kita bisa menggunakan sebuah menu,yang di sini kita bisa memanfaatkan menu Drop Down. Meskipun pembuatannya cukup sederhana namun bagi para blogger ini sangat bermanfaat.
  • Untuk membuatnya login dulu ke blog sobat.
  • Pilih tata letak.
  • Tambahkan Gadget
  • Pilih HTML/JAVAScrip
  • Masukkan kode di bawah ini pada bagian konten

    <select name="menu"oncange="window.open(this.option[this.selectedIndex].value;">
    <option value=0 selected>JUDUL MENU</option>
    <option value="http://URL/" >Judul artikel 1</option>
    <option value="http://URL/" >Judul artikel 2</option>
    <option value="http://URL/" >Judul artikel 3</option>
    </select>
  • Ganti yang warna merah dengan alamat link sobat.
  • Klik simpan

Lihat perubahan pada blog sobat,jika benar hasilnya akan terlihat seperti di bawah ini:

Sunday, December 6, 2009

CARA MEMBUAT LINK OTOMATIS


Fungsi dari link otomatis ini sebenarnya tidak berbeda dengan link-link yang pernah saya posting sebelumnya.
Kenapa kita sebut dengan link otomatis,karena tanpa kita klik link ini akan terbuka dengan sendirinya. Kita tinggal mengarahkan mouse di atas link tersebut,maka link akan membuka halaman baru.

Jika pada link sebelumnya kita membuatnya seperti ini <a href="http://alamat">keterangan</a> maka pada link otomatis ini kita tinggal menambahkan kode: "onmouseover="window.location=this.href".
Jika kita gabungkan maka hasilnya seperti di bawah ini:
<a href="http://alamat"onmouseover="window.location=this.href">keterangan</a>

Contoh link otomatis:
<a href="http://activekita.blogspot.com/2009/11/cara-membuat link.html"onmouseover="window.location=this.href">Cara membuat link</a>

Di bawah ini adalah hasil dari penulisan link di atas,jika ingin mengetahui hasilnya coba arahkan mouse di atas link tersebut di bawah ini:

Cara membuat link

Cara membuat link
Cara membuat link warna-warni
Membuat link dalam satu halaman
Cara membuat link otomatis
Membuat link untuk download