Cara membuat daftar isi otomatis yang bagus di blog

Cara membuat daftar isi otomatis yang bagus di blog

Assalamualaikum warahmatullahi wabarokatuh
Malam sobat blogger, kali ini saya akan share tentang cara membuat daftar isi di blog yang bagus gan (saya juga googling dan nemu caranya di ariflaw.blogspot.. ya maksudnya otomatis gitu begitu kita posting baru, langsung masuk ke daftar isi, trus juga diurutkan sesuai label jadi teratue sob, terus juga sesuai abjad jadi enak gan ngeliatnya

Sobat bisa ngliat daftar isi saya di http://unik-java.blogspot.com/p/daftar-isi.html 



Daftar isi itu sebenarnya banyak fungsinya, salah satunya buat navigasi, agar pengunjung juga lebih mudah menemukan artikel dalam blog kita.. 

Membuat daftar isi yang saya ajarkan berikut ini ada 2 versi, silahkan mau pilih yang mana..

oke langsung saja caranya :

1. Masuk ke account/ akun blogger anda


VERSI PERTAMA
Yang versi pertama ini anda bisa lihat pada bagian paling bawah sendiri blog saya, dan ini yang lebih saya suka dari versi kedua, sebab daftar isi bukan merupakan laman baru dan dalam bentuk html pada versi kedua. Saya sarankan gunakan yang ini saja.

 

1. Masuk ke Tata letak
2. Tambah gadget >> html java script >> lalu pastekan kode di bawah (yang warna biru dan merah bisa anda edit sesua kebutuhan)



<div style="border: 1px solid rgb(255, 255, 255); height: 400px; overflow: auto; padding: 10px; text-align: justify; width: 200px;"> <script src="http://ariflawblog.googlecode.com/files/daftar%20isi%20blog.js.js">
</script><script src="http://namabloganda.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
</div>

3. Lalu simpan



VERSI KEDUA

1. Masuk ke akun blogger 
2. Lalu gunakan saja fasilitas laman blogger seperti gambar di bawah

3. Beri judul, lalu letakkan kode di bawah di bagian html, ingat! bukan yang compose. Trus kode yang warna merah diganti url blog sobat ya! Nih Kodenya :

<script src="http://ariflawblog.googlecode.com/files/daftar%20isi%20blog.js.js">
</script><script src="http://unik-java.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script> 

4. Kalo sudah klik pratinjau untuk melihat hasilnya, lalu publikasikan.

Selamat mencoba!

   
Wassalamualaikum warahmatullahi wabarokatuh 
Mau Yang HOT HOT

• DISINI
• DISINI

Cara memasang related post/artikel terkait

Cara memasang related post/artikel terkait

Memasang artikel terkait ternyata sesuatu yang penting bagi blogger, selain mempercantik blog bahkan termasuk salah satu tips SEO loh! Lihat saja, terutama di blog blog yang sudah berpagerank tinggi, mreka pasti pasang artikel terkait. Saya ini juga baru tahu  caranya setelah googling, dan mencoba. Itupun gagal 2 kali, akhirnya berhasil dan langsung membuat postingan ini, ngeshare lah, hhe. 

Jadi intinya setelah kita memasang artikel terkait, otomatis di semua postingan di bagian bawah akan muncul artikel terkait/related post. Dengan begitu mau tidak mau setelah mereka selesai membaca satu artikel kita, mereka akan melongok ke artikel terkait karena penasaran, dan peluang pembaca berlama lama di blog kita makin besar hehe.

Namun sebelum saya kasih caranya saya sarankan sobat sebaiknya benar dalam menata label. Sebab itu sangat berpengaruh pada keterkaitan artikel yang muncul nanti.

 Oke langsung saja caranya :

1. Masuk ke akun blog anda > masuk ke template > edit html > centang expand widget template
2. Cari kode </head>
3. Letakkan kode berikut sebelum kode </head> 

<style> #related-posts { float : left;height:200px;overflow:auto; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4k_ifuLA5fpBjDiX5ffNpXdkQV_wjfRm3m2oswsVMN7eLn9MDmNMSiyLaK71KeKEzSXQM6FYVN21w9r-TX5h20_6nMKPRm4WKKmlBF6kQgBKpwQurJgWslNwzP-fNc81gERatAKd5vQI/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style><script src='http://problogizjs.googlecode.com/files/Related-posts.js' type='text/javascript'/>

Lalu untuk langkah berikutnya :

4. Cari kode <data:post.body/>
5. Letakkan kode di bawah setelah kode <data:post.body/>

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


     

#Mungkin diantara teman teman akan menemukan beberapa kode <data:post.body/> yang sama. Coba aja satu satu.




Setelah itu save templates. Semoga berhasil :)
Mau Yang HOT HOT

• DISINI
• DISINI

Cara memasang widget bendera pengunjung di blog

Cara memasang widget bendera pengunjung di blog

Buat blogger pemula pasti pingin kan di blognya dipasang widget bendera pengunjung, seperti gambar di atas, hehe. Saya dulu juga dapat caranya dari mbah google. Flagcounter

1. Pertama masuk sini gan >>>  Flagcounter 
2. Nah trus sobat atur dulu jumlah maximum bendera yang ditampilkan, jumlah kolom bendera dan lain lain. Terserah sobat sih. Kalo udah pilih get your flag counter

3. Trus setelah itu akan diminta alamat email sobat. Ingat ya email yang dimasukkan email blog sobat, bukan email yang gk ada hubungan dengan blog, kan ada orang yang punya banyak email, trus salah masukan emailnya. Gak fungsi deh

4. Copy code yang atas/ pertama (code for website)
5. Masuk ke akun blog sobat >> tata letak >> tambah gadget >> html/javascript >> trus paste kode yang tadi
5. Selesai liaht hasilnya    

Mau Yang HOT HOT

• DISINI
• DISINI

Cara menampilkan sumber artikel otomatis ketika dicopas

Cara menampilkan sumber artikel otomatis ketika dicopas 

Artikel yang satu ini merupakan lanjutan dari artikel saya yang sebelumnya tentang cara meminimalisir copy paste dengan menonaktifkan blok. Sobat blogger pasti tau, bahwa copy paste adalah hal yang biasa ketika kita ingin menambah jumlah postingan kita, maka kita mencari cari artikel yang menarik di google biasanya, trus di copy paste.

Namun kita ini orang Indonesia, mayoritas agama Islam pula. Kita juga harus memiliki etika. Bila kita mencopas artikel orang, baiknya kita menampilkan sumber artikel tersebut. Atau minimal kalau kita takut dosa, kita izin saja pada pemilik blognya dengan berkomentar di artikel yang kita copas misal : "mas saya izin sedot beberapa artikel anda, trimakasih ". Dengan cara menampilkan.

Oke langsung saja cara menampilkan sumber berupa link aktif kita ketika ada orang mengcopy artikel dari blog kita :


1. Masuk ke akun blogger kamu, masuk ke template dan edit html. Lalu centang expand template widget. Lalu cari kode : <body>
2. Kamu bisa cari kode <body> dengan cepat yaitu klik ctrl + f. Nah di atas kode <body> letakkan kode berikut



<script type="text/javascript"> if(document.location.protocol=='http:'){ var Tynt=Tynt||[];Tynt.push('cXIEhKYVSr4lJ5adbi-bpO');Tynt.i={"ap":"Sumber :"}; (function(){var s=document.createElement('script');s.async="async";s.type="text/javascript";s.src='http://infonetmu.googlecode.com/files/sumber-otomatis.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(); } </script>




3. Lalu simpan template. Dan lihat hasilnya
Mau Yang HOT HOT

• DISINI
• DISINI

Cara mencegah copas/ copy paste di blog kita

Cara mencegah copas/ copy paste di blog kita

Bila blog anda adalah blog yang artikel artikelnya anda tulis sendiri atau sebagian besar kalian tulis sendiri pasti kalian akan kesel bila artikel anda di copas orang lain untuk blog mereka. Apalagi mereka tidak izin kita dulu tau tau udah terduplikat artikel yang kita buat. Tapi saya sendiri untuk blog saya yang satu ini tidak menerapkannya karena saya masih bingung bagaimana nanti mereka yang mau bertukar link dengan saya bisa mengcopy kode saya jika saya menonaktifkan blok. Saya masih cari cara, hehe

Nah kali  ini saya akan share pada anda semua cara meminimalisir copy paste pada blog kita, yaitu dengan menonaktifkan blok pada artikel. Jadi artikel kita tidak bisa diblok / seleksi sehingga tidak bisa dicopas, kecuali oleh orang yang ahli, hehe. Nah langsung saja


1. Masuk ke blog / akun anda dan masuk pada template seperti gambar di bawah

2. Pilih edit html >> lalu anda klik ctrl + f  >> cari kode </head> dengan cara ketik kode :  </head> 

3. Centang expand template widget. Lalu copy dan letakkan kode berikut tepat di bawah kode </head> tadi.



<SCRIPT type="text/javascript">
if (typeof document.onselectstart!="undefined") {
document.onselectstart=new Function ("return false");
}
else{
document.onmousedown=new Function ("return false");
document.onmouseup=new Function ("return true");
}
</SCRIPT>




Sehingga hasilnya kira kira seperti gambar dibawah

4. Setelah itu simpan template. Dan lihat hasilnya. Artikel di blog anda tidak bisa diblok.

Mau Yang HOT HOT

• DISINI
• DISINI