Rabu, 06 November 2013

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/AVvXsEgOanasCPslxk4cCqcf87j5EMoPzl_W-iKjBc6RAxyfQFNxcIeJRQ-nqa6b1Cy5L8PbbstXhyphenhyphenYeWB2JOiCQuRGqc5MzlqB-J_DLVYJZ4Yem9l0XFk6AZ4qG3bWo1x95wt9YrfeRAtOdNqUz/" border="0" >


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDqpt5XwrWwQpD-m_UqkInPYMNxMu44oRsfSu0Z-G8SwpnCViLk2YsYhIL5kmmtBeQWhAtEUx7uRhHFHoFoRIvzSQb-COVSJBA_FWuOtEocMB155XKuIQXQlniATezbbkl5oKcoan76sIZ/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfOQLpTJf4yDm8ZeyfRkjS4MFL8r8diUgKNINTh_A-X357Aw7rCz9gHJ2eBNkVlyMS32YH8LtOUB7t1b3fEv046nZ07VYZKU_c2zf2LQj-tBYQhRuwHdDDeae6vFjJyvn8TCwalKYH1lr1/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJgTdcUeeS9Dr3n178iy5dl9dAWRZU8b3x20ColmCsoY5oCcroFcfG8_WTmCTWQ0F9IYcFgmGymorqi7LZUugBZsBnuzxQLoYbVSK2CvtRif-70-C6e5_NizM6x8hkRlpClIZa67X8FUDb/" 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/AVvXsEis6SLUIW8QK4g-V8PTBTtz81xD6fcwc9r9hjhQf8nXqyQaUdha1JWEyY3d0-I1CeQC87MHqqXmpAPz1WoC-HG-sXJ5k54HA7QhM26DpbS03tgW54MmYXqAqkEVyTn6VnO9Cr-ADVHbS3g8/" border="0" /></a>


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4SkEWyLImh8rBQevvDsfF7858DIQK9l2HdgXGXUkzl0TubDOjKBxmR30-LLbewHME_ejteEBjZ5acjqqmh-5Ujc8oOnKvxNIx97RmU3WFSAHB6GipUoqTGbfSkJsWMnGyYtj9TmvSJ457/" border="0" />


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


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0ymcOjJZxC4KS0GerDMkBUzOIGXn7_vvPX8aCcXgunVqKCMvvZ2RlNKQT6SaivI73nYtbiOSQ4iRaYevyf97qyLdEdxUF0WlsrUJ9z0kdh0dKVpY_c4NMz7Kq4pMCTMtEAdw8OcHD8Fld/" 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/AVvXsEg3YkoYmAxVvyRt-TR2LVsHqZdxBphjlVB09tpzi7iD-G41VG6WaIQ50W0onF2e2-HkKgFYh9MoIg3gYHDpSb-tsBPS-1R7m11d1HFkDTSe0eI1b-mfTvyEfK29Dg0ZqD6hy08AsQVheQJR/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6pvs9bljVkguWGHgtscBAHImwUIQsWwo-HRmrHWMcwuuQ8Bwc5L19EscNEZi2646OzJWwo0W4U1HCbpqaMqppx-wuYHRzdm5EaOKLrgHTYIeWdyM14sda0veQaHBr9PIpFEpUCP6T0kCb/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioyPo_P5e4fUFovq4kn0OJFRoNGaeWxuy9bVyEh5OfzeE4L2cEXiKmFZK5ANo80NUVUMFVzyUPpj1CJqQb0KI4uCKSZbfXefmgnq2CmaF1BWLFPqi3JXVzCKWSU0y5dYlrpZaesH6R9SqA/" 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.

Selamat mencoba..

0 komentar:

Posting Komentar