Mengganti postingan lama dan baru dengan icon atau gambar

Mengganti postingan lama dan baru dengan icon atau gambar

- Juli 03, 2012

Pada tutorial sebelumnya saya berjanji akan menulis "cara mengganti bacaan postingan lama dan baru yang ada di akhir postingan, dengan sebuah icon atau gambar" yang mana pada tutorial yang kemaren saya telah membuat atau mengganti old post dan new post dengan angka.

Baiklah langsung sajah tanpa ada basa-basi

PERSIAPAN

Ikuti langkah-langkah berikut :

Login ke blogger dengan ID anda
Klik Tata Letak.
Klik tab Edit HTML

PERMULAAN

Persiapkan sebuah icon atau gambar kecil yang anda punyai, lalu upload icon tersebut, ditempat penyimpanan gambar anda ( bisa anda simpan di photobucket, atau semacamnya)
catatlah url gambar tersebut ( ini wajib di ingat karena dengan url ini icon yang kita buat / simpan dapat terlihat di blog kita
kemudian carilah kode script di bawah ini

<span id=’blog-pager-newer-link’>
<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-newer-link"’ expr:title=’data:newerPageTitle’><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond=’data:olderPageUrl’>
<span id=’blog-pager-older-link’>
<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-older-link"’ expr:title=’data:olderPageTitle’><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond=’data:blog.homepageUrl != data:blog.url’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
<b:else/>
<b:if cond=’data:newerPageUrl’>
<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
</b:if>
</b:if>

Perhatikan kode yang berwarna merah tersebut

Gantilah kode

<data:newerPageTitle/>, <data:olderPageTitle/> , dan<data:homeMsg/> dengan kode icon anda. Contoh

<span id=’blog-pager-newer-link’>

<a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-newer-link"’ expr:title=’data:newerPageTitle’><img alt=’Next’ border=’0′ src=’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvK-NwH24jJIuBIyMmjRqRXzeRSAgEexfN3V10twwZg5czCK7hXRqORXPb_EZO7oaSfvTj-rc8mhfp8Zd98xG3u7rlhGUKV4saRbFLdCNQZFrnjUVOng1Qbq5UfhyKnoT2z4FduR1Kks/?imgmax=800′ title=’Next’/></a>

</span>

</b:if>

<b:if cond=’data:olderPageUrl’>

<span id=’blog-pager-older-link’>

<a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + "_blog-pager-older-link"’ expr:title=’data:olderPageTitle’><img alt=’previous’ border=’0′ src=’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU4_hm6Bqr-jAQ-oWDpbO8hlCb3bQns3KjGSuQCs095BGHVhrjGCtz9xJJNmsXbupfGUgWdhs5dL6ELhSOpkzilxErKKB4v5821eayN1W70fsUvNH6JhVBqky0f3ixiHzx75Eq8JVi1iU/?imgmax=800′ title=’previous’/></a>

</span>

</b:if>

<b:if cond=’data:blog.homepageUrl != data:blog.url’>

<a class=’home-link’ expr:href=’data:blog.homepageUrl’><img alt=’home’ border=’0′ src=’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4gnSQIdOv5W72hPXPDZhTN85P_FR70FkNdAJIkkzeTxSnZoA89Gu_4pKmTeLXF895rRzt95C0N3N4AkMUTP1-vecLVAZRoNO1OUuwe4HCwhuIMnO8JHFKTvApWfrYrLxih6ng9D7g4AQ/?imgmax=800′ title=’home’/></a>

<b:else/>

<b:if cond=’data:newerPageUrl’>

<a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>

</b:if>

</b:if>

Klik tombol simpan template dan lihat hasilnya

Komentar