Pasang image pada judul Posting

 ----------------------------------------------------------------------------------

Bagi anda yang suka menghiasi Blog dengan berbagai image, sekarang andapun dapat menampilkan image tersebut dalam judul postingan.
Ada beberapa langkah yang harus anda lakukan, silahkan anda simak dan anda praktekan jika berminat dan kalau tidak, jadikanlah sebagai pengetahuan anda, siapa tahu kedepan pikiran anda berubah.
Langkah pertama

Siapkanlah sebuah image yang ingin anda tampilkan pada setiap judul postingan. Agar lebih menarik pilihah image dalam bentuk file gift, sehingga penampilannya akan lebih hidup.

Langkah kedua

Uploadlah image tersebut pada situs yang melayani penyimpanan image, misalnya : http://www.Photobucket.com atau situs lainnya yang memiliki fungsi sama.
Setelah proses upload selesai, copy alamat URL dari image tadi.

Langkah ketiga

Sekarang saya anggap anda telah memiliki image adress/URL dari sebuah image.
Contoh :

http://i708.photobucket.com/albums/ww86/andiskapati/tweetybird.gif"

Agar alamat gambar diatas bisa tampil pada blog, tambahkanlah kode dibawah ini :

<img src="URL image"></img>

Kode tersebut akan menjadi seperti ini :

<img src="http://i708.photobucket.com/albums/ww86/andiskapati/tweetybird.gif"></img>

Kode diatas akan terlihat seperti ini (dalam ukuran sebenarnya) :



Sesuaikan ukuran gambar tersebut dengan ukuran yang anda inginkan dengan menambah kode width="..." untuk lebar gambar, height="..." untuk tinggi gambar dan border="..." untuk lis (garis bingkai) gambar.
Kode-kode tadi jika dirangkaikan akan menjadi seperti ini :

<img border="0" widht="35" src="http://i708.photobucket.com/albums/ww86/andiskapati/tweetybird.gif" height="35"></img>

Gambar akan berubah seperti ini :


Langkah keempat

1. Login ke Blogger dengan ID anda.
2. Pilih Rancangan.
3. Pilih Edit HTML.
4. Back Up template terlebuh dahulu untuk menjaga jika terjadi kegagalan.
5. Cari kode ini:
   
   <a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
   
   pada template anda.
6. Pasang kode image tadi diantara kedua kode diatas, seperti ini :
   
   
   <a expr:href='data:post.url'>pasang kode image disini<data:post.title/></a>
<b:else/>
7. Jika kita rangkaikan, kodenya akan menjadi seperti ini
   
   
   <a expr:href='data:post.url'><img border="0" widht="35" src="http://i708.photobucket.com/albums/ww86/andiskapati/tweetybird.gif" height="35"></img><data:post.title/></a>
<b:else/>
8. Klik tombol Preview untuk melihat perubahan sebelum disimpan.
9. Klik tombol Simpan Template, jika telah dilihat hasilnya.
10. Selesai

Sumber :  http://www.cukuhnau.co.cc/2011/03/menambah-gambar-pada-judul-postingan.html

Membuat Gambar melayang

Membuat gambar melayang atau floating image ini merupakan record posting saya, maksudnya ini adalah hasil pembelajaran saya yang saya sudah aplikasikan kemudian saya record di posting ini supaya tidak lupa. Masih bingung apa yang dimaksud dengan gambar melayang? anda bisa melihat di sisi kiri bawah blog Kampung Cibodas ini saya ini. Anda sudah lihat ada gambar yang letaknya tidak berubag meskipun blog di scroll ke bawah atau keatas itu yang saya maksud floating image atau gambar melayang. teknik ini bisa di gunakn untuk menaruh apa saja termasuk iklan, welcome page atau bahkan foto anda. setelah kasak kusuk ama mbah google saya dapet tekniknya di blog tips blog ini, matur nuwun ya yang punya blog.

1. Login ke blogger trus klik "Layout -->> Edit HTML
2. Cari kode ini ]]></b:skin> kalo dah ketemu taru kode berikut ini di atasnya.

#trik_pojok {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

3. Text yang dicetak tebal adalah posisinya, kalo pingin ganti di posisi pojok kanan bawah tinggal text "left" diganti dengan "right". Begitu juga tulisan "bottom", jika pingin di posisi atas bisa diganti dengan "top".
4. Langkah selanjutnya yaitu letekkan script berikut ini sebelum kode </body>

<div id="trik_pojok"><a href="http://linkblogkamu.com">
<img src="http://linkgambarkamu " border="0" /></a></div>



5. Jika kamu pingin yang ada disitu bukan gambar tetapi jam/kalender/hit counter/widget-widget yg lain, maka ganti text yang berwarna merah dengan script widget-widget tersebut.
6. Simpan hasil kerja kamu dan lihat hasilnya.

Sumber: http://www.gusbud.web.id/2009/08/membuat-gambar-melayang-pada-blog.html