Senin, 29 Agustus 2011

Cara Mengganti Link Older Post dan Newer Post Dengan Icon Gambar

Secara default, setiap template blogger akan dilengkapi dengan link older post dan newer post yang masing-masing berfungsi untuk menampilkan postingan lama dan baru.

Nah agar tampilannya lebih menarik, anda bisa menggantinya dengan icon-icon mungil. Contohnya seperti gambar dibawah ini.


Menarik bukan? Klu anda tertarik silahkan ikuti langkah-langkah dibawah ini

1. Pada menu klik Design -> Edit HTML
2. Biar aman backup dulu template anda dengan klik Download Full Template
3. Beri tanda centang pada kotak "Expand Widget Template"
4. Lalu cari kode <data:olderPageTitle/>5. Kalau sudah ketemu ganti kode tersebut dengan kode icon dibawah ini.


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnNYgi6nGg5H60ImcRE7Ww9yWrmlwwfIrilnz5u5dLzvQ7nDKd99mwbYbTEnoUUAx2vFEJZFnICusgYKx87zzfxhlNAlLJ1vH5f_UMf1Evva514AgQs3SpkRWxKucQJhY8sGHIPpbyJ4Pq/" border="0" >


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZqQVSL9VMVaXUzuRYQGdYh1Its0Gf2SiVHEBYIYjNj_Y4iKKkHlIf5HajpwoKD_p0uggdTGwiwh68wLl_0cXwTW7Qz_DHP5sau2waf0pteqUDyUW-fRYYcojMWAv_uH8bOmmFp2mqygFV/" border="0" />


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5iEGBH8IGEvxm9gWzVgjl2rSm1bQZ2CKp9W6flsVXfAz7iVODeklEZBoWlDiaX3uP8AMLRevZwzRz6-38QwXsJLRrF7f6zY3MsHbqr9LxaKQM4LSMKl1pJl997BeTe-8KoRL5XJGgDTix/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGFuJGy5yn8QWGkgmzN24byLSv0DsWDwWaH2mphpMZ3GJ1mJyv3eBZp38uNfL93oQ-l6Cvf12t9h2HauX-qfrnAuqloPJmOlC2Ud1j87DyOliKoH9sNXneIAe8jJJJddug-V6rSQIZf7Ew/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRa86S_lIb9qV7_boa4LXuVVtE-exri2eeOqtpWIECICwUrVRwQBNJ7nDgGeI831itxa_hMy68qDSj7_OmsKz-b-NYJb2xS9j8XWzlDxCjkwQu3-_CgolVlxFzYpg2sy2r_uKc0fqWsNku/" border="0" />

6. Contohnya anda mau menggunakan icon maka ganti kodenya dengan <img src="http://i37.photobucket.com/albums/e74/mrphoto16/herman%20blog%20icon/bt-right.png" border="0" />

7. Untuk mengganti link newer post. Cari kode <data:newerPageTitle/> lalu ganti dengan kode icon dibawah ini.


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWHdhBOz5i1D_jzB42OmvSmk_iuBGMUI70WM4Dt_9qL-oH4nep96159bOGJs5DXllqS4sTGNWoCxVMq8QTZjeSChUkBUsp6zA31hU5rIPOaVlULRorologj_NAD9H1NKwKk_7zLBOq4lWT/" border="0" /></a>


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht8_QaOehkwCdYgaG2fD7DDACUEOSDE1WdLl-mgQeBSVPbU5Kb7jwY1piifUsI6nlOYwSwTZmn9GQDuXvuCEZ6_qurwZslKOQsHQ8GTfNALaB1wQSdZTi-niv9zVCadYuKHQwUsl_TLxal/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi24iF8EyFsoXXoJEiN6ft1_0w4UN82-kJ_mjgaMMpHJEq3dFChZp6JcGQEeMAzCZbJxZO3tn3ylm7QGjYBSan9x-EAWx-fPvsfverUmypgDnyCLYui3ELovl-CoKIixLfdx4hKenc3OQ_y/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_Usx7Hp6ZAGLmZGTtYsWgMeJGBoNW7-gqqLRRg7QKCzqMZzVCYDQUABhOJtjTbmqEdc425qz1AuXKGo3x1aAXdPY5G1W4wfXcksGw7VX8IaHPYP0fdOCJmEQUcSjytpMbVjDVp7JCJW3L/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2c3b7Qd83uQ32ZExlBI6J4C2zaawrbfaaZdKdDDA8csWNNd9AIzHKq3dIHReHweEBbTSihXGPqtbRIaT61-MHLrJP00RBtScwCl4XCFI46E_rR5kmGqOVNR0jSkZB1DiuxPVkc3dJsGJn/" border="0" />
8. Sepertinya kurang maknyus jika tidak mengganti link home-nya. Ok, untuk mengganti link home cari kode <data:homeMsg/>. Biasanya ada 2 kode yang sama. Ganti kode yang pertama dengan kode icon dibawah ini.


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcgAxYV8VpR_SylVSnwCdoC5ZktmJlvGmJf-71KBMctLDmKgtD4zCMcjoSq5ByKwPUkummPC6r2AxSB9yqBYlaM-e1kWogbQ1AeOAogDH8RpD0yZcRgnaD7zfaiMXM_X5oD1WGs0qGt014/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYaZTxJkwYs_HzIcnXPOqUPa16A3RnU2koyBYPX0RdspaqGhn-ls9v0rD9uNqztr1i_ft7nhU2y1RXPsPrpN85WbQOpc7B9VUQPhPj30yb7pTdQwgrGUn0SPqVR6XOqV4LDUIjHX9Nmp6g/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguWjMVhIHcdYJyfgRMHXvbl8ZVao3jMLr9IbTtD-3weSoEymnQy6UmF6CwmH_PlUXA2Rytr644hxoVLDQ4yCdbuTXcfxBVGMGJrIdoEGr3GmBqys06r5tAFCVuBgAnhZqwaHjQseyd61r5/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNEv-fkMO4Ql3fbYt1FM7-E4mSehILgLMFG1b7EdGdRgtdgFXgZR0znJO4OZO93fANas-A64B-7xvCWOlDN24RFS-QqkkSuVUXKlPpsBR-k7zdRKoUtXbM0VolpAPd26F_U-3O4jsW7MZl/" border="0" />
9. Setelah itu, klik Save Template.
10. Selesai. Silahkan klik View Blog untuk melihat hasilnya.

Untuk mendapatkan icon-icon cantik lainnya. Coba kunjungi http://www.iconarchive.com. Disana tersedia ribuan icon yang bisa anda download secara gratis