Membuat Spoiler pada Blog

Spoiler merupakan salah satu cara yang dipakai oleh para pengguna forum untuk menyembunyikan/menampilkan gambar, tulisan, link, dll.

Dengan adanya spoiler ini maka akan memudahkan para pembaca untuk memahami isi tulisan.

Sekarang, mari kita buat spoiler tersebut pada blog kita. Perhatikan langkah-langkah berikut ini.

1. Login pada account Blogger anda.

2. Setelah itu, buatlah sebuah postingan baru yang akan anda sisipi spoiler.

3. Setelah selesai membuat postingan, klik pada tab “Edit HTML”.

4. Pilih tempat, dimana anda akan menyisipkan spoiler. Jika sudah, copy code di bawah ini.

<div> <div class="spoiltitle"> <b>Spoilers (bisa diganti):</b>  <input class="spoilbtn" onclick="javascript:if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Klik untuk buka/tutup (bisa diganti)'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Click to View Content(bisa diganti)'; }" onfocus="this.blur();" type="button" value="Klik untuk buka/tutup(bisa diganti)" /> </div> <div class="spoildiv"><div style="display: none;"> <div> <br /> <img align="middle" height="224" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWdsozBhpKv2nGj1vbWVWMrAZdX184t16j_ZopPQQEoHyEzzJw_Wn0R46NRYN9TjPlIDgDJc-gnlUlk13kWEtV5DfmSEmTxfjKbGssymn-6ozuQsGgqCdOS3jqncksRh2SrxbocZz3KoXj/s320/Jurassic_Park_Operation_Genesis_B01.jpg" width="400" /> (bisa diganti) <br /> <br /> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA3SWyqE7e4GnG9QaMyV-S44hZsm7W-cI9ddxRjsOCHlmKNAGTp2pTF31RsbKhYwTb_S_RIeKaSXp1ykxvfS5C0vAZk3ATVE_cvHybNXQrcfhyphenhyphenisnIRBQLktLCBFgX0PnA0C7pkGmEk9JO/s320/Jurassic-Park-Operation-Genesis_3.jpg" width="400" /> contoh link (bisa diganti)</a> <br> <br> Visit <a href="fr-ee-it.blogspot.com"> me</a> , (bisa diganti) </div> </div> </div> </div>

5. Pembuatan spoiler sudah selesai.

Catatan :

Jika anda ingin merubah isi dari spoiler tersebut, anda harus mengubah isi di antara tag “<div style="display: none;"> ” dan “</div>(yang terakhir)”. Atau kalian bisa lihat, yang ada tulisan "bisa diganti", berarti itu bisa kalian edit sesuka kalian.

Untuk menulis kata, anda bisa langsung menulisnya diantara tag tadi. Jika ingin ganti baris ketikkan “<br>”.

Untuk mengisinya dengan gambar, ketikkan code berikut.

<img src="tempat online dimana anda menyimpan gambar">

Untuk mengisinya dengan link, ketikkan kode berikut.   

<a href="isi dengan link yang dituju">Tulisan yang ingin ditampilkan</a>

Satu lagi, jika anda ingin pada saat pertama load page, spoiler menampilkan isinya, maka anda harus merubah ““<div style="display: none;">” menjadi ““<div style="">”.

Baca Selengkapnya...

Membuat Daftar Isi Blog Otomatis Pada Postingan/Gadget

Membuat Daftar Isi Blog Otomatis Pada Postingan/Gadget
Cara pemasangan daftar isi manual dan daftar isi otomatis tidak berbeda, yang membedakan hanya kode-kode yang digunakan dan cara kerjanya saja, namun tidak salahnya klo saya memberikan contoh bentuk dari daftar isi otomatis tersebut, silahkan  klik disini untuk  melihat hasilnya.

Berikut ini cara membuat dan memasang daftar isi otomatis, silahkan ikuti dengan cermat dan seksama langkah-langkah di bawah ini:
1. Login ke Blogger, Klik Layout/Tata Letak;
2. Pada Elemen Halaman, klik Add Gadget/Tambah Gadget di lokasi yang Anda inginkan;
3. Cari dan pilih HTML/Javascript;
4. Copy paste kode di bawah ini ke dalam content yang telah tersedia, berikut ini kodenya :

<div style="height: 350px; overflow: auto; text-align: left; width: 100%;">
<script src="http://www.abu-farhan.com/script/daftarisiblogger/blogtoc-min.js">
</script>
<script src="http://uttawebsite.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
</div>

5. Klik Tombol Save/Simpan.

Keterangan :
* Link yang berwarna merah, silahkan anda ganti sesuai dengan alamat Blog Anda;

Baca Selengkapnya...

