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 = "no-float" ; 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 + "#more"'><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 == "item"'>
<data:post.body/>
<b:else/>
<DIV expr:id='"summary" + data:post.id'><p><data:post.body/></p></DIV> <SCRIPT type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</SCRIPT>
</b:if></div>
<b:if cond='data:blog.pageType != "item"'>
<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;
0 Kommentare:
Kommentar veröffentlichen