Cara Mengganti Tulisan Older Post, Newer Post Dan Home dengan Icon Gambar

No ratings yet.

Cara Mengganti Tulisan Next Selanjutnya Newer Post, Previous sebelumnya/ Older Post Dan Home Beranda dengan Gambar icon keren dan responsive. Halo sobat blogger kali ini admin akan membuat tutorial mengenai cara menganti icon next previous dan home, dengan gambar. Mungkin ada beberapa dari teman teman yang ingin sekali merubah icon tersebut dengan desain gambar milik sendiri.

Setiap template blog pasti memiliki yang namanya pagination number. Ada yang berbentuk nomor, dan ada juga yang hanya mempunyai newer dan previous. Di setiap template pasti beragam karena bentuknya juga pasti berbeda beda. Untuk merubah paggination seperti ini sangat mudah. Sekalian juga untuk mempercantik bagian homepage blog agar terkesan lebih professional.

Mengganti halaman selanjutnya atau sebelumnya pada blogger sangat lah mudah sekali. Mungkin juga jika teman teman ingin sekali menggunakan icon gambar yang sudah saya buat seperti ini.

older post newer post

Sebagai contoh, demonya ada di gambar atas. Kalau sobat suka dengan tampilan tersebut, sobat juga bisa custom gambarnya sendiri. Tidak harus mengikuti gambar diatas juga. Baiklah kita akan masuk ke bagian prakteknya.

Cara Mengganti Pagination Menjadi Icon Gambar

Nah untuk pembuatannya silakan simak langkahnya berkut ini :

  1. Silahkan login ke akun blogger anda
  2. Silahkan pilih menu TEMA >> EDIT HTML
  3. Jika sudah silahkan tekan CTRL+F lalu cari kode berikut ini :
expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
Keterangan: Posting Lebih Baru(Previous)
expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
Keterangan: Posting lama(Next)
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
Keterangan: Beranda(Home)

Atau jika tidak ada kode diatas temukan kode berikut :

<data:newerPageTitle/>
<data:olderPageTitle/>
<data:homeMsg/>

Jika sudah ketemu, Silahkan ganti kode tulisan diatas dengan kode gambar berikut ini

expr:title='data:newerPageTitle'><img src='https://2.bp.blogspot.com/-pKkwftQRyWY/WnfriFc1LCI/AAAAAAAAANU/aSkO9AlbO_4QCQRVJLp4bBf7MhpmLMUywCLcBGAs/s1600/icon%2Bnext.png' /></a>
Keterangan: Posting Lebih Baru(Previous)
expr:title='data:olderPageTitle'><img src='https://1.bp.blogspot.com/-C8ykprsjr0I/Wnf2awqRZUI/AAAAAAAAAN4/r5Q-T6YxgCA04rRCYF1ZpIvdTdTrOpE8gCLcBGAs/s1600/Next%2BBlack.png' /></a>
Keterangan: Posting lama(Next)
<a class='home-link' expr:href='data:blog.homepageUrl'><img src='https://2.bp.blogspot.com/-j8DP-aFt-CU/Wnf2a9Sw1hI/AAAAAAAAAN0/5lnrS71fBaoNVzeBUSJPKrUrJoXg1tqnwCLcBGAs/s1600/gfgsf.png' />

</a>
Keterangan: Beranda(Home)

Tambahkan Meta Tag Img Src Mirip Seperti Diatas.

Lalu Simpan Tema.

Jika teman teman hanya ingin menganti tulisan saja seperti selanjutnya, seelumnya dan beranda. Maka teman teman cukup mengganti kodenya menjadi seperti ini.

expr:title='data:newerPageTitle'>Sebelumnya</a>
Keterangan: Posting Lebih Baru(Previous)
expr:title='data:olderPageTitle'>Selanjutnya</a>
Keterangan: Posting lama(Next)
<a class='home-link' expr:href='data:blog.homepageUrl'>Beranda</a>
Keterangan: Beranda(Home)

Itulah tadi cara untuk praktek cara mengganti icon pada pagination blog. Memang setiap blog mempunyai struktur meta yang berbeda beda. Silahkan sesuaikan dan juga point point penting yang dibagikan.

Bagaimana sobat mudah bukan ??. Itulah tutorial mengenai Cara Mengganti Tulisan Next Selanjutnya Newer Post, Previous sebelumnya/ Older Post Dan Home Beranda. Dengan Gambar icon keren dan responsive semoga informasi ini dapat membantu. Dan silahkan kalian praktekkan di blog masing masing.

Nilai Kualitas Konten