Membuat Background Baru Di Blog

Tutorial ini baru saya pratekan di blog ini. Kalau Anda suka dan berminat ikuti langkah yang saya akan jelaskan di bawah. Saya kira masih jarang blog yang memberi refrensi atau cara memasang background blog di internet makanya saya posting disini, kiranya berguna.

Untuk mengganti background blog bawaan template [yang ada beckground-nya], saya ada refrensi buat Anda yang ingin mengganti background di blog Anda.

Ini alamat-nya :  http://backgroundlabs.com

Pertama ketahui dulu alamat background Anda yang mau di ganti, yang biasanya berformat 'gif ', caranya lihat pada halaman utuh blog Anda, dilanjutkan klik kanan pada mouse dan ketahui alamat background-nya yang mau di ganti.


Selanjutnya :

1.  Login dulu di Blogger
2.  Masuk ke edit HTML
3. Centang dulu pada kotak "centang"
   
4. Tekan F3 pada komputer Anda, untuk memudahkan mencari LINK yang sama dengan background Anda tadi,
5. Kalau sudah ketemu, BLOK aja dg mouse,
6. Lalu paste-kan LINK yang ada di bawah gamabar yang kamu pilih di http://backgroundlabs.com 
7. Simpan, dan jadi deh background baru di blog Anda.

Setelah itu selesai,

Baca Selengkapnya...

Membuat Recent Post disertai Gambar (thumbnails)

Untuk membuat Recent Post pada blog mungkin sudah cukup banyak tutorialnya, dari widget blogger sendiri juga sebenarnya sudah menyedikan untuk membuat recent post secara instan. Tapi untuk kali ini saya akan membahas bagaimana membuat Recent Post yang disertai gambar yang diperkecil (thumbnails)dari postingan tersebut sehingga ini bisa membuat tampilan blog kita lebih menarik. Untuk membuat Recent Post tersebut cukuplah mudah, sedikit langkah yang kita lakukan sudah dapat membuat recent post tersebut.

Berikut langkah untuk membuatnya :



Dan berikut ini beberapa kode yang harus dan bisa kita rubah.
.............................................................................................................
boxwidth - Ukuran Lebar Widget
cellspacing - Spasi diantara cells
borderColor - Warna Border
thumbwidth & thumbheight - Ukuran lebar dan tinggi gambar Thumbnails
fntsize - Ukuran Font pada title
acolor - Warna title
aBold - Tebal huruf pada title? (true or false)
numposts - Jumlah recent post yang ditampilkan?
home_page : http://tekaje-skh.blogspot.com/ (Ubah sesuai URL blog anda sendiri)
setelah itu save dan lihat hasilnya. Semoga tutorial sederhana dari saya bisa bermanfaat bagi temen² semua.

Baca Selengkapnya...

Cara Membuat Template di Blogger

"Cara Membuat Template Blogger". Mulai dari mana ya? nnnngg.. :, tak jelasin dulu deh tentang artikel ini. Gini, dalam trik berikut, kita akan mencoba membuat template yang paling sederhana dan paling mudah. Sebenarnya dalam mebuat template di blogger harus mengerti tentang CSS dan HTML, tapi untuk kali ini kita hanya memerlukan sedikit kemampuan tersebut karena kita akan membuat template yang paling sederhana, tapi jangan salah walaupun caranya sederhana tapi hasilnya bisa sangat luar biasa, tergantung dari desainernya. Ok deh mulai aja deh ya, kayaknya udah pada nggak sabar nih.

Gini, cara termudah dalam membuat template blogger yaitu dengan mendownload sebuah template kemudian kita otak-atik sendiri, Sebelum kita mulai gue saranin lo buat blog baru aja biar gak ngerusak blog asli kamu.

Tahap Desain

Template yang akan kita buat disini memiliki empat komponen utama yaitu Background, Header, Main dan Footer. seperti yang ada dalam gambar berikut:



Jadi kamu harus membuat keempat komponen tersebut. Cara buatnya gimana? kamu harus bisa menggunakan software image editor seperti Photoshop, Corel, Paint dll. Cara pembuatan desainya lebih jelasnya seperti ini:
1. Buat desain seperti gambar diatas
2. Pada bagian background usahakan bersifat "Tile / Pattern" (kecil dan berulang-ulang).
3. Untuk Main dibagi lagi menjadi beberapa kolom, boleh 2 kolom, 3 kolom atau terserah deh. Dan biasanya terdiri dari bagian utama (posting) dan sidebar.
4. Kemudian potong-potong perbagian.
5. Untuk bagian Header motongnya harus full.
6. Bagian background, main dan footer motongnya sedikit aja karena bersifat "tile"
7. Desain diatas kalo dipotong-potong akan menjadi seperti ini :

