Showing posts with label Blog. Show all posts
Showing posts with label Blog. Show all posts

Tips membuat read more ini Saya ambil dari blognya Kang Rohman. OK, langsung saja kita ikuti langkah demi langkah pembuatan post summary.
  1. Silakan login ke halaman dashboard Anda di Blogspot.
  2. Klik menu layout/tata letak.
  3. Pilih Edit HTML.
  4. Sebelumnya backup terlebih dahulu template yang Anda gunakan dengan memilih Download Template Lengkap. Tunggu sampai penyimpanan template Anda selesai.
  5. Beri tanda centang pada tulisan Expand Template Widget, tujuannya agar keseluruhan template Anda ditampilkan.
  6. Salin kode di bawah, kemudian letakkan di atas kode </head>.
  7. Selanjutnya, tambahkan kode berikut ini pada kode template Anda, yang berwarna hitam adalah kode asli dari kode template dan berwarna merah adalah kdoe yang harus ditambahkan.
    <h3 class='post-title'>
    <b:if
    cond='data:post.url'>
    <a expr:href='data:post.url'><data:post.title/>&lt/a>
    <b:else/>
    <data:post.title/>
    </b:if>
    <div class='post-header-line-1' />
    <div class='post-body'
    expr:id='"post-" + data:post.id'>
    <b:if
    cond='data:blog.pageType == "item"'>

    <p><data:post.body/></p>

    <b:else/>
    <style>#fullpost {display:none;} </style>
    <p><data:post.body/></p>
    <span id='showlink'>
    <p><a expr:onclick='"javascript.showFull ("post-" + data:post.id + "");"'href="javascript:void(0);'>[+/-} Selengkapnya...</a></p>
    </span>
    <span id='hidelink' style='display:none'>
    <p><a expr:onclick='"javascript:hideFull ("post-" + data:post.id + "");"'href='javascript:void(0);'>[+/-] Ringkasan saja...</a></p>
    </span>
    <script type='text/javascript'>checkFull ("post-" + "<data:post.id/>")</script>
    </b:if>

    <div style='clear:both;'/> &lt!--clear for photos floats-->
    </div>
    </div>
    .... rest of template code ....
Langkah selanjutnya adalah:
  1. Klik menu Pengaturan.
  2. Klik menu Format.
  3. Salin kode berikut ini, kemudian letakkan pada kolom kosong yang disediakan.
  4. <span id="fullpost"> </span>
  5. Klik tombol Simpan Setting, dan selesai.
Selanjutnya, cara posting artikel:
Ketika kita sedang menulis artikel, buka menu Edit HTML, jangan pilih yang menu Compose, tujuannya agar kode tadi bisa terlihat, yaitu kode:
    <span id="fullpost"> </span>
Untuk artikel yang akan ditampilkan di atas tulisan Read More, maka letakkan tulisan di atas kode <span id="fullpost">, dan artikel sisanya agar tidak terlihat letakkan di bawah kode tadi dan sebelum kode </span>.
Jika Anda memiliki artikel yang pendek, sebaiknya dihilangkan saja tulisan Baca selangkapnya dengan menghapus kode tadi:
    <span id="fullpost"> </span>
Selamat mencoba, semoga berhasil!

Dalam sebuah buku ada yang namanya daftar isi.daftar isi ini berguna untuk menampilkan semua isi yang ada didalam buku tersebut.tentunya daftar isi ini akan sangat berguna sekali untuk pembaca.karena jika banyak tulisan dalam buku itu,mereka akan kesulitan mencari artikel jika mereka harus mencarinya satu persatu.daftar isi ini juga bisa anda tampilkan didalam blog,sehingga akan sangat memudahkan pembaca dalam mencari artikel dalam blog anda.jadi ketika ada pengunjung yang mengklik blog kamu maka akan tampil semua judul postingan beserta tanggal postingan.ok tanpa berlama lama,saya akan ajarkan cara membuatnya
A.langkah pertama1.sigin ke blogger
2.masuk ke layout-edit html...sebelum kita mengedit blog sebaiknya anda copy dulu semua code html anda ke notepad..supaya jadi backup kalo nanti kita gagal
3.copy kode dibawah ini tepat diatas kode ]]></b:skin>

#toc { border: 0px solid #000000; background: #ffffff; padding:2px; width:495px; margin-top:10px;}

.toc-header-col1, .toc-header-col2,

.toc-header-col3 { background: #B5CBFA; color: #000000; padding-left: 5px; width:250px;}

.toc-header-col2 { width:75px;}

.toc-header-col3 { width:125px;}

.toc-header-col1 a:link, .toc-header-col1 a:visited,

.toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link,

.toc-header-col3 a:visited { font-size:100%; text-decoration:none;}

.toc-header-col1 a:hover,

.toc-header-col2 a:hover,

.toc-header-col3 a:hover { font-size:100%; text-decoration:underline; color:#3D3F44;}

.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { padding-left: 5px; font-size:100%; background:#f0f0f0;} 


4.simpan template itu

B.langkah kedua
1.klik page element
2.tambah sebuah element halaman
3.tambah kode html/javascript
4.copy kode dibawah ini dan masukkan kedalam element halaman yang muncul

<div id="toc"></div>

5.letakkan element halaman tersebut tepat diatas element post6.kemudian simpan
7.tambahkan sebuah elemet halaman lagi
8.beri judul element halaman tersebut..bisa daftar isi atau terserah kamu
9.copy code dibawah ini dan masukkan kedalam element itu

<div id="toclink"><a href="javascript:showToc();"><img src="http://amen24.googlepages.com/folder.gif"/>
&nbsp;&nbsp;Lihat Daftar Isi !</a><br/><br/></div>
<script style="text/javascript" src="http://amen24.googlepages.com/daftarisi.js">
</script><script src="http://YOURBLOG.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>


ganti tulisan yang dicetak tebal dengan alamat blog kamu

10.letakkan element daftar isi tersebut ditempat dimana sering dilihat oleh pengunjung

Copyright 2010 My Artikel
Lunax Free Premium Blogger™ template by Introblogger