Load Cafe: Tutorial Blog

Showing posts with label Tutorial Blog. Show all posts

Memasang Emoticon Kaskus di Blog

Cara membuat emoticon kaskus di komentar

nah, saya updat lagi nie. :D . Saya kali ini aka mengajak sobat untuk Memasang Emoticon Kaskus di Blog. jadi, setiap penggunjung yang ingin berkomentar bisa memasang emoticon kaskus pada komentarnya.

Kaskus merupakan salah satu forumonline terbesar di indonesia. emoticon kaskus ini sangat menarik dan membuat suasana forum terasa sangat hidup. nah, bagaimana kalo seandainya kita

menaruh emoticon ini di blog sobat, pasting banyak tu yang koment-koment di blog sobat. sekaligus blog sobat jadi lebih interaktiv. :D.

Langsung aja yuk kita ke TKP..

1. Masuk ke akun blog sobat.

2. Selanjutnya di dasboard klik Rancangan => Edit HTML dan Centang Expand Template Widget

3. Kemudian cari kode </body> lalu copy-paste kode di bawah ini tepat di atas kode </body>

4. Selanjutnya cari kode <b:include data='post' name='comment-form'/> dan letakkan kode di bawah ini tepat di bawah kode <b:include data='post' name='comment-form'/>

<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddf; height:86'>
<b>
<img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_sm_ilovekaskus.gif' width='50'/> :ilovekaskus
<img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/I-Luv-Indonesia.gif' width='50'/> :iloveindonesia
<img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/cewek.gif' width='50'/> :kiss <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_sm_maho.gif' width='50'/>:maho <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/najis.gif' width='50'/> :najis <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/nosara.gif' width='50'/> :nosara <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/marah.gif' width='50'/> :marah <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/berduka.gif' width='50'/> :berduka <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/malu.gif' width='50'/> :malu: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/ngakak.gif' width='50'/>:ngakak <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_sm_repost1.gif' width='50'/> :repost: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_sm_repost2.gif' width='50'/> :repost2: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/sundul.gif' width='50'/> :sup2: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_big_cendol.gif' width='50'/> :cendolbig <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/s_big_batamerah.gif' width='50'/> :batabig <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/takut.gif' width='50'/> :takut <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/ngacir2.gif' width='50'/> :ngacir2: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/shakehand2.gif' width='50'/> :shakehand2: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/bingung.gif' width='50'/> :bingung <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/cekpm.gif' width='50'/> :cekpm <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/capede.gif' width='50'/> :cd <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/hammer.gif' width='50'/> :hammer <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/peluk.gif' width='50'/> :peluk <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/toastcendol.gif' width='50'/> :toast <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/hoax.gif' width='50'/> :hoax: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/cystg.gif' width='50'/> :cystg <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/selamat.gif' width='50'/> :selamat <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/jempol1.gif' width='50'/> :thumbup <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/jempol2.gif' width='50'/> :2thumbup <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/angel1.gif' width='50'/> :angel <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/matabelo1.gif' width='50'/> :matabelo <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/mewek.gif' width='50'/> :mewek: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/request.gif' width='50'/> :request <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/babyboy.gif' width='50'/> :babyboy: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/babyboy1.gif' width='50'/> :babyboy1: <img class='smiley' height='50' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLG2KKpxJ0ojtbpMF6X2p6rlTNK4NDwkQ62zApjbqClfKBihwZCPZbSo88On_YFWD-Jdwsd7AB1wCLPTLP1i379omY0pcCNVvmR0GgWLYbgYs1x5gvW5jCzJ0Tactp5iQBKVGYlbHvvcU/s1600/bayi+maho.gif' width='50'/> :babymaho <img class='smiley' height='50' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhd2aIzME-WtdXer8FPDuA43E5ediwy0cbupEPbo4hAgDDv8ESeVmA5uQ0c2AmYehC54oWpBbDq3xssjDysZQegTw1UfEfCBEO0Ea7o7e6QQBYpgqoPSnOJas0YYgS7rh9rIKqa2r6R5do/s1600/bayi+ngakak.gif' width='50'/> :babyboy2: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/babygirl.gif' width='50'/> :babygirl <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/sorry.gif' width='50'/> :sorry <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/kaskus_radio.gif' width='50'/> :kr: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/traveller.gif' width='50'/> :travel <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/nohope.gif' width='50'/> :nohope <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/kimpoi.gif' width='50'/> :kimpoi <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/ngacir3.gif' width='50'/> :ngacir: <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/rate5.gif' width='50'/> :rate5 <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/cool2.gif' width='50'/> :cool <img class='smiley' height='50' src='http://static.kaskus.us/images/smilies/bola.gif' width='50'/> :bola </b></div>

