Cara Membuat Related Post Di Bawah Posting

Cara Membuat Related Post Di Bawah Posting - Relate post ini lebih sering dijumpai berada di bawah posting, walau sebanarnya bisa juga diletakkan pada sedebar.
Kegunaan related post ini sangat penting bagi pengunjung guna mencari artikel terkait atau yang berhubungan dengan artikel yang sedang mereka baca.

Jika di blog Anda belum terdapat related post, Anda bisa memasangnya pada blog Anda. Jika ingin memasangsya Anda bisa ikuti bagaimana cara membuat related post di bawah posting.

Di bawah ini adalah kode related post yang bisa diterapkan pada template blog.
Pertama yang harus Anda lakukan adalah login ke blog Anda.

• Pilih blog yang ingin Anda pasang related post.
• Pilih template.
• Kemudian pilih edit HTML.
• Beri tanda pada Expand Widget Template.
• Cari kode :
  

  ]]></b:skin>

  
  
• Letakkan kode warna hijau di bawahnya, hingga hasilnya sepeti ini:
  

  ]]></b:skin> <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <style type='text/css'>
  #related-posts {float:center;text-transform:none; height:100%;padding-top:15px;padding-left:5px;border: 8px double #FFCC66; margin-top:20px;}
  #related-posts .widget {padding-left:5px;margin-bottom:10px;}
  #related-posts .widget h2, #related-posts h2 {font-size:1.6em;font-weight:bold;color:#CC6600;font-family:Arial, Verdana;margin-bottom:0.75em;margin-top:0em;padding-top:0em;}
  #related-posts a {color:#;}
  #related-posts a:hover {color:#;}
  #related-posts ul {list-style-type:none;margin:6px 0 10px 12px;padding:0;text-decoration:none;font-size:13px;}
  #related-posts ul li {list-style-type:none;margin-bottom:5px;padding-left:25px;padding-top:0;display:block;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcjvYK1QCL3LustDlffjmdJytF58rrGH9dHswU8iuP4mT2SV1LVfz4xLSrR-lfAUFqAnhiljAVUCHoqrZt-ka6dhkyj_u8Ju8F0pJuWIzW3sKEl_-62OMf-4UGLQFOMaS_KwcnjnAsJtM/s1600/relatedpost.png) no-repeat;}
  </style>
  <script type='text/javascript'>
  var relatedpoststitle="Related POST";
  </script>
  <script src='http://nimbuzzin.googlecode.com/files/relatedpost.js' type='text/javascript'/>
  </b:if>
  

• Kemudian mouse Anda gulir ke bawah dan temukan kode seperti ini :
  

  <div class='post-body entry-content'>
  <data:post.body/>
  

• Letakkan kode warna hijau di bawahnya, hingga hasilnya seperti ini :
  

  <div class='post-body entry-content'>
  <data:post.body/> <div id='related-posts'>
  <b:loop values='data:post.labels' var='label'>
  <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:loop>
  <script type='text/javascript'>
  var maxresults=7;
  removeRelatedDuplicates();
  printRelatedLabels(&quot;<data:post.url/>&quot;);
  </script>
  </div>
  

• Kemudian Preview atau pratinjau.
• Setelah dirasa aman baru Save template.

Oke sob sambil di coba, sambil minum kopi :), Juga Jangan Lupa Tinggalkan Jejak Sob .. :)

Read More ->>

Cara membuat Form "Email Subscriber" / "Berlangganan Lewat Email"

Cara membuat Form "Email Subscriber" / "Berlangganan Lewat Email" - Hay sob kali ini saya akan berbagi Cara membuat Form "Email Subscriber" / "Berlangganan Lewat Email" . Oh ya, tapi sebelum ke TKP perlu saya dijelasin dulu nih apa fungsi dari form tersebut. Form tersebut fungsinya adalah untuk mempermudah para pembaca blog kita agar bisa berlangganan atau mendapatkan info terbari postingan kita melalui email mereka. Jadi jika memposting artikel baru maka para pelanggan/pembaca yang sudah memasukkan email mereka melalui form tersebut akan secara otomatis mendapatkan kiriman email yang berisi postingan terbaru kita. Mudeng ra? wes pokoke ngono lah.
Beginilah cara membuat form "Email Subscriber" tersebut :

1. Kunjungi situs ini : http://www.feedburner.com

2. Saat pertama kali datang kamu akan langsung disodori kotak untuk mengisikan alamat feed blogmu yang akan dibakar :D