background
header
main
footer

8. Upload potongan-potongan tersebut pada sebuah webhosting atau layanan penyimpanan file lainya. Contohnya di geocities atau Photobucket dll.


Sekarang kita memasuki ke tahap penyusunan di blogger. gini langkah-langkahnya. Ohya udah di download belum tadi bahanya, kalo belum download dulu diatas itu. Ok kita mulai:
1. Kembali ke blogger dan ke menu "Edit HTML".
2. Trus klik tombol "Brows" untuk mengupload template yg udah kamu donwload tadi.
3. Kemudian Cari kode seperti ini:

body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background: #323232 url('http://kendhin.890m.com/template/bg.jpg') repeat-x top left; }
4. Ganti text yang dicetak tebal dengan lokasi gambar background yang kamu buat.
5. Cari kode seperti ini :

#center {background: #ffffff url('http://kendhin.890m.com/template/main.jpg') repeat-y top center;}

6. Ganti text yang dicetak tebal dengan lokasi gambar main kamu.
7. Cari kode seperti ini:

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

8. Ganti text yang dicetak tebal dengan gambar header.
9. Cari kode seperti ini:

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') repeat-y top center; }

10. Ganti text yang dicetak tebal dengan gambara foter.
11. Masih ada beberapa hal yang harus kamu perhatikan. coba cari kode-kode berikut:

#outer-wrapper { width: 898px; margin: 0px auto 0; text-align: justify; }

kode width: 898px menunjukkan lebar dari blog kamu, kamu bisa mengubahnya sesuai keinginanmu, tapi harus disesuaikan dengan lebar desain gambar yang kamu buat.

#main { float: left; width: 445px; margin: 5px; padding: 0px 0px 0px 10px; line-height: 1.5em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; }

kode width: 445px; adalah lebar daerah main yang berisi posting, kamu bisa merubahnya.

#sidebar { float: right; width: 153px; padding-right: 50px; font-size: 83%; color: $sidebartextcolor; line-height: 1.4em; word-wrap: break-word; overflow: hidden; }
#ads-wrapper {float: left; width: 195px; padding-left: 10px; word-wrap: break-word; overflow: hidden; }

kode width: 153px; adalah lebar sidebar bagian kanan. Dan kode width: 195px; adalah lebar sidebar bagian kiri. Terus kode padding-right: 50px; jarak antara tulisan atau isi sidebar sebelah kanan dengan garis batas kanan. Dan kode padding-left: 10px; adalah jarak antara isi sidebar kiri dengan garis batas kiri.

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

kode height:196px; width:898; adalah ukuran tinggi dan lebar bagian header, kamu bisa menyesuaikannya dengan ukuran header kamu.

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') no-repeat top center; }

kode width: 898px; height:80px; adalah ukuran lebar dan tinggi bagian footer.

12. Nah kalo udah selesai coba di preview template kamu, sudah sesuai kah? atau hancur?
13. Kalo sudah di Save.

:f akhirnya selesai juga aku buat artikel tentang pembuatan template, capek ya? tapi ingat sekali lagi ini adalah metode membuat template yang mudah dan sederhana, jadi sebenrnya isi dari template lebih rumit lagi, munkin kapan-kapan akan kita bahas detail dari bagian-bagina template tersebut.
OK SELAMAT BERJUANG......

Baca Selengkapnya...

Membuat Kotak Komentar Blogger di Bawah Postingan

Begini nih cara membuat kotak komentar blogger yang berada dibawah postingan.

1. Login ke http://draft.blogger.com, Ingat yang http://draft.blogger.com bukan blogger.com.
2. Trus ke menu Setting-->Comments. Kemudian ganti "Comment Form Placement" menjadi "Embedded below post" (lihat gambar dibawah)



3. Kemudian klik "Save Setting"

Sekarang coba kamu lihat blogmu dan coba di klik salah satu postinganmu kemudian lihat hasilnya, apakah sudah ada kotak komentarnya yg dibawah postingan atau belum. kalau sudah berarti langkahnya cukup disini. Kalau belum ikuti langkah berikut ini.
(ini karena kode HTML tiap2 template itu berbeda. Untuk template default dari blogger yang baru, kode HTMLnya sudah berubah, sedangkan template yg lama atau ambil dari luar ada yg belum dan ada juga yg sudah).

4. Selanjutnya pergi ke menu "Layout-->Edit HTML"
5. Beri tanda centang kotak "Expand widget templates".
6. Trus cari kode berikut ini :

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</p>
</b:if>

7. Kemudian ganti kode tersebut dengan kode dibawah ini:

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/> <b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</b:if> </b:if> </p> </b:if>

