Tampilkan postingan dengan label Efek Posting. Tampilkan semua postingan
Tampilkan postingan dengan label Efek Posting. Tampilkan semua postingan

Bagaimana Cara membuat Read More otomatis di blogspot?

Bagaimana Cara membuat Read More otomatis di blogspot?

Cara membuat read more otomatis di blogspot sangat mudah. Sebelum melangkah  ke cara membuat read more otomatis di blogspot lebih baik kita tahu apa itu read more? dan apa fungsi read more? Read more dalam bahasa indonesia yaitu " Baca Selengkapnya " dan fungsi read more itu sendiri adalah meminimalis penggunaan halaman blog agar terlihat lebih rapi dan menarik. Read more otomatis ini akan memotong tampilan depan artikel yang panjang dan anda bisa menentukan berapa banyak huruf yang akan ditampilkan di halaman depan, begitu pengunjung membuka Read more atau baca selengkapnya barulah pengunjung bisa membaca artikel penuh blog anda. Sekarang lanjut ke langkah cara membuat read more otomatis di blogspot.

Langkah-langkah cara membuat Read More Otomatis di Blogspot

  • Login ke Blog anda
  • Buka halaman design > Edit HTML > centang Expand template widget
  • Cari kode </head> gunakan CTRL + F untuk mempermudah pencarian
  • Paste kode berikut tepat dibawah </head>
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>
  • Selanjutnya cari kode <data:post.body/> atau <p><data:post.body/></p>  ( seperti biasan gunakan CTRL + F untuk mempermudah pencarian. Jika ditemukan 2 kode yang sama, gunakan atau ganti yang pertama.
  • Jika sudah ketemu silahkan anda ganti kode tersebut dengan kode dibawah ini
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'><img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
  • Finish simpan template dan lihat hasilnya
Cara membuat Read More otomatis di Blogspot ini bisa anda rubah sebagian. Yang bisa dirubah adalah berwarna merah saja dan berikut ini adalah keterangannya :
  1. summary_noimg = 430; apabila artikel anda tanpa gambar satupun maka yang akan tampil pada halaman depan adalah 430 huruf
  2. summary_img = 340; apabila artikel anda berisi gambar maka yang akan tampil pada halaman depan adalah 340 huruf dan gambar
  3. img_thumb_height = 100; ini adalah ukuran tinggi gambar / thumbnail yang akan muncul di halaman depan
  4. img_thumb_width = 120; sedangkan yang ini adalah lebar gambar / thumbnail di halaman depan.
  5. Anda juga bisa mengubah Icon read more http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif silahkan diganti URL icon yang anda inginkan. Atau anda ingin mengubah Icon Read more tersebut menjadi tulisan saja misalnya " >> Read more ", maka anda tinggal menghapus / mengganti kode <img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img> menjadi tulisan >> Read More atau Baca selengkapnya dll.
Semoga artikel cara membuat read more otomatis di blog ini bermanfaat. Selamat mencoba dan semoga berhasil.
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Merubah Warna Teks Saat Diblock Mouse

Merubah Warna Teks Saat Diblock Mouse - Lagi gencar gencarnya posting nih, kali ini saya mau share tentang mouse lagi , tapi ini berefek pada dokumen atau artikel yang kita tulis. Pada saat artikel di Block oleh mouse maka akan terjadi perubahan warna Latar (bakground) dan warna tulisan yang di Block. Demonya bisa anda praktekkan langsung disini dengan cara memblock tulisan ini . efek yang muncul adalah warna background nya menjadi hitam dan warna tulisan menjadi putih. mau tau Cara Merubah Warna Teks Saat Diblock Mouse ? ikuti langkah langkahnya gan :

[-] Masuk dulu ke Blogger.
[-] Pilih deh Rancangan - Edit Html - centang "Expand Widget Template"
[-] Lalu letakkan kode berikut diatas kode ]]></b:skin>

::selection {background:#000000; color:#ffffff}
::-moz-selection {background:#000000; color:#ffffff}
::-webkit-selection {background:#000000; color:#ffffff}

Keterangan :

Untuk kode yang berwarna merah adalah warna background pada saat diblock.
Untuk kode yang berwarna pink adalah warna text pada saat diblock.
Untuk kode warna silahkan lihat disini
[-] Langkah terakhir adalah Save Template.

Cukup sekian dulu penjelasan tentang Cara Merubah Warna Teks Saat Diblock Mouse Di Blogger, semoga ini bisa berguna bagi sobat.
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS