Pages

Cara berkreasi menganti Tulisan Postingan Baru dan Postingan Lama

Di artikel sebelum nya kita pernah membahas tentang menghias page halaman blog dengan urutan no ..bisa anda baca artukel nya di sini Koleksi Navigation page blogger nan cantik pada artikel tersebut di jelaskan cara-cara menghias halaman blog dengan menggunakan berbagai variasi page navigation.

Nah,,kali ini saya mencoba mengobok-obok kode html untuk menghiasi dan menyisipkan gambar pada tulisan Postingan lama dan Postingan Baru...

Kalau di bawaan templete blogger di bawah postingan atau artikel akan terlihat tulisan Postingan lebih baru,Beranda dan Postingan lama gimana ya kalo kita ubah tulisan tersebut ?? pasti akan lebih menarik jika kita ganti tulisan nya dengan icon gambar seperti terlihat pada contoh gambar di atas yang saya ambil gambar screen shot nya di salah satu blog saya..


Ok..jika sobat berminat langsung aja yuk ke TKP...

1.Silahkan Login terlebih dahulu.

2. Lalu klik Templete lalu klik Edit templete dan centang Expand Widget Templates yang terlihat seperti gambar di bawah ini.



Gambar draf baru blogger


3.CARI KODE DI BAWAH INI..!!! cara cepat nya tekan (Ctr + F pada keyboard)

Kode yang perlu di cari sesuaikan dengan yang di bawah ini

<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' 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 + &quot;_blog-pager-older-link&quot;' 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>


Catatan :
  • <data:newerPageTitle/> @ Sama dengan tulisan Postingan baru bisa anda ganti tulisan atau gambar seperti contoh : seperti tulisan Data Baru,Artikel Baru dll.
  • <data:olderPageTitle/> @ Sama dengan Tulisan Postingan lama bisa juga anda ganti dengan tulisan atau gambar sesuka anda bisa dengan tulisan  artikel lama,Data lama dll.
  • <data:homeMsg/> @ Kode ini bisa anda ganti dengan tulisan atau gambar seperti tulisan  Halaman Utama ,Beranda dll.
  • Tag kode yang saya tandai warna merah di atas bisa di sisipkan dengan gambar agar terlihat lebih cantik dan menarik untuk sekedar contoh bisa anda ganti tulisan nya dengan gambar di bawah ini :





Kode nya : 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr9QkCnBBlO0FaRWec_6X_KnjJuoE207L0LU-JJuGqDhBnRC0RqmqqVR-KlRWngzAqSs-SR48yW-9Rq831QUwxjWWsD2-2BZ_abDZOcH5b-Hl27U_rqWNZXuqbSg9lG5vogShsvR4RsqEr/s1600/beranda+2.png'/>



Kode nya: 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY0CCZoKH_iM6WyDg2i13YejjiXj0zXQXpOA375luq01acEF_AN6gvF71fUDZmNkWbBMv8-bDszkRVkSLsFC_xaJQ3FH40BEQn-dzsr84uSIZEYMy1YV0NTK6a6Lv1J0zsY8DiAb-jtdWQ/s1600/data+Baru+2.png'/>


Kode nya :
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLakhT921BfS5cplSMzcRBDlDW6pqI1Qo9DJF9Z9DFKb4hGrK72CrkUiYjzaOT5QRUbOGq8uaPM9ibJIvsbDxbrQkQSAJi9f985b6CIblgQVHEayUSuj4o-3-akmYGeorUVIIdHhGNxHps/s1600/data+lama+2.png'/>


4.Simpan Templete dan lihat hasil nya

Akhir nya selesai juga neh artikel..semoga artikel sederhana ini bisa menghias blog kita lebih cantik lagi...dan di tunggu variasi lain nya dari para sobat di kotak komentar..semoga bermanfaat.

0 komentar:

Posting Komentar