8. Lalu simpan template kamu.

Baca Selengkapnya...

Membuat foto animasi

dalam kesempatan kali ini akan coba di bahas tentang bagaimana cara membuat animasi gambar ataupun foto. Bagi para sobat yang sudah terbiasa menggunakan program animasi semisal MacroMedia Flash Player ataupun teman-temannya sudah barang tentu bukan hal yang wah ataupun aneh, tapi bagi sekelompok orang seperti saya ini, membuat animasi foto adalah suatu hal yang sangat sulit sekali.

Adakah diantara para sobat blogger yang seperti saya? jika jawabannya ada ya kita emang senasib (hiduplah senasib), tapi jangan dulu patah semangat sobat blogger, pepatah bilang banyak jalan menuju rhoma. dalam hal inipun sama ada jalannya yakni kita bisa menggunakan jasa situs-situs pembuat animasi. Di internet buanyak sekali situs pembuat animasi foto, jumlahnya ribuan atau bahkan jutaan. Nah sebagai contoh yaitu http://www.slide.com. Untuk membuat sebuah foto animasi di slide.com, silahkan ikuti langkah-langkah berikut :

1. Silahkan buka situs www.slide.com
2. Langkah pertama yaitu sobat harus daftar dahulu pada situs tersebut
3. Klik tulisan Sign Up untuk melakukan pendaftaran (daftar gratis)
4. Masukan alamat email sobat pada kolom yang disediakan. isi juga password yang diinginkan
5. Jika sudah, silahkan klik tombol sign Up, dan otomatis sobat sudah masuk ke halaman account sobat
6. Langkah selanjutnya adalah melakukan pembuatan animasi
7. Klik style, untuk memilih gaya dari animasi
8. klik skin, untuk memilih bingkai animasi
9. klik Size untuk memilih ukuran
10. Klik Tombol Select Image, lalu masukan foto/image yang ingin sobat masukan
11. klik tombol Upload untuk melakukan proses upload foto
12. Jika proses upload selesai, klik tombolSave
13. Copy kode HTML yang di berikan, lalu paste pada program notepad
14. Klik tulisan Log Out untuk keluar dari situs tersebut. Silahkan tutup halaman browser
15. Langkah selanjutnya adalah memasukan kode HTML animasi tersebut ke dalam blog,

Baca Selengkapnya...

Membuat Animasi Tulisan Bergaya Ketikan

untuk membuat animasi tulisan seperti huruf ketikan. Caranya cukup mudah dengan menggunakan layanan dari wigflip.com.
Contohnya seperti ini:

Cara membuatnya melalui http://wigflip.com/screedbot. Silakan ketik kalimat apa yang ingin Anda buat. Terdapat setingan untuk mengatur besar banner serta huruf.

Setelah selesai klik Created Screed. Di bagian atas akan muncul animasinya. Silakan simpan animasi gif tersebut. Anda dapat mengupload di blog atau ditempat lain.
Semoga Bermanfaat

Baca Selengkapnya...

Me-nonaktifkan Klik kanan pada Blogger

Pernah melihat dari blog ato sebuah web teman dimana kita tidak diijinkan untuk meng-klik kanan mouse, karena me-nonaktifkan menu klik-kanan pada blog mereka, dapat juga berfungsi sebagai security karena tangan-tangan jail :), berikut ini tip sederhana yang dapat untuk menon-aktifkan menu klik-kanan dari Maximus :

Ikuti langkah berikut ini :
1. Login pada Blogger.com
2. Buka menu Layout - Page Elements - Add a Gadget
3. Kemudian pilih menu "Html/javascript"
4. Copy dan paste Script di bawah ini :

<script language="JavaScript">
<!--

//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com

var message="Sorry Command is not Responding";

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

// -->
</script>


5. Tekan save.
6. Anda bisa merubah pesan tersebut pada script var message=" " ;

Baca Selengkapnya...

Cara Membuat ReadMore Bergambar

Untuk membuat ReadMore bergambar cukup sederhana caranya langsung saja ..

1. Login ke blogger.com
2. Klik Layout/Tata Letak ---> Edit HTML
3. Klik tulisan Download Template Lengkap untuk berjaga-jaga kalau ada kesalahan pengeditan HTML
4. Beri tanda centang pada kotak di sebelah tulisan “Expand Template Widget”
5. Cari kode seperti ini <p><data:post.body/></p> biar cepat klik Ctrl+F
6. Kemudian ganti kode tersebut dengan kode ini :

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>
</b:if>

Keterangan :
Sebelumnya tulisan Read Morenya seperti tulisan yang berwarna biru. Tetapi pada postingan ini kita akan mengganti tulisan tersebut menjadi gambar. Caranya ganti kode “Read More” yang berwarna merah dengan kode ini

<IMG SRC='http://pic60.picturetrail.com/VOL1724/12312346/22573599/376383608.jpg'/>

Jreeng...jadi dech , semoga bermanfaat

Hasilnya :

Baca Selengkapnya...

cara membuat read more pada blogger

kali ini akan membahas tentang cara membuat read more pada blogger atau blogspot...sebenere pengen nyoba sejauh mana SEO Saya,heheh
pengen nyoba dengan keyword " cara membuat read more pada blogger "
malah jadi ngaco neh ngomongnya..hehe...yukx kita kembali ke topik...
disini Saya akan membahas dengan cara yang kilat ya....hehehe
udah lama loh sebenere blogger blogspot membuat cara read more dengan mudah....
yukz kita bahas disini (langkah cepat membuat read more pada blogger):
1. Buka Dashboard
2. Pilih Setting, Pilih Basic
3. Cari Select editor dan centang update editor
4. Pilih Posting and New post
5 Buat artikel seperti biasa,setelah selesai jangan di publish post dulu
6.Cari jarak yang pengen di buat readmore....misal pas pergantian paragraf, Pilih Insert Jump Break...
7.Jika udah keluar garis panjang berarti udah berhasil...
8.silahkan Publih Post dan liat hasilnya..

Baca Selengkapnya...

cara membuat related post bergambar

Related Post bergambar sangat penting karena ini bisa menambah pageviews Blog kita.

Cara kali ini kita tidak perlu mengotak atik template kita yang bikin puyeng dan terkadang membuat template kita rusak,Cara yang ini sangat mudah karena ada sebuah penyedia layanan gratis untuk memasang related post bergambar dalam Blog kita yaitu LinkWithin. Tinggal ikuti langkahnya dan selesai sudah related post bergambar kita selesai. Langsung saja ikuti langkah berikut ini.

Cara Membuat Related Post Bergambar :

1. Langsung saja masuk ke Linkwithin

2. Kemudian akan terlihat Kolom seperti dibawah ini

3. Isikan Data sesuai milik anda. ganti Email dan Blog Link Sesuai blog anda dan email anda.

4. Kemudian Klik Get widget.

5. Pilih Install Widget kemudian akan muncul tampilan seperti ini

6. Ikuti Perintah saja.

7. Selamat Related Post Bergambar sudah jadi dalam Blog Anda.

Jika ada pertanyaan silahkan komentar  ..

Good luck  ,,

Baca Selengkapnya...

Blogger Luncurkan Template Versi Mobile

Cara Mengaktifkan Template Versi Mobile di Blogger
1. Login ke http://draft.blogger.com
2. Pilih Settings (pengaturan) >> Email & Mobile lalu pilih Ya
3. Jika kita ingin melihatnya hasilnya seperti apa, kita klik button Mobile Preview atau Pratinjau Seluler

4. Jangan lupa disimpan dengan mengklik Save Settings atau Simpan Setelan

Bagi kita yang menampilkan google adsense, maka tetap akan tampil dan tampilanya pun akan disesuaikan dengan tampilan versi mobile. Dan mungkin juga bagi kita yang tidak langsung menggunakan template bawaan dari blogger.com tampilannya kurang sempurna. 

Baca Selengkapnya...

Membuat Fasilitas Chatting Di Blog

Membuat Fasilitas Chatting Di Blog ini beragam cara, model dan warna tergantung bagaimana nantinya kita memilih dan mengelolanya. Untuk sebagian blogger membuat dan memasukan fasilitas chatting ke dalam blog akan memberi keuntungan tersendiri. Seperti hal nya yang saya terapkan pada Bunglon Blog Indonesia,
saya membuat fasilitas chatting untuk sekedar sharing secara langsung kepada beberapa sahabat saya. Disini saya menggunakan aplikasi sederhana yaitu chatroll untuk fasilitas chattingnya. Silahkan lihat disini untuk sampelnya.

Jika mungkin sobat tertarik untuk membuat fasilitas chatting di blog dengan menggunakan chatroll silahkan ikuti caranya sebagai berikut

• Silahkan kunjungi website penyedianya di sini untuk registrasi 
• Isi semua data - data yang diminta pada form pendaftaran yang telah disediakan, selanjutnya klik tombol Create My Account yang ada di bagian bawah.
• Pada halaman selanjutnya klik tombol Create a Chatroll dan silahkan beri nama untuk chatroll sobat, lanjutkan dengan klik continue.
• Selanjutnya sobat akan diberikan pilihan untuk menentukan kategori blog sobat, silahkan pilih blog berdasarkan kategori yang sobat gunakan kemudian klik continue untuk melanjutkan.
• Selanjutnya silahkan Copas kode HTML chatroll yang telah disediakank kemudian masukkan kedalam blog sobat dengan menggunakan gadget HTML/javascript atau ke dalam sebuah postingan, lanjutkan dengan klik continue.
• Pada halaman selanjutnya silahkan lakukan setting untuk profil sobat, dan tampilan chatroll jika sobat ingin merubahnya.

