BREAKING NEWS

Download

Friday, December 29, 2006

Postingan super-peek-a-boo

Elu bisa manjangin post dari mode summarry ke full post, bikin collapse juga bisa, dan kalo elu nggak punya post summary di pos-an elu, maka link "Read More..." dan "Collapse" enggak muncul juga,pokoknya asyik deh....

Kayak lu bisa lihat di pos ini, dimulai cuman summary doang, terus diembel-embeli link 'Read more...'. Kalo lu ngeklik link itu maka akan terhampar full post. Sekarang coba lihat dipalign bawah disitu ada link 'Summary only...', yang meng-collapse pos kembali ke bentuk summary.

Hack ini pertamakali dibikin sama Ramani di Hackosphere. Cuman ditambahin dikit biar bisa di collaps-kan.

Caranya begini nih :

Langkah 0:
Back-up template lu seblum lu utak-atik lebih lanjut!

Langkah 1:
Tambahin kode javascript berikut di bagian head template lu. Tarok tepat diatas tag </head>.


<script type='text/javascript' src='http://www.anniyalogam.com/widgets/hackosphere.js' />


Langkah 2:

Cari includable yang bernama 'post' di template elu, dan ubah tepat seperti koding dibawah (kode yang berwarna merah yang harus ditambahin):


<b:includable id='post' var='post'>
<div class='post'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</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);'>Read More...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Summary only...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
.... rest of template code ....


Sekarang, save template elu !

Langkah 3:
Di bagian tab Settings - Formatting ,lihat dibagian paling bawah dan masukin post-template berikut ini :

Type your summary here.
<span id="fullpost">
Type the rest of your post here.
</span>



nah sekarang tiap post baru yang elu bikin akan berbentuk fullpost-span secara default. Jika postingan elu pendek, lu tinggal ndelete tag <span>
dari postingan eluh. ostingan elu bakal tampil penuh, dannggak ada link "Read more..." atau "Summary only".

Bagaimana cara kerjanya (skip bagian ini jika elu gak suka yang rumit-rumit).
Perubahan yang elu buat membikin setiap post-body terdiri setidaknya 3 span: fullpost-span that yang udah lu masukin di post-template, sebuah span untuk link 'Read more', dan sebuah span untuk link 'Summary only'. Karena mungkin ada span yag lain di postingan elu, maka setiap masing-masing 3 span punya id unik ('fullpost', 'showlink' dan 'hidelink' secara berurutan).
Pas elu buka blog elu di halaman utama, maka postingan elu bakal tampil kayak gini:


* Summary ditampilin (selalu)

* Full text disembunyiin (pertama div, lalu diset ke display:none)

* Read more terlihat (div kedua)

* Summary only disembunyiin(div ketiga, diset ke display:none)


Poatingan elu selalu punya id khusus, dan jika id akan nglewatin fungsi javascript showFull dan hideFull berurutan. Funsi tersebut menggunakan metode getElementsByTagName buat nanganin span itu, dan kemudian men-toggle cara mereka ditampilin.sebuah fungsi ketiga, checkFull, mmeriksa apakah sapn Fullpost itu ada. Jika nggada, kedua link itu bakal disembunyikan.

6 comments :

  1. Assalamualaikum,
    Numpang pinter lagi kakang prabu..

    ReplyDelete
  2. gila... scriptnya jitu brow!!!!

    entah bagaimana ana harus mengucapkan terima kasih, tapi kapan2 kunjungi blog ana ya. kali aja Anda mau ngasih kritik mengenai blog ana...

    ReplyDelete

Trimakasih dah komen lho ! Kenapa gak sekalian langganan liwat email ajah ? Kan enak tuh, gak mesti ngebrowse ke sini, tiap ada posting baru tinggal buka email udah bisa deh baca bikinblogger. Klik ajah di sini.

Langganan

Suka dengan postingan diatas ? Langganan aja lewat email, gak perlu buka internet bisa baca artikel terbaru di bikinblogger deh...caranya gimana ? Ya tinggal klik di sini
 
Copyright © 2014 Bikin Blogger Share on Blogger Template Free Download.