5. Simpan Template sobat dan lihat perubahan yang terjadi.

Di atas form komentar sobat sudah terdapat emociton kaskus dan sobat dapat mencoba emoticon tersebut bisa atau tidak. Jika tidak bisa sobat dapat berkomentar di sini agar saya dapat membantu agar masalah sobat dapat teratasi.

Selamat Mencoba

===============================

Source : http://caraonline.blogspot.com

================================

Membuat Related Post

Saya hadir lagi. :D. kali ini saya akan membahas tentang cara Membuat Related Post. Contohnya dapat sobat lihat pada gambar di atas. keren kan.. Gampang aja kok cara membuatnya. asalkan sobat mengikuti dengan baik langkah-langkah yang saya berikan. nah, dari pada kelamaan, langsung aja yuk kita praktek di TKP.

Langkah Membuat Related Post :

1. Silahkan menuju ke mode Edit HTML anda melalui Dashboard blogger ► Layout ► Edit HTML
2. Beri tanda centang pada kotak kecil bertuliskan 'Expand Widget Templates'
3. Cari tag atau kode </head> dan copy- paste kode di bawah ini sebelum kode </head> atau tepat di atas kode </head>

Cari kode <p><data:post.body/></p> . kode pada setiap template biasanya berbeda beda. kode biasanya seperti ini <div class='post-body> atau ada juga yang seperti ini <p><data:post.body/></p> . Sebenarnya kode ini bisa ditempatkan dibagian template yang anda sukai bila anda cukup mengerti tentang coding. Tapi yang pasti cari kode <p><data:post.body/></p> saja dulu. Untuk cara termudah anda bisa menggunakan perintah dengan menekan tombol CTRL+F di keyboard anda dan masukkan kode yang ingin dicari di kotak yang tersedia.

Setelah sobat mendapatkan kode <p><data:post.body/></p>, lalu copy-paste kode dibawah ini tepat di bawah kode tersebut.

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

4. Selanjutnya simpan Template sobat

1. Untuk menempilkan link related post sebanyak mungkin ganti angka yang berwarna biru diatas dengan yang anda inginkan.

2. Untuk mengganti icon di samping kiri link related post, anda harus mengganti kode URL gambar yang berwarna merah dengan URL gambar yang anda kehendaki. Anda bisa menggunakan situs penyedia jasa hosting gambar gratis seperti photobucket dan imageshack atau di blogger sendiri di sini.

3. Untuk mengganti warna atau style hover ( warna atau style yang muncul di related post ketika disorot oleh mouse ) anda bisa mengutak - atik kode css nya. Tepatnya di kode

#related-posts ul li:hover {
background-color:#E2EBF8;
border-top:1px dotted #cccccc;
}

SELAMAT MENCOBA

=========================================

Source : http://creatingwebsite-maskolis.blogspot.com

=======================================

Membuat Daftar Isi Otomatis

akhirnya bisa juga update ni blog. udag lama tidak blogging. :D. langsung aja yuk ke topik bahasan. nah, kali ini saya akan membahas bagaimana cara Membuat Daftar ISI Otomatis pada blog. Daftar isi ini akan secara otomatis meng-index artikel kita, jadi kita tidak perlu lagi repot-repot membuat memasukkan artikel kita satu-persatu ke dalam daftar isi. lansung aja yuk ke TKP.

Untuk membuat daftar isi otomatis dapat sobat lakukan dengan cara berikut ini :

1. Masuk ke account blogger anda
2. Pilih tata letak/layout
3. Pilih tambah gadget
4. Pilih HTML/javascript.
5. Beri Judul Dafar isi atau judul sesuai dengan keinginan sobat

Kopas kode di bawah ini

Ket :
namablog.blogspot.com = Ganti dengan alamat blog sobat.
width:430px : Ganti Lebar sesuai dengan yang sobat inginkan, sesuaikan dengan template.
height:120px : Ganti tinggi nya sesuai dengan keinginan sobat

