Membuat Auto Readmore Dua Kolom Responsive Di Blogger
AUTO Read more yaitu istilah bagi Jump Break otomatis, yang meringkas posting blog di halaman depan (homepage) secara otomatis.
Dengan auto read more atau jump break otomatis, tampilan halaman depan hanya akan berupa judul, image thumbnail (gambar kecil), dan ringkasan posting (summary/snippet) yang diambil dari alinea pertama tulisan.
Berikut ini cara Membuat Auto Readmore Dua Kolom Responsive di Blogger.
Bagi pengguna template yang sudah memakai auto readmore, yaitu berupa judul, gambar, dan ringkasan bab awal goresan pena di halaman depan blog, arahan ini tinggal dipasang.
Bagi blog yang belum memakai autoreadmore, tentunya harus pasang dulu auto readmore-nya, kemudian pasang arahan di bawah ini.
Nanti balasannya menyerupai tampilan halaman depan template blog legendaris Johny Wuss yang dikenal super seo friendly itu.
Membuat Auto Readmore Dua Kolom Responsive di Blogger
1. Template > Edit HTML2. Simpan arahan berikut ini di atas arahan </head>
<!-- Two Col Start --><b:if cond='data:blog.pageType != "static_page"'><b:if cond='data:blog.pageType != "item"'><style type='text/css'>.post-outer {width:50%;height:auto;float:left;}.post {background: #fff;margin: 5px;padding: 0;height: auto;min-height: 120px;border: none;line-height: normal;font-size: small;}.post h2 {margin: 0 0 5px;border: none;font-size: 13px;font-family: Tahoma;font-weight: 700;}.post-thumbnail img {float: left;margin: 0 10px 12px 0;background: #fff;width: 85px;height: 85px;padding: 0;border: none;box-shadow: none;}@media screen and (max-width:885px){.post-outer{margin:5px 5px 0 0;}}@media screen and (max-width:800px){.post-outer {width:100% !important;float: none !important;margin-top:5px;}.post h2 {font-size:17px;}}@media screen and (max-width: 768px){.post h2 {font-size:15px;}}@media screen and (max-width:600px){.post h2 {font-size:17px;}}@media screen and (max-width:500px){.post h2 {font-size:14px;}}
#blog-pager,.date-header {clear:both !important;}</style></b:if></b:if><!-- Two Col End -->
3. Sesuaikan lebar (width:50%) menjadi lebih kecil jikalau tampilannya kurang baik.
4. Save Template!
Demikian cara Membuat Auto Readmore Dua Kolom Responsive di Blogger.*
Sumber https://testemplatecb.blogspot.com/
