Excalibur
Info

Selamat Datang

Selamat Datang Di Blog Roy Lichtenstein- Saya Senang Anda Berada Di Sini, Dan Berharap Anda Sering Datang Kembali. Silakan Berlama - Lama Di Sini Dan Membaca Lebih Lanjut Tentang Artikel Yang Saya Susun. Ada Banyak Hal Dapat Anda Pelajari, Anda Mungkin Akan Menemukan Sesuatu Yang Menarik

Sekilas Tentang Roy

Nama saya Roy Lichtenstein, Saya Bukan Seorang Blogger, Hacker, Desainer Atau Apapun Tapi Saya Hanya Seseorang Yang Ingin Selalu Belajar Dan Ingin Tau Sesuatu Yang Baru...

Social Icons

xtreme8-andinova.blogspot.com

Cara Membuat Dan Menampilkan Gambar/Image Di Judul Posting

Mungkinkah menampilkan gambar pada judul posting dan bisa terlihat setiap posting dilakukan ? Mungkin saja ! kenapa tidak ?! Yang kamu perlukan adalah : Cari atau buat dulu sebuah gambar dalam ukuran kecil (kira-kira ukuran tingginya berkisar 14pixel atau height=14px). Gambar ini bisa berupa gambar yang menampilkan identitas blog atau yang berisi hal yang menarik pembaca blog. Atau bisa juga berupa gambar animasi gif.


Langkah membuat Efek Bounce pada Judul Posting :
  1. Login ke Blogger.
  2. Tetap di Edit HTML.
  3. KLIK Expand Template Widget.
  4. Cari KODE :
  5. <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a>
    <b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>
  6. Ganti KODE di atas dengan KODE di bawah :
  7. <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/>
    <img src="https://3288785158770787760-a-1802744773732722657-s-sites.googlegroups.com/site/gubhugreyotprojects/jquery/image-slider-w-description/images/NewPostAnima.gif" style="height:14px;width:auto;border:1px solid red;margin:2px 8px;"/>
    </a><b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>
  8. Atau kamu juga bisa lakukan dengan cara :
  9. Ganti KODE berikut :
    <a expr:href='data:post.url'><data:post.title/></a>
    Dengan :
    <a expr:href='data:post.url'> 
    <data:post.title/><img src="https://3288785158770787760-a-1802744773732722657-s-sites.googlegroups.com/site/gubhugreyotprojects/jquery/image-slider-w-description/images/NewPostAnima.gif" style="height:14px;width:auto;border:1px solid red;margin:2px 8px;"/>
    </a>
Keterangan/Catatan :
  • Jangan lupa KLIK Simpan Template
  • Untuk merubah posisi gambar supaya berada di depan Judul posting, pindah link gambar di depan KODE <data:post.title/>, sehingga bentuknya menjadi :
  • <a expr:href='data:post.url'><img src="https://3288785158770787760-a-1802744773732722657-s-sites.googlegroups.com/site/gubhugreyotprojects/jquery/image-slider-w-description/images/NewPostAnima.gif" style="height:14px;width:auto;border:1px solid red;margin:2px 8px;"/><data:post.title/></a>

No comments:

Post a Comment