Loading...

Menu tersembunyi pada widget

"Ssssttt.... jangan bilang siapa-siapa..." Begitulah analogi dari menu ini. Untuk melihat contohnya, lihat pada bagian bawah situs blog saya, dan klik "Sssstt.. Ada dollar gratis disini..." Anda akan melihat sebuah tabel dalam menu tersebut. Untuk membuat menu ini, ikuti langkah-langkah berikut :

Anda harus mendownload file berikut dan hostingkan pada server anda atau tempat anda menghostingkan file-file. (Note : Untuk mengetahui cara menghostingkan file-file Java Script dan CSS Klik Disini!!)
  1. dddropdownpanel.js
  2. dddropdownpanel.css
File gambar :
  1. toggleleft.gif
  2. toggleright.gif
  3. arrow-down.gif
  4. arrow-up.gif
Setelah anda mendownload file-file tersebut, Login ke blog anda, klik layout pada blog anda klik edit html.

Copykan kode berikut pada section Head :

<link rel="stylesheet" type="text/css" href="dddropdownpanel.css">

Kemudian copykan kode dibawah ini sesudah <BODY>
(Note : Menu ini dapat berada posisi atas halaman atau widget anda)

Setelah itu, klik Save Template dan lihat hasilnya...
Selamat mencoba..
 Baca selengkapnya...

Share |
0 komentar
Date: 21 July 2009
Categories :

Menampilkan Gambar Berada di Atas

Agar gambar selalu berada diatas Blog anda, walaupun halaman blog berganti, atau berpindah-pindah, ikuti langkah-langkah berikut:
  1. login ke blog anda
  2. Klik layout, kemudian klik tab Edit HTML
  3. Pada kotak CSS anda, cari script ]]></b:skin> kemudian letakkan script berikut ini diatas script ]]></b:skin>


    #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); }

  4. Silahkan diganti posisi gambar tersebut dengan mengganti huruf yang bercetak tebal dengan Left - Right - Bottom - TOP
  5. Selanjutnya cari script berikut ini </body> dan letakkan script dibawah ini sebelumnya script </body>


    <div id="trik_pojok">
    <a href="http://modiftampilanblogger.blogspot.com">
    <img src="http://photobucket/love.gif" border="0" /></a>
    </div>


  6. Silahkan diganti alamat yang berwarna biru dengan alamat blog anda kemudian ganti alamat yang berwarna merah dengan alamat gambar anda.
Baca selengkapnya...

Share |
0 komentar
Date:
Categories :

Membuat ComboBox

Contoh combo Box :

Untuk membuat Combo Box seperti diatas, lakukan langkah-langkah berikut :
  1. Login ke blog anda
  2. Pilih Layout dan klik Add yang berada diatas Page Element anda
  3. Kemudian pilih element HTML/JavaScript dan masukkan kode dibawah ini :

    <select onChange="document.location.href=this.options[this.selectedIndex].value;">
    <option value="0" selected>Arsip Blog</option>
    <option value="Links 1">Text 1</option>
    <option value="Links 2">Text 2</option>
    </select>



  4. Lihat dengan seksama kode tersebut dan ganti teks yang sama pada Combo box yang ada pada kode tersebut dengan teks anda inginkan.
  5. Selamat Mencoba...

 Baca selengkapnya...

Share |
0 komentar
Date:
Categories :

Mengganti Background Blog dengan Gambar

Siapkan gambar yang ingin dijadikan background pada blog anda, dengan ukuran terserah anda, akan tetapi jangan terlalu besar, karena akan memperlama pengunjung membuka blog anda. Jika gambar sudah ditentukan, ikuti langkah-langkah berikut :

Lakukan Login terlebih dahulu pada blog anda
Klik Menu Layout

Klik Edit HTML tab (Note : Untuk menghindari kesalahan, silahkan Backup terlebih dahulu blog anda dengan memberikan checklist pada Download full template dan klik Download atau dengan cara meng-Copy seluruh kode Template, paste pada notepad lalu save)

Kemudian tambahkan kode (alamat gambar) berikut pada style sheet css anda


url('http://https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVTD7_k6iTJFHocWS3A5kW5hJymXZCQtshIFQXPlPAJyrBSSvpEWAgMDhcanSdEPqWyswY7auHbpptE5zsiNzFiw9NgOxJe-SREj_SZ3oVgHXx0RN7QrRp9W42vtSbhyphenhyphen2GtV8D1SZolOCu/s320/MSN.gif');



