Cara Mengganti Teks Link "Posting Baru" - "Posting Lama" dengan Image Gambar Animasi

Panduan BloGGeR dan Tutorial BloGGeR Modifikasi Blog - Animasi :

Bagaimana menggunakan gambar animasi yang berisi teks untuk mengganti teks link "Posting Baru" ("New Post"), "Posting Lama" ("Older Posts""), dan "Beranda" ("Front Page") yang terletak di bawah kolom komentar (seperti di blog ini)?

Dalam Panduan dan Tutorial BloGGeR ini kita akan bahas cara menngganti ketiga teks link di atas. Ke tiga teks link yang berfungsi untuk membuka halaman blog di posting yang lebih baru, halaman muka blog dan posting sebelumnya itu dapat kita rubah menjadi sebuah image atau gambar animasi teks supaya penampilan blog menjadi lebih cantik, indah dan membuat jemari gatal untuk mencobanya. Untuk merubah kode html-nya kita harus kembali membongkar desain blog di halaman "Edit HTML".

Panduan BloGGeR Langkah Merubah Teks Link Posting Baru - Posting Lama :

1. Ikuti Panduan BloGGeR dan Tutorial BloGGeR ini dengan cermat : Mengikuti Panduan BloGGer maupun Tutorial Blogger secara cermat dan teliti merupakan kunci sukses untuk melakukan perubahan desain blog. Jangan lupa bertanya apabila mengalami kesulitan juga menjadi salah satu kunci utama. Gagalnya perubahan akibat dipendam sendiri akan mengakibatkan rasa emosi atau jengkel sehingga sering timbul desakan mau kencing! Kesimpulannya : Malu bertanya akhirnya gagal melakukan perubahan desain blog sehingga justru menjadi kebelet pipis.
2. Login : Lakukan login dengan menuliskan "User Name/alamat email" dan "Password (Sandi)".
3. Dasboard (Dasbor) : KLIK link "Layout (Tata Letak)".
4. Layout (Tata Letak) : KLIK link "Edit HTML".
5. Edit HTML : KLIK link "Download Template Lengkap (Download Full Template)", kemudian "simpan (SAVE)" di "Folder PC". Bila ingin mengetahui cara dan kegunaan mengamankan template (backup), silahkan sampeyan KLIK
   di sini!
   .
6. Tetap di Edit HTML : KLIK link "Expand Template Widget".
7. Tetap di Edit HTML : Cari KODE :

   <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>

   Gunakan "Ctrl+F" untuk mencari kode html di atas. Apabila belum tahu cara mencarinya, silahkan sampeyan KLIK
   di sini!
   .
8. Ada tiga KODE HTML harus diganti : Lihat KODE html di bawah ini, yang akan sama dengan kode milik template sampeyan, terutama tiga KODE HTML yang nantinya akan dirubah. Tiga kode HTML yang berwarna bitu tebal (geser scroller supaya terlihat) adalah kode yang harus diganti:

<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<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>

9. Ganti KODE : Ganti seluruh kode HTML yang berwarna biru tebal dengan kode di bawah ini. Penggantian dilakukan berurutan dari yang paling atas.

   Kode HTML pertama (paling atas) :

   <img src='http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/PostingBaru-B.gif' style='height:28px;width:133px;margin-left:10px;border:2px solid #555;padding:3px'/>

   Kode HTML ke dua (tengah) :

   <img src='http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/Posting-Lama-Anima-B.gif' style='height:28px;width:140px;margin-right:10px;border:2px solid #555;padding:3px'/>

   Kode HTML ke tiga (paling bawah) :

   <img align="center"  src='http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/HalamanMukaAnima.gif' style='height:28px;width:188px; border:2px solid #555;padding:3px'/>

10. SAVE Template/Simpan Template : KLIK "Simpan Template" dan buka blog untuk melihat hasilnya.

Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :

• 
• 

» Happy Blogging - gubhugreyot «