Subscribe

RSS Feed (xml)

Powered By

Powered by Blogger

Click to view random flickr photos tagged with my junior and nightview!  

WELCOME to Random Flickr photos tagged with my junior and nightview!
www.flickr.com

www.flickr.com

Tuesday, March 27, 2007

New [+/-] Read More...

Endah dan Mr. Cappuccino pernah menanyakan bagaimana cara membuat [+/-] Read More... dan [+/-] Summary only... seperti di blog ini. Aku pernah jawab dengan memberitahu link-nya: Super Peek-A-Boo Posts karena belum sempat untuk menjelaskan, sekarang aku akan coba posting di sini siapa tahu bermanfaat bagi yang lain dan lebih mudah untuk dimengerti.

[+/-] Read More... dan [+/-] Summary only... ini disebut Super Peek-A-Boo Posts, ini pertama kali di hack oleh Ramani tanpa: [+/-] Summary only..., kemudian oleh Hans dikembangkan dengan menambahkan [+/-] Summary only...

Jadi, Super Peek-A-Boo Posts ini kelebihannya dibanding dengan Read More versi yang lama, dia tidak perlu me-loading ulang.

Adapun cara untuk meng-instalnya:

Step 1:
Sign In, masuk ke dashboard, kemudian klik layout tab-edit html, Back-up terlebih dahulu template kita dan jangan lupa kasih centang pada expand widget templates, lalu Tambahkan kode javascript dibawah ini, letakan persis sebelum </head>-tag.


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


Step 2:
Cari kode 'post' di dalam template, dan ubah sehingga seperti dibawah ini. (Tulisan berwarna merah harus ditambahkan ke dalamnya)

<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 ....


kemudian Save template.

Step 3:
Klik Settings tab lalu masuk ke Formatting tab, pada bagian paling bawah pada Post Template ada kotak kosong, copy paste kode di bawah ini ke dalam kotak kosong tersebut.

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


kemudian Save Settings. Selesai.

Pada saat mau posting summary/ringkasan yang mau ditampilkan di muka ditaruh di Type your summary here. atau di atas <span id="fullpost"> kemudian untuk lanjutannya letakkan di Type the rest of your post here. atau diantara <span id="fullpost"> dan </span>

Untuk postingan yang pendek, anda bisa menghapus kode nya pada saat posting, dan seluruh posting akan tampil penuh tanpa [+/-] Read More... dan [+/-] Summary only...

PS: Untuk Endah sudah diimplementasikan- Great! =D> bagaimana dengan Mister? ;)

8 comments:

Anonymous said...

Mas Joni ini emang jagonya tips. Sampai saat ini, saya termasuk yang belon pake read more.

Emang banyak kelebihannya pake ini, orang laen jadi (otomatis)nengok postingan kita sebelumnya...

Read more yang ini kayaknya jalan-nya lebih cepat ya. Kalo diklik langsung "creet" gitu...Cepet.

Tapi kemarin pernah nyoba...masukin kode-kode tsb (via :n:)...malah jadi ancur-ancuran...

Mungkin ntar saya liatin sekali lagi deh....

Anonymous said...

Makasih om... Om joni mang jagonya. makasih info n tipsnya yah. Bermanfaat banget.

Juminten said...

Step 2:
Cari kode 'post' di dalam template, dan ubah sehingga seperti dibawah ini. (aduh, mana ya? Kok ga nemu2?)

Hanya berlaku utk layout yg punya page element saja kah? :(

Joni Poetra said...

@mashuri: ini cuma berbagi info mas, yup read more ini gak me-loading ulang, otomatis lebih cepet dr yg lama.

@n: sama-sama.

@nilla: yup hanya berlaku untuk new blogger (yg ada page new element), kalo blogger klasik, mungkin ada cara yg lain.

just Endang said...

ah...tiap posting hrs melakukan yg step 3 ya? repot dong, om....jadi lebih lama..

Joni Poetra said...

@endangwithnadina: gak tiap posting jeng, itu udah otomatis muncul krn sdh kita dimasukan di formatting box.

Anonymous said...

Sebelumnya saya copy paste kode "Read more...." dari sumber lain, tapi untuk, single page posting , tetap muncul "Read more...."
Thank's, Mas Joni. Saya sudah pakai di blog saya dengan sedikit modifikasi.

siu said...

aku udah bikin sesuai kode diatas n udah sukses tampilannya, tapi kok read more-nya kalo diklik gak bisa nerusin tampilan selanjutnya? any idea mas?ato ada yg tertinggal kah?