Cara Mengganti Link Older Post dan Newer Post Dengan Icon Gambar

Posted by Blog Onny, Rifki Dan Agil Selasa, 15 Mei 2012 0 Comment
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/AVvXsEjBcQRnrgMN2yegRPGMGI3zDg2Zy_KEMm3pORwwk7t2-SgCkxwosDnPOZOkrSV1c8fnqFbz55_wkW6SKlXAju4zDsuUP9YfBKudzSbiIY-bELM49W3tUB8J15zJ85AKrgwF6288hOqXLCmQ/" border="0" >


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


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirk5A15rugP6pu6iU0eOkOB4CTCL5F3fun2D9QWOLARHUnf5kcjrWoCzbOSwVW2839Rbf_b3IWEgz5qin-XdEwyXShfiA-UhI5IopZzXNI5wiKDlgDQoGNBpGU-o_CKLt37g8beBfNHLR1/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikUVBSvrfASQ-qOh2QiGXeX8SeqJ5JvGNv365i07gRfdTArTAiDON_sNdjg0_m_qpyghHNSLf6Fe2Z_woWZVzVFbL22LVlOQlFeinAnaMNUSMyFNAnuHUJR_KB0LD8SVDzRns2ENesgJL1/" 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/AVvXsEhAhgQbX3ejVQXVHmI9c7gPsSYmCN4WcW3UmoI4ZgSlcmzSe4UzjTIYLbtxrItTeOj9ROR6sDapYGEQic3HmyBPSeeMmC5ewnl8WjbKoGqEdNi3EIX4Myaq0A6WUudSX0InG-fGEm57GPoQ/" border="0" /></a>


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPgPkoab5Sdy1xYWOPrk4xkzEvnoC2CG5kLCd9dOQArcl35EoEb1Jd_pJ3A4UduYrWZo1j_Q8hxKuU32t6rJwhu6tk-1mz6lD1HLO7kP8bNZEF15itNex3829fB3sypRz9PGKOaDdd6gYm/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWETWZ4i4pr8-bcIAesKfpB1nhQTu7J2c7IB2NrssvglnHOCf-eFRbQqVNqVGCVTXgiYjq2Iaf4HK2mKkqu_7JRviklhZgx13DPsbwvlPsjSIWlRJLoLsTycajvHN5u9adYwdAbBStC0mV/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjquO7O4dYqi5EFMLbhq7Wev9skjSb_wzIxG4gsll4Tr1Yow9tQnQfF87oMiOaWPns8RgN27MtYt7omckfoImZKVvrvYdAMAmpj2jlew8jgA_asJxn0izdpHU3drKJtueasW-4_q5dzndx4/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI2IYcE4-zDBmzKnqjfv7ZzBcwlRqv10iL4PZUUnlyXHU2Sx_I1VXE4mE_dCaKiAfO0V4pJnbwAbjfyC-jWcW16rLcFEZbUdClc0Q41kUQsy2W5te5nmoMEnPToLHx3Uw5Utpu3HNrwxni/" 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/AVvXsEikuJT1y7d2u8h-01GFhTL7fCFuSbh-AZWX0DuhRfwKH91848Aak-B9wiSfqfcfEoiktyJ3OGjYh48nxGiEaiPPbBxvXH5oWYXChz4hiwhHSaETN-diqQvoQ_c7dkqigxSk4AUl-bWirWAP/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFhyphenhyphent2rfWkfIwSt7xW1kFYxG0nDkcqRbHCOv5ByfufPuwNDGZdW6Jm6h169oBO6bgtWGMo7JgjxbOv-0hI6xHIX7gvw5eHJLHhgFmYhXeP-Hmp2WiPeLOY6sK4Ho8P8PdgU3wC7P-B4iYK/" border="0" />


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

Posting Komentar