Membuat Posting Read More/Baca Selengkapnya untuk Blogspot

salam sahabat
bagus cara yang praktis ini mas
oh iya makasih dan udah saya follow

mas, saya mau nanya. Kalau kode buat menampilkan gambarnya saja atau tulisannya saja di readmore otomatis ini apa yah? Saya coba utak-atik ternyata tidak bisa dipisah kodenya.

Mohon bantuannya, saya masih newbie :D
Terima kasih.

@Yopi Hasopa Kalau mau menampilkan gambar saja ya tinggal di-nol-kan saja summarynya:

     var thumbnail_mode   = "float",
summary_noimg    = 0,
summary_img      = 0,
img_thumb_height = 100,
img_thumb_width  = 120;

@Taufik Nurrohman Maksudnya gini kang.

Saya ingin menampilkan gambar dan tulisaannya di tag DIV yang berbeda. Sementara untuk kode :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink'><a expr:href='data:post.url'>Baca Selengkapnya</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>

gambar dan tulisannya menjadi satu kesatuan. Saya sulit memisahkannya. Kira-kira bagaimana solusinya?
Terima kasih..

@Yopi Hasopa Oh, nggak perlu mengedit bagian itu kok. Di dalam script utama kan sudah ada markup HTML-nya, tinggal mengedit bagian itu saja:

function createSummaryAndThumb(a) {
var b=document.getElementById(a);
var c="";
var d=b.getElementsByTagName("img");
var e=summary_noimg;
if(d.length>=1) {
c='<span style="float:left;padding:0px 10px 5px 0px;"><img src="'+d[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></span>';
e=summary_img
}

var f=c+"<div>"+removeHtmlTag(b.innerHTML,e)+"</div>";
b.innerHTML=f
}

function removeHtmlTag(a,b) {
if(a.indexOf("<")!=-1) {
var c=a.split("<");
for(var d=0;d<c.length;d++) {
if(c[d].indexOf(">")!=-1) {
c[d]=c[d].substring(c[d].indexOf(">")+1,c[d].length)
}
}
a=c.join("")
}

b=b<a.length-1?b:a.length-2;while(a.charAt(b-1)!=" "&&a.indexOf(" ",b)!=-1)
b++;
a=a.substring(0,b-1);return a+"...";

}

Khususnya di bagian ini:

// Ini bagian thumbnail
c='<span style="float:left;padding:0px 10px 5px 0px;"><img src="'+d[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></span>';

dan ini:

// Ini bagian paragraf
var f=c+"<div>"+removeHtmlTag(b.innerHTML,e)+"</div>";

mas bro saya mu nanya, kalo untuk nampilin gambar + judulnya aja gimana? terus di halaman depan dibagi dua kolom, kaya toko online gitu mas, aku mau buka toko mas,
mohon bantuan terimakasih.

@bahar Hapus kode ini:

var f=c+"<div>"+removeHtmlTag(b.innerHTML,e)+"</div>";

Mengenai cara membelah posting menjadi dua akan Saya bahas lain kali dalam postingan.

@Taufik Nurrohman mas bro kalo pengin posisi tulisannya di bawah gambar gimana? gambar sama tulisan di tengah2, thanks.

@Puri Sefty Coba ini:

<script type='text/javascript'>
//<![CDATA[
var thumbnail_mode = "float",
summary_noimg = 350,
summary_img = 350,
img_thumb_height = 100,
img_thumb_width = 120;

/******************************************
Script Posting Read-More versi 2.0 (blogspot)
(C)2008 oleh Anhvo
********************************************/

function createSummaryAndThumb(a) {
var b = document.getElementById(a),
c = "",
d = b.getElementsByTagName("img"),
e = summary_noimg;
if (d.length >= 1) {
c = '<div class="separator"><img src="' + d[0].src + '" width="' + img_thumb_width + 'px" height="' + img_thumb_height + 'px"/></div>';
e = summary_img;
}
var f = c + "<div>" + removeHtmlTag(b.innerHTML, e) + "</div>";
b.innerHTML = f;
}

function removeHtmlTag(a, b) {
if (a.indexOf("<") != -1) {
var c = a.split("<");
for (var d = 0; d < c.length; d++) {
if (c[d].indexOf(">") != -1) {
c[d] = c[d].substring(c[d].indexOf(">") + 1, c[d].length)
}
}
a = c.join("");
}
b = b < a.length - 1 ? b : a.length - 2;
while (a.charAt(b - 1) != " " && a.indexOf(" ", b) != -1) b++;
a = a.substring(0, b - 1);
return a + "...";
}
//]]>
</script>

kalau untuk meratakan postingan auto readmorenya gimana?
kan gambar diatas terlihat cuplikan postingannya tidak rata (align:left) nah kalau buat jadi rata (align:justify) gimana yah??

@Farid Wajdi Kardbri Letakkan kode ini di atas ]]></b:skin>:

div[id^="summary"] {
text-align:justify;
}

@Taufik Nurrohman wah makasih banyak yah mas :) sekian lama ane tunggu jawaban dari mas... udah keliling nanya sana sini gak ada yang bisa akhirnya sekarang kesampean juga, skali lagi makasih yah mas :)
ane jadi terharu :'(

mas gmana caranya kalo pengen ngembaliin supaya postingan ngga pake readmore, jadi full post lagi?? :)

kunjungan rutin mas taufik...
Pertanyaanya :
kalau artikel tidak memiliki gambar.. pengganti gambarnya pake tambahan script gimana... ??

maaf sob mengganggu udah 2 hari 2 malem nyelesaikan masalah kok gak klar2... menu readmore mengganggu ditampilan page (halaman) mohon pencerahan. ini scriptnya disini http://gudang-informasi-blogging.googlecode.com/files/simple-white-infonetmu.xml

kang bisakah script ini di rubah

$(document).ready(function(){$("img").each(function(){var b=$(this);var a=b.attr("src");b.attr("alt",a.substring((a.lastIndexOf("/"))+1,a.lastIndexOf(".")));b.attr("title",a.substring((a.lastIndexOf("/"))+1,a.lastIndexOf(".")))})});

kalo script ini merename sesuai nama.jpg bisa kah jika di kodisikan dalam blog itu merename blog.title, tanda tanya lain bisakah srcipt itu fokus pada post.body

ditunggu penjelsannya kang

apa benar begini kang

function getTitle(str) {
var a = str.lastIndexOf('/') + 1,
b = str.lastIndexOf('.');
str = decodeURIComponent(str.substring(a, b));
str = str.replace(/\+/g, " ");
return str;
}

var title = document.getElementById('image').src;
document.getElementById('data:post.title').innerHTML = getTitle(title);

nambahin jumlah komentar gimana caranya

mau nanya...
kayak mana cara nya agar auto readmore nya...
ada di halaman laman.... om.... :(

Kalau Metode Readmore Seperti Gambar Dibawah ini Gimana Mas Taufik ...???

Thank you for this tutorial.
I have got a problem in the widget, The problem is when I add an anchor in the article it doesn't show up in home page you need to enter to the article to be able to click on it.
My question is how I can show the anchors in the home page.

Thank you.

Permisi bang, ane kan udah ngikutin sesuai dengan tutorial di atas, tapi kenapa gak ada efek perubahan apa2 ya ?
FYI, Template ane masih dasar atau bawaan dari pertama kali buat blog, terimakasih..

Permisi Mas, saya berhasil memasang auto read more ini, tetapi tampilan responsive untuk gambar didalam postingan saya tiba tiba hilang fungsinya. Lainnya responsif Mas, hanya gambarnya saja. Padahal kode .post-body img sudah saya ganti menjadi .post-body img {
padding: 0;
width:auto;
max-width:100%;
height:auto;
}

Tapi setelah memasang auto readmore ini tidak berfungsi, apakah gara-gara javascript tersebut ya Mas ?
Mohon bantuannya :)