<div style="width:430px"><style>.mcrmeebo { display: block; background:url("http://widget.meebo.com/r.gif") no-repeat top right; } .mcrmeebo:hover { background:url("http://widget.meebo.com/ro.gif") no-repeat top right; } </style><object width="430" height="300"><param name="movie" value="http://widget.meebo.com/mcr.swf?id=BwgqNxuFfA" /><embed src="http://widget.meebo.com/mcr.swf?id=BwgqNxuFfA" type="application/x-shockwave-flash" width="430" height="300" /></embed></object><a target="_blank" href="http://www.meebo.com/rooms/" class="mcrmeebo"><img alt="Create a Meebo Chat Room" src="http://widget.meebo.com/b.gif" width="430" height="45" style="border:0px"/></a></div>

semoga bermanfaat, Sukses Buat Kita Semua!

Baca Selengkapnya...

Membuat Buku Tamu yang Buka Tutup

Kali ini rasanya saya membuat judul yang unik dech :D Membuat Buku Tamu yang Buka Tutup Namanya juga buku ya bisa dibuka dan ditutup donk. Yang sudah berkunjung mengisi buku tamu menuliskan namanya, alamatnya dan pesannya. Buku tamu ini dipasang di blog kita. Buku tamu ini lebih populer dengan sebutan shoutbox

Yang banyak diguanakan untuk buku tamu yang kita buat ini akan bisa di buka dan ditutup, jadi terus tampil di halaman blog secara tidak utuh, jika ingin buka tinggal ngeklik dan jika ingin tutup buku tamunya juga diklik aja. Ada tulisan BUKU TAMU yang nempel dipinggir halaman dan tinggal klik untuk buka tutupnya. Untuk membuat buku tamu yang bisa buka tutup ini, silahkan Anda buat widget shoutbox yang bisa didapatkan di shoutmix atau cbox. Di sana kita registrasi dan buat widgetnya lalu ambil kodenya.

Cara Membuat Buku Tamu yang Buka Tutup
1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode script berikut ini:

<style type="text/css">
#gb{
position:fixed;
top:100px;
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/AVvXsEjWaYM9hPA564IeUTAQjBRUyBZPQQIFBrA1rfi4pmuL1f0Bjash3JopYZq6GewyAdzP0YncE6SEfqu6bUrm56ssO8_v_uajbeYjcbmyQGqvdO2dYf1n_RdoojdhKoCZoeUho1__p5c5ULeH/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">

TARUH KODE WIDGET SHOUTOXMU DI SINI

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

Kita taruh kode yang sudah peroleh dari shoutmix atau cbox ditempatnya (TARUH KODE WIDGET SHOUTOXMU DI SINI). Dan Simpan jika sudah selesai.

Baca Selengkapnya...

Membuat Visitor Counter (penghitung Pengunjung)

Memasang Parameter Histats Pada website

Setelah beberapa hari yang lalu saya memposting  cara menampilkan status ym pada wordpress,dan cara menampilkan pengunjung pada wordpress. kali ini saya akan mencoba menjelaskan bagaimana memasang parameter histats pada website.
Untuk mengukur atau melihat seberapa banyak pengunjung yang berkunjung di blog/web yang kita miliki anda dapat menggunakan hitstat.com sebagai penyedia fasilitas ini.
Hitstat merupakan salah satu page counter untuk website . Untuk memasangnya di blog anda perhatikan step by stepnya berikut :

1. Buka terlebih dahulu www.histats.com
2. Register
3. Lengkapi semua formulir register termasuk nama website yang ingin kamu pasang histats dan klik continue
4. Masukkan alamat E-mail anda beserta password untuk confirmasi histats
5. Buka email anda dan klik pesan yang ada pada email tersebut,dan log in ke histats,
6. Isikan data yang ada pada halaman tersebut,seperti nama website anda dll.klik continue
7. Setelah itu create website anda lagi pada tombol add website setelah mengisi semua field yang ada klik create
8. Lalu pilih Get your counter code untuk mendapatkan kode histats.
9. setelah itu pilih category tipe histat sesuai dengan keinginan anda lalu continue lagi
10. Ok !!!
11. Berhasil anda sekarang dapat code histat untuk memasang di blog lalu copy code tersebut
12. Buka blog anda tentunya ke Dasboard lalu ke bagian Appearance
13. pilih tambah gadget lalu cari HTML / Javascript lalu paste kode yang anda copy dari website histats tadi ke widget HTML / Javascript .

