Cara Membuat Read More dan Nama Author Diatas Posting | Buku Catatan si Ugi


Membuat read more di atas posting saya kira belum banyak dilakukan blogger, dalam hal ini tampilan blog pun tentu akan semakin menarik dan para pembacapun  dapat mengakses artikel lengkap dengan sangat mudah. Selain itu anda bisa menghilangkan/ membuang read more yang sudah ada di bawah posting, atau bisa juga tetap dipertahankan. Jika itu yang dilakukan maka dalam blog anda akan mempunyai dua buah read more. Yang satu " di atas posting" dan yang satunyaq lagi berada "dibawah posting"

Selain Read more anda juga dapat menambah nama author. Jadi pada intinya di atas posting (artikel) yang kita buat terdapat nama author dan read more, di sebelah kiri terdapat nama author dan disebelah kanan akan menampilkan read more.

Kita hanya akan pakai sederet xHTML yang bisa langsung di simpan di bagian body. Sederhana, cepat, gampang dan hasilnya mungkin bisa menambah kepuasan kepada kita maupun para pembaca. Sebagai contoh anda bisa melihat gambar diatas.

Baik! untuk langkah langkahnya anda bisa mengikuti tutorial ini,

Membuat  Read More di atas Posting  -  Read More lama tetap dipakai
  • Login ke blogger >>
  • Dasboard/Dasbor : Cari dan KLIK link "Design/Rancangan".
  • Edit HTML-1 : KLIK "Download Template Lengkap" untuk melakukan "back-up" templates. Tunggu beberapa saat kemudian simpan file template di folder PC.
  • KLIK "Expand Widget Templates".
  • Tetap di Edit HTMl, kemudian Cari kode 
    <div class='post-body entry-content'>
    Gunakan Ctrl+F untuk memudahkan pencarian kode!
  • Ganti kode di atas dengan kode HTMl di bawah ini.

<div class='post-body entry-content'>

<div style='border-bottom:1px dotted #444;margin-bottom:10px;padding:1px 0;height:25px;text-shadow:1px 1px 1px #000;'>
<span style='font-style:italic;color:yellow;'>posted by: <span style='color:blue;'>gubhug reyot</span></span>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link' style='float:right;'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title' style='text-decoration:none;'>
<span style='font-family:Cataneo BT;font-weight:normal;font-size:16px;padding-right:20px; background:url(http://i46.tinypic.com/2lcnzt0/gubhugreyot/images/loop.gif) right center no-repeat;'>Read More ....</span>
<!-- <data:post.jumpText/> -->
</a>
</div>
</b:if>
</div>
<div style='clear:both;'/>
  • SAVE Templates/Simpan Template dan selesai.


Membuat Read More di atas Posting - Read More Lama di hilangkan

Caranya sama dengan cara di atas. Kode HTML dan penempatan kodenya pun sama, langkah selanjutbya cari dan hapus kode HTML seperti kode yang terlihat di bawah ini! Kode di bawah adalah kode read more lama yang selama ini di gunakan.

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'>
<data:post.jumpText/>
</a>
</div>
</b:if>

Untuk memudahkan dalam mencari kode di atas, coba cari satu kode dahulu dengan mengunakan (CTRL+F), misalnya: 
<data:post.jumpText/>
Setelah ditemukan maka di atas dan di bawahnya akan terlihat seluruh kode yang dimaksud di atas.
Kemudian simpan template dan selesai.




0 komentar:

Post a Comment



Catatan :

Untuk menyisipkan gambar kedalam komentar, gunakan tag : [img]URL_Gambar[/img]
atau <i rel="image">URL_Gambar</i>
Untuk Video Youtube : [youtube]URL_Video[/youtube]
atau <i rel="youtube">URL_Video</i>
Untuk "Kutipan", gunakan : [blockquote]Kutipan_Anda[/blockquote]
atau <b rel="quote">Kutipan_Anda</b>
Untuk menyisipkan Kode: [code]KODE[/code]
atau <i rel="code">KODE</i>
atau <i rel="pre">KODE</i>
Dan untuk menyisipkan smiles/ emoticon, lihat kode Emoticon







 

Anda sudah mengaktifkan penyaringan konten ( AdBlocker di Aktifkan )

Mohon maaf untuk sementara Anda tidak dapat melihat halaman ini, silahkan kembali lagi setelah Anda menonaktifkan filter yang Anda gunakan. Abaikan