iQONE
1
Background

Auto Read More Grid Style di Blogger Terbaru

2016
Description:
Cara Membuat Auto Read More Grid Style untuk Blog Foto & Vidio ~ Disain atau tampilan blog halaman depan berupa Auto Read More Grid Style di bawah ini cocok buat blog foto atau vidio.
Auto Readmore atau Jump Break otomatis di halaman depan blog dari Exeideas ini bisa di bilang terbaik, karna susunan postingnya berupa gambar ( thumbnail image ), judul, dan ringkasan atau snippet.

Yang ringkasannya bisa dihidden atau di sembunyikan sehingga menjadi gambar dan judul saja.

Cara Membuat Auto Read More Grid Style untuk Blog Foto & Vidio

berikut ini cara membuatnya:

1. Simpan kode berikut ini di atas kode </head>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

 <b:if cond='data:blog.pageType != &quot;static_page&quot;'>

 <style type='text/css'>

 .date-outer .post-outer {width:50%;height:500px;float:left;margin:20px 1% 0px 1%;}

 .date-outer .post-outer .post-body {font-family:Helvetica, Arial;font-size:13px;}

 .date-outer .post-header {margin:0px;}

 .date-outer .post-outer h2.exe_post_TITLE {margin:0px;font-size:18px;font-family:fantasy;font-weight:normal;}

 .date-outer .post-outer h2.exe_post_TITLE a:hover{text-decoration:underline;}

 .date-outer .post-outer img.exe_post_IMG {margin-right:10px;float:left;width:100%;}

 .date-outer .post-outer .exe_post_Desc {font-size:12px;padding: 10px;display: block;}

 .date-outer .post-outer .post-footer {text-align:left;display:block;padding:10px;font-size:11px;}

 .exe_readmore {color:#333333;font-size:13px;font-weight:700;text-transform:uppercase;position:relative;right:0px;float:right;padding:5px;}

 .exe_readmore:hover {background:#333333;color:#ffffff;}

 .post-title, .jump-link {display:none;}

 </style>

 <script type='text/javascript'>

 var exe_summary_count = 250;

 var exe_img_height = 150;

 var exe_img_width = 200;

 var exe_defaultImg = "https://lh4.googleusercontent.com/-fj6pace2cv0/U9Jt75Kq8PI/AAAAAAAARtE/ttg-4YuCOfQ/s250/exe_empty_thumbnail.jpg";

 </script>

 <script type='text/javascript'>

 // Grid Style V2-Optimized Blogger Posts

 // Code Written By EXEIdeas (www.exeideas.com)

 // Copyright 2014. All Right Reserved.

 //<![CDATA[

var _0x8936=["\x3C","\x69\x6E\x64\x65\x78\x4F\x66","\x73\x70\x6C\x69\x74","\x6C\x65\x6E\x67\x74\x68","\x3E","\x73\x75\x62\x73\x74\x72\x69\x6E\x67","","\x6A\x6F\x69\x6E","\x63\x68\x61\x72\x41\x74","\x20","\x2E\x2E\x2E","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x3C\x64\x69\x76\x20\x69\x64\x3D\x22\x65\x78\x65\x5F\x70\x6F\x73\x74\x5F\x44\x49\x56\x22\x3E\x3C\x69\x6D\x67\x20\x73\x72\x63\x3D\x22","\x22\x20\x77\x69\x64\x74\x68\x3D\x22","\x70\x78\x22\x20\x68\x65\x69\x67\x68\x74\x3D\x22","\x70\x78\x22\x20\x63\x6C\x61\x73\x73\x3D\x22\x65\x78\x65\x5F\x70\x6F\x73\x74\x5F\x49\x4D\x47\x22\x2F\x3E","\x3C\x68\x32\x20\x63\x6C\x61\x73\x73\x3D\x22\x65\x78\x65\x5F\x70\x6F\x73\x74\x5F\x54\x49\x54\x4C\x45\x22\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x3E","\x3C\x2F\x61\x3E\x3C\x2F\x68\x32\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x65\x78\x65\x5F\x70\x6F\x73\x74\x5F\x44\x65\x73\x63\x22\x3E\x3C\x73\x70\x61\x6E\x3E","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x64\x69\x76\x3E"];function removeHtmlTag(_0xbb2bx2,_0xbb2bx3){if(_0xbb2bx2[_0x8936[1]](_0x8936[0])!=-1){var _0xbb2bx4=_0xbb2bx2[_0x8936[2]](_0x8936[0]);for(var _0xbb2bx5=0;_0xbb2bx5<_0xbb2bx4[_0x8936[3]];_0xbb2bx5++){if(_0xbb2bx4[_0xbb2bx5][_0x8936[1]](_0x8936[4])!=-1){_0xbb2bx4[_0xbb2bx5]=_0xbb2bx4[_0xbb2bx5][_0x8936[5]](_0xbb2bx4[_0xbb2bx5][_0x8936[1]](_0x8936[4])+1,_0xbb2bx4[_0xbb2bx5][_0x8936[3]]);} ;} ;_0xbb2bx2=_0xbb2bx4[_0x8936[7]](_0x8936[6]);} ;_0xbb2bx3=(_0xbb2bx3<_0xbb2bx2[_0x8936[3]]-1)?_0xbb2bx3:_0xbb2bx2[_0x8936[3]]-2;while(_0xbb2bx2[_0x8936[8]](_0xbb2bx3-1)!=_0x8936[9]&&_0xbb2bx2[_0x8936[1]](_0x8936[9],_0xbb2bx3)!=-1){_0xbb2bx3++;} ;_0xbb2bx2=_0xbb2bx2[_0x8936[5]](0,_0xbb2bx3-1);return _0xbb2bx2+_0x8936[10];} ;function EXEcreateSummaryAndThumb(_0xbb2bx7,_0xbb2bx8,_0xbb2bx9,_0xbb2bxa){var _0xbb2bxb=document[_0x8936[11]](_0xbb2bx7);var _0xbb2bxc=_0x8936[12]+_0xbb2bxa+_0x8936[13]+exe_img_width+_0x8936[14]+exe_img_height+_0x8936[15];var _0xbb2bxd=exe_summary_count;var _0xbb2bxe=_0xbb2bxc+_0x8936[16]+_0xbb2bx9+_0x8936[17]+_0xbb2bx8+_0x8936[18]+removeHtmlTag(_0xbb2bxb[_0x8936[19]],_0xbb2bxd)+_0x8936[20];_0xbb2bxb[_0x8936[19]]=_0xbb2bxe;} ;

 //]]>

 </script>

 </b:if>

 </b:if>
2. Ganti kode <data:post.body/> yang kedua --dan ketiga (jika ada) dengan kode ini:
<b:if cond='data:blog.pageType == &quot;item&quot;'>

<data:post.body/>

<b:else/>

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>

<data:post.body/>

<b:else/>

<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>

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

<script type='text/javascript'> EXEcreateSummaryAndThumb(&quot;summary<data:post.id/>&quot;, &quot;<data:post.title/>&quot;, &quot;<data:post.url/>&quot;, &quot;<data:post.thumbnailUrl/>&quot;); </script>

<b:else/>

<script type='text/javascript'> EXEcreateSummaryAndThumb(&quot;summary<data:post.id/>&quot;, &quot;<data:post.title/>&quot;, &quot;<data:post.url/>&quot;, exe_defaultImg); </script>

</b:if>

<script type='text/javascript'>

//<![CDATA[

var _0x4f05=["\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x69\x6D\x67","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x54\x61\x67\x4E\x61\x6D\x65","\x6C\x65\x6E\x67\x74\x68","\x73\x72\x63","\x2F\x73","\x2D\x63","\x72\x65\x70\x6C\x61\x63\x65","\x42\x6C\x6F\x67\x31"];function resizeThumb(_0x6ad0x2,_0x6ad0x3,_0x6ad0x4){var _0x6ad0x5=document[_0x4f05[0]](_0x6ad0x2),_0x6ad0x6=_0x6ad0x5[_0x4f05[2]](_0x4f05[1]);for(var _0x6ad0x7=0;_0x6ad0x7<_0x6ad0x6[_0x4f05[3]];_0x6ad0x7++){_0x6ad0x6[_0x6ad0x7][_0x4f05[4]]=_0x6ad0x6[_0x6ad0x7][_0x4f05[4]][_0x4f05[7]](/\/s72\-c/,_0x4f05[5]+_0x6ad0x3+_0x4f05[6]);} ;} ;resizeThumb(_0x4f05[8],exe_img_width);//]]>

</script>

<a class='exe_readmore' expr:href='data:post.url'>Read More...</a>

</b:if>

</b:if>
3. Save.

Cara membuat Auto ReadMore Grid Style untuk Blog Foto & Vidio di atas utamanya bagi template blog yang halaman depannya belum berupa auto read more, terutama lagi template bawaan blogger.

Tips membuat jump berak otomatis "biasa" bisa di lihat di Cara Membuat Auto Readmore yang mau saya share hari ini. Terima kasih telah berkunjung, jangan lupa untuk Like dan Share FP untuk berkembangnya blog ini, Terima kasih.
Feed Kategori
Home
Cari Saya