3. Biasanya alamat feed blog kamu seperti ini http://NAMABLOGMU.blogspot.com/feeds/posts/default , ganti tulisan NAMABLOGMU dengan nama alamat blogmu.

3. Isikan nama feed blogmu tadi dalam kotak yang disodorkan tersebut, jika blogmu itu isinya hanya video2 maka beri tanda centang pada kotak "I am a podcaster", jika tidak ya gak usah dicentang. Kemudian klik tombol "next"

 
4. Setelah itu kamu akan disodori lagi dengan form pendaftaran, isikan data2 yg diperlukan disana, trus klik tombol "Activate Feed"

 
5. Nha kalo berhasil nanti akan ada informasi "Congrats! your ......".

6. Dibawahnya akan ada tombol "Next" dan link "Skip directly to feed management" kali ini pilih yang link "Skip directly to feed management", sebenarnya lewat tombol "next" bisa sih tapi biar seru kita lewat jalan lain aja.

7 Kemudian nanti akan ada beberapa menu, kali ini pilih menu "Publicize"

 
8. Setelah itu disebelah kiri akan muncul beberapa menu. PIlih menu "Email Subscriptions".

9. Kemudian klik tombol "Activate"

 
10. Nha setelah itu nanti akan ada beberapa kotak yang berisi kode2. Nha kalo km pinginnya yang berbentuk form maka pilih kode yang ada di kotak "Subsciption Form Code".

11. Copy kode yang ada dalam kotak tadi, trus klik tombol "Save" untuk mengaktifkan layanan tersebut.

12. Cara pasangnya, Login ke blogger, pilih "layout --> Add a Gadget --> HTMl/Java Script" nha paste kode yang sudah kamu copy tadi disana.

Sekarang coba dilihat blogmu, udah ada kan form untuk "Email Subscriber".

Trus kalo mo nampilin jumlah reder yang berlanganan gini caranya :
- Login ke feedburner kemudian pilih feed blogmu
- Trus masuk ke menu "Publicize --> FeedCount" nha disitu scriptnya yang harus km copy dan pasang di blogmu.
- Selsai


Sekian dulu sob artikel kali ini, Semoga bermanfaat ^_^, Jangan lupa tinggalkan jejak ya sob :)

Read More ->>

Cara Membuat Kotak Blogroll dan Marquee

Cara Membuat Blogroll dan Marquee - Oke sob untuk kali ini saya akan bagikan trik Cara Membuat Blogroll dan Marquee, untuk trik ini ada dua macam kotak blogroll yang akan kita buat, terserah kamu mo pilih yang mana. Kotak blogroll-nya yaitu:

1. Kotak Blogroll Model Textarea

Contohnya seperti kotak blog roll seperti punyaku itu, itu lho yg atasnya ada tulisanya "Friend links"
Nha begini cara membuatnya :
Pasang code berikut ini di kedalam element kamu (Page Elements --> Add a Gadget --> HTML /Javascript)

<div style="border: 1px solid rgb(153, 153, 153);
overflow: auto;
width: 200px;
height: 200px;
text-align: center; ">

#link1 <br />
#link2 <br />
#link3 <br />
#link...

</div>

keterangan:
- Kode width: 200px; dan height: 200px; adalah ukuran lebar dan panjang kotak, kamu bisa merubahnya dan menyesuaikanya dengan ukuran yg kamu suka.
- Ganti tulisan "#link1,#link2, #link3 dst" dengan daftar link-link kamu, oh ya itu juga bisa diisi dengan banner link.
- Jika kamu pingin daftar link-linknya berjajar kayak punyaku, maka hilangkan kode <br />

2. Kotak Blogroll Model Marquee

Kotak ini juga mampu menampung banyak link dalam tempat yang sempit. Namun kotak blog roll ini berbeda dengan kotak yg diatas, karena kotak yang ini tidak memiliki rollbar (yg biasanya disebelah kanan trus ditarik keatas kebawah itu lho). Link-link ato isi didalam kotak ini akan bergerak/berjalan, bisa vertikal ato horizontal. Nah gini nih cara buatnya:
Pasang code berikut ini di kedalam element kamu (Page Elements --> Add a Gadget --> HTML /Javascript)

<MARQUEE align="center" direction="up" height="100" scrollamount= "2" onmouseover='this.stop()' onmouseout='this.start()' width="95%" >

#link1 <br />
#link2 <br />
#link3 <br />
#link...<br />

</marquee>

