Pada kali ini saya posting cara mengubah tampilan halaman selanjutnya atau Next Page pada Blog dan megubah tampilan halaman hasil pencarian pada Blog, contohnya pada blog saya ini tadinya hasil pencarian dan hasil halaman berikutnya/Next Page, tampilan halamannya seperti gambar di bawah ini
- Yang tampil hanya Judul saja.
- Jika Blog anda kasusnya seperti tampilan gambar di atas, untuk cara mengubahnya ikuti langkah - langkah di bawah ini.
- Login ke Bloger.
- Klik Tema kemudian klik Edit HTML
- Sebelum edit HTML sebaiknya Back Up terlebih dahulu.
- Kemudian cari kode di bawah ini
- <b:include data='post' name='post'/>
- Jika kode telah di temukan ganti kode tersebut dengan Kode di bawah ini
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.searchQuery'>
<br/>
<div class='search-result'>
<a expr:href='data:post.url' ><data:post.title/></a>
<div class='link-snippet'><data:post.url/></div>
<div class='item-snippet'><div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script async='async' type='text/javascript'>createSnippet("summary<data:post.id/>");</script></div></div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:if cond='data:blog.searchQuery'>
<br/>
<a expr:href='data:post.url' ><data:post.title/></a>
<div class='link-snippet'><data:post.url/></div>
<div class='item-snippet'><div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script async='async' type='text/javascript'>createSnippet("summary<data:post.id/>");</script></div></div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
- Setelah itu cari Kode </style>, Copy dan pastekan kode CSS di bawah ini tepat di atas kode </style>.
.search-result {margin: 0px 40px;padding: 0px 0px 20px 0px;}
.link-snippet {font-size: 13px;color: #09a000;}
.item-snippet {font-size: 13px;}
.search-result a {color: #1a0dabf;font-size:18px;}
.search-result a:hover {color:#1a0dab;text-decoration:underline !important;}
.search-result a:visited {color:#7e1a8b;}
.link-snippet {font-size: 13px;color: #09a000;}
.item-snippet {font-size: 13px;}
.search-result a {color: #1a0dabf;font-size:18px;}
.search-result a:hover {color:#1a0dab;text-decoration:underline !important;}
.search-result a:visited {color:#7e1a8b;}
- untuk text yang berwarna Merah Modifikasi sesuai keinginan anda
- Kemudian klik Simpan template dan lihat hasilnya
Hasil pencarian / search box Pada Blog (Tampilan Desktop dan Mobile)
Hasil halaman selanjutnya atau Next Page (Tampilan Desktop dan Mobile)
- Selamat Mencoba dan Semoga Bermanfaat