<!-- Histats.com  START  (standard)-->
<script type="text/javascript">document.write(unescape("%3Cscript src=%27http://s10.histats.com/js15.js%27 type=%27text/javascript%27%3E%3C/script%3E"));</script>
<a href="http://www.histats.com" target="_blank" title="free website stats program" ><script  type="text/javascript" >
try {Histats.start(1,1372404,4,435,112,75,"00011111");
Histats.track_hits();} catch(err){};
</script></a>
<noscript><a href="http://www.histats.com" target="_blank"><img  src="http://sstatic1.histats.com/0.gif?1372404&101" alt="free website stats program" border="0"></a></noscript>
<!-- Histats.com  END  -->

Setelah anda berhasil memasang Hitstat di blog anda, sekarang mari kita bedah rahasia hitstat tersebut…ok, kemon kang.
Sebelumnya,seperti yang kita tahu seo(search engine optimization),sangat banyak dibutuhkan para blogger.
Mereka berlomba-lomba untuk mendatangkan sebanyak-banyaknya pengunjung dengan berbagai cara dan langkah. Okay, baiklah demi teman-teman netter akan membocorkan rahasia dibalik hitstats ini,dan bukan mustahil lagi jika suatu saat ini,langkah yang akan kita bahas kali ini merupakan kiat membongkar rahasia seo hanya dengan hitstats.
Hitstat maupun counter stats serupa,pada intinya hanya merekam cookies pada komputer anda.

• Pastikan anda sudah memasang hitstat pada blog anda.
• Cara yang akan kita pakai,menggunakan modus delete cookies every page (menghapus cookies setiap tampil halaman ).

Semoga bermanfaat..

Baca Selengkapnya...

Ada Facebook di Blog

Kini bagi anda para blogger yang juga merangkap sebagai facebooker, anda tak perlu repot-repot mengakses 2 situs tersebut secara bersamaan, karena sudah ada widger yang bisa anda gunakan untuk mengakses facebook langsung dari blog anda. Jadi anda dapat menghemat waktu. Berikut cara pemasangannya: 1. Login terlebih dahulu pada account blogmu.
2. Pilih Tata Letak –> Elemen Halaman
3. Klik Tambah Gadget –> Tambah HTML/JavaScript
4. Copy dan pastekan kode berikut pada kolom html:

