Thursday, 21 March 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/AVvXsEh8UCJXs1A5DNwP-1AW6SE9QWBDgaCkAKVOQdhyphenhyphenWmQIb51I0doBvf_TLdN-0t9lhzDv6QvAIAId3EqMmm4dZz_1c1oIJ0o701D3iTtFgdSPOvA20soNnw4BcSHwjVP5zZTPB5Tlevd9mFF1/" border="0" >


kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinw5emLF72Vw0Zb8v2CwJYZF2WYLxGW2TpEaatb4FxjQInMHBM7o3Oq2BjoALJzz33_UbO3Uogib7y2NYmQQPfxTS5GSHjze6UnA71v-1s_b6dtBHJfP3qjxzGR-bd41OyBk1coyiwfkfn/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDsi05cTlwojYi9_QXz-zirRWIIxUG5CREga26vmIopm2FMVwuvsaNL6C_QZUGX74WLFUjTOs4okVaG_JmF1iWmJhzHCX6E1NFlLQOouYJwJsvADeGmE-gFX8kGaleTq1leYeFfv7iKYWI/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG0EBzLH4GC7kWwDBllvVJ5MFOPCajfBWlmMr2hEU600Cth8Npn0BVVgyvD-y1OWgYBHWRaivMkzxx8g16rGKwmawOewB5xyJyoyvi9faW4-2yh6TAJdrE2nm4dxuZ-dv-DwTIMFiTEYHu/" 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/AVvXsEjoetqfgj7B5OjHqd3DJZ55xvdw3a5BnbFmN7LVJYGwA1cAhX2MAY7_VScg55NCCrzk4520S3CjCVZJx2fZIdYxng5TksrKQHsYpxLQ4-ZoDsVfuzmj4LjX018gwZz-QJrZh_jcIzPR5_lu/" border="0" /></a>


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihr4iRwt1W7URXoyiUr7ARpCcqsDlrOn2JFweitOT9_F7wcEOv8S4ShYNvtCkBnLOzqfE6Vw8JoWKuvZ5Hw1qjY8XuxZJIvQeh2nosMGKtjBl64GKMHzP-DPtGT4ZEQccfw-zvmNxawP_9/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhP5Ac9IVuImKTu4xHIY_GcYcJQidvWwfwRJ_mYtHE5o4p0ER6i0112-hbknmDQG_wBOha8BrJQBwJIMzmL8XmVyqEuYp2AM0nM-8ktz8Q8QHuLustRxLlj2_ttZlt53jV_lyE_JfbUrlER/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis09eq5nITvMKJZowlFb1x8Y4xRDDGrqVwJ87vvUuvtX5vJzOR5JVToxGq_DC1JMU6FmDx7P8OMrnWFAUvNlIYfxaVUVBdMiHKOIYT7pWKG4kqMXBNppHt_vX4NWZ89tnskn9xOf-LNtAZ/" 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/AVvXsEjCbeVWRqTPy81nFzW6oiEjwrqODCSV8lRINRnFqPH4Bxk9nccbH3LMqnlSvK6W5xc5QO7fuIxW9puG3orxelV-9-xfPzw8Pjf4V95TCiwmkmuWv-aP9tuUs7Mfiob_HQcxstOoBQ8MbLvu/" border="0" />


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


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUKMnn6Qs0GVTBzBwyBzhV5v07ufdCIKmhrxPY-Kw3LA-bcN16eJniKFcVfMrWi5CwRKxpgofyG-Nl7ldXbtWKZLUCnjcJzBcv5JnI9XUb-0U5Wl1F61jiX4OvbFSQLTMv8KeWEJPusU1E/" border="0" />


Kode:
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNcmjzvMiop3hS2Fx1Sav9kDkkrjT8YTMbl8OPtU2GwTHz7i_q2-L2ENJffqJzmpgwwuXxp0Qj5fGneJOhWWaoJj0tnXTWfQqbMgiFispLUiZykK6mEj_CpJWB3s1lEMGBeFX1mbJTi5AS/" 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 sini. Disana tersedia ribuan icon yang bisa anda download secara gratis.

Selamat mencoba..

No comments:

Post a Comment