Cara membuat Readmore Otomatis

Kawan Blogger semua sudah pasti tahu apa itu Readmore / selengkapnya atau apalah namanya yang berfungsi untuk memotong / memenggal isi Artikel, :q; di Home Page, yang pada Template Modern sudah terisi secara tak langsung, begitu juga pada Editor [tempat menulis artikel] juga sudah ada fasilitas dimaksud :z; seperti gambar berikut

karena sifatnya default dan manual yang menyebabkan banyaknya suka kata yang kita potong besar kemungkinan tidak sama :y;

Readmore / Selengkapnya yang saya bahas sekarang ini khusus untuk kawan Blogger yang Blognya tidak berisi Readmore atau untuk kawan Blogger yang ingin mencoba ber-Kreasi dengan Readmore Otomatis seperti yang saya pakai pada Blog ini

Caranya :

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML - Lanjutkan
• Copas Kode berikut diatas ]]></b:skin>

.jump-link a{-moz-border-radius:5px;-khtml-border-radius: 5px;-webkit-border-radius: 5px;float:right;padding: 0 12px; background: transparent; color: #456069;font-style: normal;border:0px solid #333;margin: 0 5px;text-decoration:none;  text-shadow: 2px 2px 2px #FFF; font-family: Segoe Print;font-size: 14px;} 

.more a:hover, .jump-link a:hover{background: transparent;color:#F00;text-shadow: 2px 2px 2px #FFF;text-decoration:none; }

• Selanjutnya copas script berikut diatas </head>

<SCRIPT type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 300; summary_img = 250; img_thumb_height = 50; img_thumb_width = 50; </SCRIPT> <SCRIPT src='https://sites.google.com/site/blogbegocreation/javascript/readmore-otomatis.js' type='text/javascript'/> 

• Simpan sementara Template kawan
• Beri tanda check  disamping Expand Template Widget
  
• Cari <data:post.body/> yang pertama yang kode kurang lebih sebagai berikut 

    <div class='post-header-line-1'/>

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

      <data:post.body/>

<b:if cond='data:post.hasJumpLink'>

      <div class='jump-link'>

        <a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a> 

      </div>

    </b:if> 

      <div style='clear: both;'/> <!-- clear for photos floats -->

    </div>

• Ganti semua script yang saya beri warna Biru dengan script berikut

 <div class='post-body entry-content'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<DIV expr:id='&quot;summary&quot; + data:post.id'><p><data:post.body/></p></DIV> <SCRIPT type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</SCRIPT>    
</b:if></div>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div style='float:right; padding: 0 5px; margin: -5px 0 -15px 0; '>
                  <div class='jump-link'><a expr:href='data:post.url' target='_blank'>Selengkapnya..... </a>
</div></div></b:if>

• Simpan Template kawan

Ini hanyalah salah satu contoh Readmore Otomatis dari sekian banyak model yang ada, silahkan kawan men-Kreasikan sesuai seninya masing-masing :w;

Berbagi Artikel :

Cara membuat Readmore Otomatis

Blog Bego, Kreasi, link, tips trik,

Rate this posting:

{[["☆","★"]]}

Kalau pada Artikel Cara membuat Readmore Otomatis
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---