PASANG GAMBAR ALA NAVBAR

Terus terang saya sangat terkesan sekali dengan sistem Side Fixed Menu yang sering terdapat di Wordpress. Bagi kawan – kawan semua mungkin sudah tahu apa itu Side Fixed Menu ? Side Fixed Menu adalah sebuah atau banyak menu yang terdapat pada sisi sebuah blog dimana ketika layar monitor/blog digulung kebawah maupun keatas maka menu tersebut tetap ditempatnya alias tidak berubah.

Tapi kali ini saya akan mencoba untuk merubah tampilan dari Fixed Side Menu tersebut menjadi tampilan sebuah photo (terserah photo apa saja) seperti halnya photo kepunyaan saya yang keren disebelah kiri blog ini…..!!!


Supaya tidak kelamaan, langsung saja ikuti langkah pembuatannya sebagai berikut :

• Seperti biasa, masuk ke account blogger anda.
• Kemudia di Kontrol Panel pilih Tata Letak
• Setelah itu pilih Edit HTML lalu tandai Expant Widget Templates
• Sebelum melakukan peng-editan lebih jauh terhadap template blog anda, ada baiknya untuk membackup dulu template tersebut untuk jaga-jaga kalau terjadi ERROR
• Lalu cari kode  ]]></b:skin>
• Kemudian copy – paste kode dibawah ini tepat diatas kode tersebut

#menulateral{
position:fixed; text-align:left;
/*Si la ubicación del menú no es la adecuada modifica los valores siguiente: */
margin-top:0px; margin-left:-130px; } * html #menulateral{ /*para IE*/
position:absolute; }
#menulateral a img{
opacity:1; -moz-opacity:1;
filter:alpha(Opacity=100); }
#menulateral a:hover img{
opacity:0.8; -moz-opacity:0.8;
filter:alpha(Opacity=80);
position:relative;top:0px;left:2px; }
* html #menulateral a img{
filter:alpha(Opacity=100); }
#menulateral img{
margin-bottom: -5px; }
* html .menulateral{
margin-bottom: -3px; }

• Kalau langkah diatas sudah dilaksanakan, carilah kode seperti dibawah ini

<div id='content-wrapper'>

• Apabila sudah ditemukan, copy paste kode dibawah ini

<div id='menulateral'>
<span>
<a href='http://suriyadi.com/'><img alt='Home' class='menulateral' src='http://i260.photobucket.com/albums/ii31/suriyadi_123/yadi-3.gif'/></a>
</span>
</div>

• Langkah yang terakhir adalah menyimpan Template anda dengan menekan tombol SAVE TEMPLATE
• Lalu silakan lihat hasilnya

Catatan :

• Tulisan yang berwarna biru adalah pengaturan posisi gambar yang nantinya akan di tampilkan dalam blog anda, silakan disesuaikan posisinya dengan merubah nilai pixelnya.
• Untuk tulisan yang berwarna merah silakan ganti dengan alamat URL anda dan alamat gambar anda