Keterangan :
- Kode "up" itu menunjukan arah pergerakan, kamu bisa menggantinya dengan down, left, right (udah mudeng to artinya, gak usah dijelasin ya).
- Jika kamu menggantinya dengan pergerakan horizontal (left ato right) maka hilangkan kode <br />.
- Angka "100" menunjukkan tinggi dari kotak blogroll kamu. Semakin banyak angkanya maka semakin tinggi pula ukuran blogroll.

OK SOB SEMOGA BERMANFAAT..., Jangan lupa tinggalkan jejak ya sobat :)

Read More ->>

Cara Mengganti Icon Pada Address Bar

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :
Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....
masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

<link href='http://i1309.photobucket.com/albums/s630/Yogie_Firmansyah/icon56_zps60676a3c.png' rel='SHORTCUT ICON'/>

ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif

Semoga bermanfaat sob ^_^ , Jangan lupa tinggalkan jejak ya sob :)

Read More ->>

Triks Cara Mempercepat loading Blog

Hay sobat, Kali ini saya akan menerangkan tentang "Cara Mempercepat Loading Blog". Sebuah blog yang memiliki loading dengan cepat merupakan suatu dambaan bagi setiap blogger. Karena sebagai pemilik blog,ini merupakan salah satu langkah untuk memberikan yang terbaik untuk pengunjung. Jika blog yang kita miliki ternyata dalam menampilkannya "lelet" maka bukan tidak mungkin pengunjung blog tersebut malas untuk menunggu dan berkunjung lagi ke blog milik kita. Perlu diketahui, jaringan internet yang pengunjung pakai mungkin ada yang "ngebut" dan mungkin juga ada yang "lelet".

Untuk mengakali loading biar mempunyai loading yang cepat memang diperlukan langkah-langkah yang tepat untuk mempercepat loading blog. Dalam perkembangannya,pemilik blog dalam usaha untuk mempercepat loading blognya mereka biasanya menghapus beberapa widget/gadget yang dianggap tidak terlalu penting yang ada di blog mereka. Memang cara ini berguna untuk memperkecil unkuran blog sehingga secara otomatis akan mempercepat loading blog. Banyak yang beranggapan bahwa jika sebuah blog yang memiliki ukuran berat yang kecil maka loading blog itu akan menjadi cepat. Dengan kata lain semakin kecil ukuran berat sebuah blog maka akan semakin cepat pula proses loadingnya.

Namun jika ternyata widget/gadget yang ada di blog sobat adalah widget/gadget yang penting dan harus ada di blog dan sobat tidak mau untuk mengahpusnya, maka bagaimana caranya untuk bisa mempercepat loading blog? Dalam masalah ini, sobat tak perlu kuatir karena sobat masih bisa mempercepat loading blog tanpa mengahapus beberapa widget yang ada di blog.Untuk mengetahui caranya,silahkan ikuti langkah-langkah seperti di bawah ini :

1. Silahkan kunjungi http://www.webtoolhub.com/tn561353-website-speed-test.aspx untuk  mengetahui seberapa cepat loading blog sobat

2. Login ke Blogger

3. Klik Template

4. Klik Edit HTML

5. Klik Lanjutkan

6. Cari kode </head> dengan cara tekan ctrl+F di keyboard

7. Copy kode di bawah ini dan letakkan di atas kode </head> 

<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://cuerosb.googlecode.com/files/cueros%20-lazyload.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$(&quot;img&quot;).lazyload({placeholder :
&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIHoIGo3rN4ouco671UobK5P_cuiY991hR8cE-bP-MI79Td2FxXd3AJYNuavaFXYfasOZxIWuFc2hnJTRz9GXzia4bWmVC69Xw-1uKqkN-z6MU99JwOeZ6kQYicscJNAFbL4jYDTf5iRg/&quot;,threshold
: 200});
});
</script>

8. Klik Pratinjau   

9. Setelah klik Pratinjau,jika tampilan blog sobat tak ada yang janggal(baik-baik saja) silahkan  klik Simpan Template 

10. Namun jika setelah klik Pratinjau tampilan blog sobat ternyata "rusak" ada yang "cacat"  silahkan klik Kosongkan Hasil Edit terus klik Simpan Template 11. Silahkan kunjungi lagi http://www.webtoolhub.com/tn561353-website-speed-test.aspx untuk mengetahui apakah blog sobat telah berhasil untuk dikurangi waktu loadingnya..

Semoga bermanfaat ^_^ , Jangan lupa tinggalkan jejak ya sob :)

Read More ->>