Prajurit Batin: Cara Membuat ReadMore Otomatis Menggunakan Icon

Langsung saja di praktekan seperti langkah” dibawah ini.

Berikut langkahnya :

1. Log in blogger.com

2. Dasbor > tata letak > edit HTML

3. Centang Expand Template Widget

4. Cari kode </head> , (agar proses berjalan cepat cari dengan menggunakan Ctrl + F dan akan muncul kolom pencarian di sisi kiri bawah layar anda).

5. Copy kode di bawah ini,dan letakkan tepat di atas kode </head>

<script type='text/javascript'>
    var thumbnail_mode = "float" ;
    summary_noimg = 250;
    summary_img = 250;
    img_thumb_height = 120;
    img_thumb_width = 120;
    </script>

    <script type='text/javascript'>
    //<![CDATA[
    /******************************************
    Auto-readmore link script, version 2.0 (for blogspot)

    (C)2008 by Galaxy Abdul Malik

    ********************************************/
    function removeHtmlTag(strx,chop){
    if(strx.indexOf("<")!=-1)
    {
    var s = strx.split("<");
    for(var i=0;i<s.length;i++){
    if(s[i].indexOf(">")!=-1){
    s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
    }
    }
    strx = s.join("");
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2;
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
    strx = strx.substring(0,chop-1);
    return strx+'...';
    }

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

    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
    }
    //]]>
    </script>

CATATAN :

summary_noimg = 250; adalah jumlah karakter/huruf yang akan di tampilkan pada posting yang tidak bergambar.

summary_img = 250; adalah jumlah karakter/huruf yang akan ditampilkan pada posting bergambar.

img_thumb_height = 120; adalah ukuran tinggi gambar yang akan ditampilkan pada postingan.

img_thumb_width = 120; adalah ukuran lebar gambar yang akan ditampilkan pada postingan.

6. Lalu cari kode <data:post.body/> , (bila terdapat kode tersebut lebih dari 1, misalnya pada template anda mempunyai 2 kode <data:post.body/> silahkan anda ganti kedua kode tersebut dengan kode yang telah disiapkan di bawah dan begitupun seterusnya).

7. Ganti kode tersebut dengan kode di bawah ini (pilih salah satu dari pilihan di bawah) :

a. Readmore otomatis dengan gambar :

<b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://lh6.ggpht.com/_Kwwy9VyLMKw/S3qDYQZCiRI/AAAAAAAACxA/aXY0neVNzh0/but_readmore.png'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://2.bp.blogspot.com/_t47uhxwKFVM/SnvSQRw7t4I/AAAAAAAABtM/6hfRxGK4MMY/s1600/readmore.gif'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://2.bp.blogspot.com/_fqjCZ2SxflI/S90J2q-gpSI/AAAAAAAAAFg/74h0x5Xy38M/s320/a1ifte.png'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://1.bp.blogspot.com/-Q3ok93kIx40/TWPyYyhI43I/AAAAAAAAAV8/RaB518ieoNY/s320/read-more_icon.gif'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://3.bp.blogspot.com/_MBRYgA9HoRE/TU-rmx5FmgI/AAAAAAAAAQE/6xhA9Fni9g4/s1600/readmore.png'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://lh4.ggpht.com/_OzNnI7Y03Iw/S3jOUc9SkkI/AAAAAAAAA94/oKajALH-z-c/1-mini-allblogtools.png'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

    <b:if cond='data:blog.pageType != "item"'>
    <div expr:id='"summary" + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://2.bp.blogspot.com/-LLlEQ3YYECY/TV-CKLoRTbI/AAAAAAAAATs/A-dJUT-njJE/s1600/redmore.gif'/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Selamat Mencoba

1 komentar:

Blog279992 Maret 2020 pukul 15.25
If you're trying hard to lose fat then you absolutely have to try this brand new custom keto meal plan.

To create this keto diet service, certified nutritionists, fitness trainers, and professional cooks have united to develop keto meal plans that are powerful, suitable, price-efficient, and satisfying.

Since their grand opening in 2019, 100's of individuals have already transformed their figure and health with the benefits a proper keto meal plan can give.

Speaking of benefits; clicking this link, you'll discover eight scientifically-tested ones offered by the keto meal plan.
BalasHapus
Balasan

Tambahkan komentar

Jumat, 28 Desember 2018

Cara Membuat ReadMore Otomatis Menggunakan Icon

1 komentar: