Jumat, 24 Mei 2013

Cara ganti Tulisan Posting Lama / Baru dengan Gambar



Untuk menampah penampilan blog supaya keliatan keren itu sangat penting karena blog akan dikunjungi banyak orang. Nah supaya blog tampil lebih profesional maka salah satunya adalah merubah dari bentuk tulisan pada posting lama, beranda dan posting lebih baru kita ganti dengan bentuk gambar. Lha gimana caranya ??? simak uraian dibawah ini.
Berikut langkah-langkah Mengganti Teks posting Lama/Baru jadi Gambar :
1. Login ke account blogger sobat
2. klik menu Template
3. kemudian pilih Edit Html
4. pilih lanjutkan untuk masuk ke Setup Html
5. setelah masuk jangan lupa centang kotak kecil di pojok kiri yang 
    bertuliskan "expand template widget"
6. Untuk mengganti teks posting baru cari kode <data:newerPageTitle/>   
    gunakan Ctrl+F pada keyboard komputer Sobat agar lebih mudah dalam 
    proses pencarian, setelah kodenya ketemu sobat ganti kode 
    <data:newerPageTitle/> tersebut dengan kode dibawah ini

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2kJLX1cwk-ATPjHPrHDUYgTipANxMDa9KsD3kEJDQo0xSPCduquXzWjqbCRZ3OGBMftDYnx-qQN6jBlF2IPtiaKM89Ia_a14e2PdKP5PYaPGeZB0V9NLEFx-1owx63VT4SgX3x6R4OfI/s1600/posting+baru.jpg' title='posting lebih baru'/>

7. Untuk tulisan Postingan lama cari kode <data:olderPageTitle/> dan ganti 
    kode tersebut dengan kode dibawah ini

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsfBbkT07IqOrhXmn5QWL-a1qXTcivQi01KI4kYUEenO42qgRYz2GIIhyutKrpxlpeTYU4z1B2l99_18imhU2MFUyX67dn9i3Lbgdal5jZU9xbAKBNgLRfbKZxaHU1fJ28cvj6FJmCqXo/s1600/posting+lama.jpg' title='posting lebih lama'/>

8. Untuk tulisan Beranda cari kode <data:homeMsg/> dan ganti kode tersebut 
    dengan kode dibawah ini

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqvvT8sswLf9JRJ7VLEK59KkhIsBD-YGMLjBpmvZSP79FcWhlF9Bnnyream3zFVveJFY3_j4XqWM4T1CTWCxP8oW6T7NCOLSy1pbnI2GIrgRwUgKX3DM_aNZzJFMte4i8opWWFm7_3PTU/s1600/home.png' title='Halaman Awal'/>

9. Simpan Template

Link gambar yang saya cantumkan pada kode tersebut bisa anda ganti dengan link gambar yang anda inginkan, asalkan ukurannya disesuaikan. 
Selamat mencoba dan semoga bermanfaat 

Rabu, 22 Mei 2013

Cara Pasang Read More

Bila pada artikel sebelumya diuraikan tentang cara cepat dan mudah membuat read more dengan memanfaatkan tombol ‘Insert jump break’ yang terdapat pada editor blogger, dan akhirnya menjadikan artikel terpenggal dengan kalimat ‘Read more »’ atau ‘Baca selengkapnya »’, maka pada artikel ini diuraikan tentang bagaimana cara untuk mengganti kalimat ‘Read more »’ atau ‘Baca selengkapnya »’ tersebut dengan sebuah gambar berbentuk tombol read more seperti halnya yang tampak pada gambar tombol read more di atas.

Untuk mengubah dan mengganti kalimat ‘Read more »’ atau ‘Baca selengkapnya »’ dengan menggunakan sebuah gambar berbentuk tombol read more adalah dengan cara mengganti salah satu kode HTML dari template yang dipakai dengan memanfaatkan editor template. Dalam hal ini yang perlu dilakukan setelah login ke akun blogger dan kemudian mengeklik nama blog yang templatenya akan di-edit adalah sebagai berikut:
  1. Klik menu ‘Template’;
  2. Klik tombol ‘Edit HTML’ dan kemudian klik tombol ‘Lanjutkan’;
  3. Klik kotak yang terdapat di depan pilihan ‘Expand Template Widget’ sehingga muncul tanda checklist.
  4. Tekan tombol keyboard Ctrl + F untuk mencari kode HTML <data:post.jumpText/>;
  5. Ganti kode <data:post.jumpText/> dengan kode di bawah ini:
    <img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN-7swlV86d_KDbmS5sFtEoGKquHFRnpML0RZnhFdXm58wVsbuIH-UuMq1eRrlXB4Tq0Gwl_m2L9ewz8UURJvhTvMYPAmyCbqiF1wsW1Rpj2g0kHCBiE6NqEK15aOUfGspJNRgze9QFQs/s800/Read%252520More.png'/>
    Sehingga akan mengubah kalimat ‘Read more »’ atau ‘Baca selengkapnya »’ dengan gambar tombol read more seperti pada gambar di bawah ini.
    Read More
  6. Simpan template.
Namun dengan menggunakan cara tersebut, secara default gambar tombol read more akan ditampilkan pada bagian kiri halaman posting (rata kiri). Sehingga bila ingin menempatkan gambar tombol read more tersebut pada bagian kanan halaman posting, maka cari kode <b:if cond='data:post.hasJumpLink'> kemudian masukkan kode <div style='text-align: right;'> tepat di bawahnya.

Sumber: http://eltelu.blogspot.com/2012/01/membuat-tombol-read-more-tanpa-ribet.html#ixzz2U217GAdN