6. Kemudian save dan letakkan sesuai dengan keinginan sobat.

Jadi, deh daftar isi sobat. Selamat Mencoba.

================================================

Sumber : http://barajakom.blogspot.com

================================================

Membuat I Love Indonesia di Pojok Atas

hy,, sobat. kali ini saya akan mengajak sobat untuk membuat blog/web sobat jadi lebih indah tampilannya. saya akan memberi tahukan bagaimana caranya membuat logo I Love Indonesia di pojok atas seperti yang dapat sobat liat di blog saya ini. langsung aja yuk kita ke TKP.
[-] langkah pertama tentunya sobat harus log in dulu ke blog sobat.
[-] langkah selanjutnya pilih Rancangan =>Elemen laman => Tambah Gadget => html/javascript
[-] setelah itu copas kode di bawah ini

kemudia save. dan sekarang lihat blog sobat, pasti sudah terdapat logo I Love Indonesia. sekian dulu ya sampai jumpa di trik and tips selanjutnya.

Membuat Buku Tamu tersebunyi

Buku tamu tersembunyi merupakan widget yang digunakan untuk menyembunyikan buku tamu. jika di klik maka buku tamu tersebut akan muncul. sebagai contohnya anda dapat melihatnya di blog ini. widget ini juga berfungsing untuk menghemat tempat di blog anda. karena blog ini tidak diletakkan di body melaikan di sisipkan di samping body. Nah ga perlu panjang lebar lagi mari kita lihat cara membuatnya:

Masuk ke account Blogger kamu, pilih "Layout" kemudian "Page Elements",
Klik "Add a Gadget" (yang mana aja oke), kemudian pilih "HTML/JavaScript",
Copy-paste kode di bawah ini:

Selamat mencoba! Terima Kasih Atas Kunjungan Anda..!

Memblokir klik kanan di Blog

terkadang kita ingin blog kita itu tidak bisa di klik orang sembarangan. mungkin hal ini dikarenakan kita terpaksa untuk melakukannya. jika anda ingin blog anda tidak bisa di klik kanan oleh orang lain, saya menyediakan tutorial untuk membuat hal tersebut terjadi. untuk melakukan hal itu silahkan ikuti langkah di bawah ini :

1. Masuk ke Blog anda
2. Klik Tata Letak
3. Klik Tambah Gadget
4. Klik pilihan menu HTML/JavaScript
5. Pastekan script di bawah ini ke dalam kolom konten tersebut
<script>
var message="Maaf, Klik Kanan Saat Ini Saya Disable";
///////////////////////////////////
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>
6. Silahkan ganti script yang berwarna merah dengan kalimat pilihan anda
7. Klik Simpan
8. Selesai
Tapi Kalo Buat Blog yg Menyediakan Tutorial Blogging, Cara ini gak cocok! karena Orang harus Copy HTML yang kita berikan

Membuat Wiget Burung Twitter Beterbangan di Blog

Sebelumnya saya berterima kasih dulu sama System of Blog selaku sumber dari tutorial ini. jika burung twitter ini di klik maka akan mengarah pada akun twitter anda. Jika kalian Mengubah posisi cursor/scrolling maka burung inipun akan terbang berubah posisi. keren bukan??? langsung aja saya kasih cara untuk membuatnya...

1. Login Ke Blogger >> Rancangan >> Tambah Widget >> HTML/Javascript
2. Lalu masukkan Kode ini :

3. Ganti tulisan Biru-Biru (akuntwittersobat) menjadi ID twitter anda

Simpan deh... Burung mu (eh.. bukan burung yang itu..) Jadi dehh....

Trik Menampilkan Total Post, Comment, Dan Online User

akhirnya update juga. setelah capek menghadapi uts di skolah. kali ini saya akan berbagi sedikit Trik Menampilkan Total Post, Comment, dan Online User. Trik ini dimaksudkan agar pengunjung mengetahui seluruh atau total post, komentar dan pengunjung blog kita. Trik ini menggunakan kode javascript yang akan menampilkan seperti pada gambar di atas. Berikut langkah-langkahnya:

Log in akun blogger anda.
Pilih Design kemudian kemudian klik add an HTML/Javascript
Kemudian copy paste kode di bawah ini:

Pages