dan letakkan pada teks yang berwarna merah:

untuk minima klasik :


body {
background:#fff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVTD7_k6iTJFHocWS3A5kW5hJymXZCQtshIFQXPlPAJyrBSSvpEWAgMDhcanSdEPqWyswY7auHbpptE5zsiNzFiw9NgOxJe-SREj_SZ3oVgHXx0RN7QrRp9W42vtSbhyphenhyphen2GtV8D1SZolOCu/s320/MSN.gif');
margin:0;
padding:40px 20px;
font:x-small Georgia,Serif;
text-align:center;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}



untuk minima baru :


body {
background:$bgcolor url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVTD7_k6iTJFHocWS3A5kW5hJymXZCQtshIFQXPlPAJyrBSSvpEWAgMDhcanSdEPqWyswY7auHbpptE5zsiNzFiw9NgOxJe-SREj_SZ3oVgHXx0RN7QrRp9W42vtSbhyphenhyphen2GtV8D1SZolOCu/s320/MSN.gif');
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}



Silahkan diganti alamat link gambar yang berwarna diatas dengan alamat gambar anda.

Klik tombol Preview untuk melihat perubahan

Jika sudah sesuai dengan keinginan, klik tombol Save Template
 Baca selengkapnya...

Share |
0 komentar
Date:
Categories :

Menampilkan Iklan di Bawah Read More / Baca Selengkapnya

Pastikan sistem Read More pada blog anda aktif dan ikuti langkah-langkah berikut :

  1. Login terlebih dahulu pada blog anda
  2. Klik Menu Layout
  3. Klik Edit HTML tab (Note : Untuk menghindari kesalahan, silahkan Backup terlebih dahulu blog anda dengan memberikan checklist pada Download full template dan klik Download atau dengan cara meng-Copy seluruh kode Template, paste pada notepad lalu save)
  4. Berikan Checklist pada option Expand Template Widget dan tunggu beberapa detik hingga proses selesai.
  5. Temukan kode dibawah ini pada style sheet css anda :


    <b:if cond='data:blog.pageType == "item"'>
    <style>.fullpost{display:inline;}</style>
    <p><data:post.body/></p>
    <b:else/>
    <style>.fullpost{display:none;}</style>
    <p><data:post.body/>
    <a expr:href='data:post.url'><strong>Read More</strong></a></p>
    </b:if>


  6. Tambahkan kode iklan anda (Adsense, Kumpulblogger, dll) sehingga kode yang diatas akan seperti ini :



    <b:if cond='data:blog.pageType == "item"'>
    <style>.fullpost{display:inline;}</style>
    <p><data:post.body/></p>
    <b:else/>
    <style>.fullpost{display:none;}</style>
    <p><data:post.body/>
    <a expr:href='data:post.url'><strong>Selengkapnya...</strong></a>

    <br /> <br />
    KODE IKLAN ANDA PASTE DISINI!!! </p>

    </b:if>


  7. Klik tombol Preview untuk melihat perubahan
  8. Jika sudah sesuai dengan keinginan, klik tombol Save Template

Baca selengkapnya...

Share |
1 komentar
Date:
Categories :

Menampilkan Pesan Selamat Datang

Lihat contoh dibawah ini :



Pada saat pengunjung membuka halaman blog anda akan di sodorkan pesan seperti diatas, untuk membuatnya cukup dengan langkah-langkah sebagai berikut :
  1. Lakukan Login terlebih dahulu pada blog anda
  2. Klik Menu Layout
  3. Klik Edit HTML tab (Note : Untuk menghindari kesalahan, silahkan Backup terlebih dahulu blog anda dengan memberikan checklist pada Download full template dan klik Download)
  4. Temukan code </head> pada blog anda (Note : tekan Ctrl + F untuk melakukan pencarian dan ketikkan kata yang ingin dicari).
  5. Silahkan Copy dan Paste code dibawah ini dan letakkan diatas code </head>. (Note : Ganti kalimat yang berwarna hijau dengan kalimat yang anda inginkan)


    <SCRIPT language='JavaScript'> alert ("Selamat datang di Share Center") ;</SCRIPT>


  6. Klik tombol Save Template
  7. Lihat hasilnya…

 Baca selengkapnya...

Share |
0 komentar
Date:
Categories :
Subscribe to: Posts (Atom)
 
Powered By Blogger | Designer By DJo | Resolution: 1024x768px | Best View: Firefox | Top

Copyright © 2008-2009