<em><script src=”http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js” type=”text/javascript”></script><script>if (WIDGETBOX) WIDGETBOX.renderWidget(’54bcd528-3d4f-4f84-8691-631206fd7bd8′;</script></em>
5. Klik simpan.
Nah! sekarang coba lihat blog anda akan muncul widget facebook. Keren kan!!!
Semoga berguna dan bermamfaat…

Baca Selengkapnya...

Membuat Menu Daftar Isi Blog Otomatis

Merasa repot harus membuat daftar isi postingan satu per satu pada blog Anda? Sama seperti saya, terkadang saya merasa kerepotan dan malas untuk membuat judul postingan baru di daftar isi blog ini secara manual. Tetapi saya terbantu dengan adanya menu daftar isi otomatis yang terdapat pada menu navigator di blog ini. Dengan membuat daftar isi otomatis, maka setiap kali Anda memostingkan postingan baru di blog Anda, maka secara otomatis judul postingan baru tersebut akan tampil pada menu daftar isi.

Membuat Menu Daftar Isi Blog Otomatis

1. Login ke blogmu dan pilih “tata letak”.

2. Pilih “elemen halaman” –> “tambah gadget” –> “html/java script”.

3. Copy/paste kan kode dibawah ini : <a href=”http://xxx.blogspot.com/search?max-results=200“>Daftar Isi</a>

ganti teks merah dengan alamat blogmu.

teks warna hijau adalah jumlah judul postingan yang akan ditampilkan pada menu daftar isi,

dan angka tersebut bisa kamu tambah jumlahnya sesui keinginanmu.

4. Simpan dan lihatlah blog mu sekarang… Semoga berguna dan bermamfaat…

Baca Selengkapnya...

Membuat email dengan Domain sendiri powered by gmail

Cara membuat email dengan domain sendiri powered by gmail adalah sebagai berikut :
1. Pertama silahkan kunjungi http://www.google.com/a/cpanel/domain/new

2. Lalu Anda akan menuju halaman formulir, yang bertanda bintang wajib diisi

3. Pada Halaman ini anda di persilahkan memilih account email yang anda inginkan ,(password yang anda masukan harap di ingat, karena pihak sitekno tidak bisa me-reset password email Gmail)



4. Memilih jenis Verifikasi
Pada tahap ini silahkan Anda kopi code google, lalu pastekan di halaman admin Anda (ikuti petunjuk selanjutnya)

5. Pastekan meta code yang Anda copy tadi pada Halaman admin (option) di “custom HTML HEAD tags” sitekno Anda

6. Login pada halaman admin web Anda (www.domainanda.com/admin) Lalu pilih menu “OPTION”
lalu Anda cari Form “Kode Verifikasi Google Hosted Service” lalu pastekan google code yang Anda Copy.


7. Silahkan ikutin petunjuk, seperti pada gambar dibawah :

8. Setelah Anda selesai dengan proses-proses di atas , silahkan menuju URL alamat email Anda, (mail.namadomainanda.com)

Account email Anda akan  berfungsi penuh 1×2 jam sampai 1×24 jam

Baca Selengkapnya...

Cara Mendapatkan Uang Dari Adf.ly (Dapat Uang Bila Link Kita di Kunjungi)

Cara Mendapatkan Uang Dari Adf.ly (Dapat Uang Bila Link Kita di Kunjungi)

tags: terbukti membayar, bukan scam, dapat uang bila di kunjungi, cara dapat uang di internet, dapat uang dari link situs
Adf.ly merupakan salah satu web/situs yang memungkinkan Anda untuk mendapatkan uang dari setiap pengunjung atau orang yg mengklik link anda. Bagaimana cara kerjanya? sebenarnya cukup mudah. Pertama, Anda mempersingkat link dengan situs adf.ly, dan kemudian Anda menyebarnya, mempostingnya atau mengirimkannya kepada teman teman anda,juga bisa di posting di web,blog maupun di forum forum atau juga bisa kamu gunakan untuk blogwalking di buku tamu blog atau situs orang sehingga akan semakin cepat kamu mendapatkan uangnya. $4 per 1000 visitor/kunjungan dan bisa anda ambil setelah $5.

Cara Daftar di adf.ly

1. Klik DiSini atau klik banner di bawah ini

Get paid to share your links!

2. Klik Join Now


3. Isi nama, email, password, centang I agree to...

4. Kemudian Submit
5. Setelah itu buka email kamu kemudian klik link verifikasi yang di kasih adf.ly
6. Silahkan anda Log in, masukkan email dan password
7. Mulai lah mempersingkat URL dan dapatkan uang

Caranya sangat mudah pilih link yang ingin kamu persingkat. Boleh link apa saja, terserah kamu^^ bisa link fb mu atau blogmu atau link situs lain. Setelah link sudah ada, masukkan link nya ke adf.ly kemudian klik Shrink!


Contoh saya memasukkan link http://dedepurnama.blogspot.com setelah di Shrink! Hasilnya http://adf.ly/3YgJ link inilah yang akan kamu gunakan untuk menghasilkan uang^^ kamu sebar di forum, di blog, di jejaring sosial (FB, Twitter, Skype), dll. Link yg di perpendek boleh lebih dari 1. Semakin banyak yang klik link adf kamu maka akan semakin banyak uang yg kamu dapatkan. Uangnya bisa kamu ambil setelah terkumpul minimal $5 dan akan di kirim ke paypalmu. Jika belum punya paypal daftar ja DiSini

Cara Paling mudah biar linknya di klik orang adalah dengan cara blogwalking ala blogger. Jadi masukkan ja link adf mu di buku tamu seperti cbox atau shoutmix yang biasanya ada di blog atau web orang. Seperti gambar di bawah ini

Masukkan nama, link adf.ly mu, dan pesan/komentar kemudian kirim... ntar pasti di klik^^ lakukan seperti itu sesering mungkin. Lebih bagus lagi jika blogwalking di blog orang luar, seperti amerika, canada, dll. Karena klik dari daerah tersebut di hargai lebih besar.

Bagi yang punya blog/web ada cara yang lebih mudah lagi^^ biar link adf kita sering di kunjungi orang. Cara ini dah q coba dan cukup ampuh. Mau tau caranya...
- Pertama tamaKlik DiSini
- Kemudian masukkan data kamu dan blog kamu.
- Ntar Pilih yang Reguler Setup
- Setelah itu tekan Next dan pilih ukuran bannermu kemudian Next
- Klik Next ja terus sampai Default Ads Settings
- di Default Ads Settings masukkan link adf.ly kamu...
- Klik Next sampai ada kode yang di berikan untuk kamu
- Maukkan kode tersebut ke blogmu. dan mulai lah mendapatkan $$$

Selamat mencoba...

Baca Selengkapnya...