Widget Search Box Keren Buat Blogger

Langsung saja ginama  Cara memasang widget search box di blogger yauti :
Biasa Pertama anda harus Login ke Blogger > Edit HTML > Add Element baru > HTML atau Javascript
Copy salah satu kode dari 6 widget serch box keren di bawah ini dan paste pada element baru tadi.
Mudah kan.....!!!!

Widget Search box 1

<style type="text/css"> #a-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyyIDmBiFuf9eSmggaCEo-fViVNcqOj3K6tV9B5gt00I_cuZH5_nZWyG6ZVPqtBze3cv6QIQsWgf-REhlzixuEo96dyVjh8eitNBsYCNIaze5YIiHW6qufdp3vnMNOIaPcic8dWwe-FhIv/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#a-searchform{display: block;padding: 10px 12px;margin:0;} form#a-searchform #a{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#a-searchform #abutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="a-searchbox"><form id="a-searchform" action="/search" method="get">    <input type="text" id="a" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="abutton" /> </form></div>

Widget Search box 2

<style type="text/css"> #b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGXzNA-2vF9a1dM_2v1M8p4bbuvPpHd_381Pzfu7IBoDrOYkcuuvFnHmKQ4Csa2w818f29l55EgGy4HlPzqRPGriG05VuXbs0MZ6C11KnT6sMPhMq7PzYYlpWzts7gwjoIPY6o6VMI7rzX/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#b-searchform{display: block;padding: 10px 12px;margin:0;} form#b-searchform #b{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#b-searchform #bbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="b-searchbox"><form id="b-searchform" action="/search" method="get">    <input type="text" id="b" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>     <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="bbutton" /></form></div>

Widget Search box 3

<style type="text/css"> #c-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSsAF4TfuqD8CCIjEEJDESKN6PGLKWEB4UdfWCr-9pu24Ay6NV9axRirBsq4CRDamVSLMih1YLHIJ4rBgDvAQ0-WNKtSHvMzwU_cA1fQUnkfpLowP4AwfFwASTlRNC8u6D65kr8EbbJfv_/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#c-searchform{display: block;padding: 10px 12px;margin:0;} form#c-searchform #c{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#c-searchform #cbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style><div id="c-searchbox"><form id="c-searchform" action="/search" method="get">    <input type="text" id="c" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="cbutton" /></form></div>

Widget Search box 4

<style type="text/css"> #d-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGFf_u-NTIncKdvpCuhciv0d4I0dVm1u_uXCuvoy6q5iP3PlR-oONh3ylI_8OIvsZhE6a99VCYyxpeHershoHo_pAAMpsr8u8NjX_6F7kSQbuu0KaogwNQqKo9lJSNU3woASqiaZ4iHBIV/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#d-searchform{display: block;padding: 12px;margin:0;} form#d-searchform #d{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#d-searchform #dbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="d-searchbox"><form id="d-searchform" action="/search" method="get">    <input type="text" id="d" name="q" value=""/>    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="dbutton" /> </form></div>

Widget Search box 5

<style type="text/css"> #e-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiojR-n_HNIdTCPxEr46h2pKk2zXIomrJjgmOgOWej-GJJ_4LjZGmj9SRmM1G0kStpafdDT_n5hqY-J0g0kFSkXeX5NnPRWWrrOYZhAKQtQgRSlNV77pLP9dP8EvbFANjD4siG1tXtpcIBM/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#e-searchform{display: block;padding: 12px;margin:0;} form#e-searchform #e{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#e-searchform #ebutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="e-searchbox"><form id="e-searchform" action="/search" method="get">    <input type="text" id="e" name="q" value=""/>    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="ebutton" /></form></div>

Widget Search box 6

<style type="text/css"> #f-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8JHCCXXLlb0Wl5QDXmQ3xgdmr3-tHCmeWHddgxOODN8WXmrcgLLjHLFUZ4XuaIMIH__XECIN9PbUP7Gkc1qZsL3jdsiwBwsoUn5qs5JrwMOfm0iXo9i5FaxgC10Mc78R_9h0ZABhpB3MH/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#f-searchform{display: block;padding: 12px;margin:0;} form#f-searchform #f{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#f-searchform #fbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="f-searchbox"><form id="f-searchform" action="/search" method="get">    <input type="text" id="f" name="q" value=""/>  <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="fbutton" /> </form></div>

Terima kasih, itulah cara memasang Widget Search Box Keren Buat Blogger,,, semoga bermanfaat,,,,!!!

Cara Membuat Menu Drop Down ala Trik Komputer

Kali ini saya sedikit berbagi tentang  Cara Membuat Menu Drop Down ala Trik Komputer  yang telah di request oleh sahaba blogger  .Menu drop down dapat kita pasang di mana saja sesuka hati, Dengan di pasang menu  drop down pengunjung akan mudah mencari apa yang di inginkan..

Cara Membuat Menu Drop Down ala Trik Komputer :

1. Pertama anda harus login dulu di akun blog anda
2. Pilih rancangan / desing dan klik edit HTML dan lanjutkan
3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
4. Sobat cari kode ]]></b:skin> dan letakkan kode berikut tepat di atas kode ]]></b:skin>

.menu{
border:none;
border:0px;
margin-left:0px;
padding:0px;
font-size:13px;
text-align:center;
}
.menu ul{
background:#000000;
height:2px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
float:left;
padding:0px;
}
.menu li a{
background:#000000;
color:#80ff00;
display:block;
font-weight:normal;
line-height:30px;
margin:0px;
padding:0px 10px;
text-align:center;
text-decoration:none;
}
.menu li a:hover, .menu ul li:hover a{
background: #212121;
color:#80ff00;
text-decoration:none;
}
.menu li ul{
background:#000000;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:180px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul{
display:block;
}
.menu li li {
display:block;
float:none;
margin:0px;
padding:0px;
width:180px;
}
.menu li:hover li a{
background:none;
}
.menu li ul a{
display:block;
height:30px;
font-size:12px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a{
background:#212121 center left no-repeat;
border:0px;
color:#80ff00;
text-decoration:none;
}
.menu p{
clear:left;
}
.breadcrumbs {
padding:8px 0px 10px 5px;
margin: 0px 0px 5px 0px;
font-size:88%;
border:1px dotted #7f7c7c;
}
.commenthidden {display:none}
.commentshown {display:inline}
.hotlink{
padding:8px 0px 10px 5px;
margin: 0px 0px 5px 0px;
font-size:100%;
border:1px solid #000000;
border-radius:5px;
background-color:#000000;
}

Selanjutnya sobat blogger cari kode berikut : <div id='outer-wrapper'> lalu pastekan kode berikut tepat di bawahnya,

Jika kode <div id='outer-wrapper'> tidak ketemu, coba anda cari kode berikut :
<header>  : untuk menempatkan menu di atas nama blog
</header> : untuk menempatkan menu di bawah nama blog
Copy kode di bawah ini dan letakkan tepat di atas kode <header> atau di bawah kode </header>

<div class='menu'>
<ul>
<li><a href='http://www.trikkomputer.com/'>HOME</a>
<ul>
<li><a href='http://184.170.129.2:2082/logout/?locale=en'>HOSTING</a></li>
<li><a href='http://www.idwebspace.com/index.php'>DOMAIN</a></li>
</ul></li>
<li><a href='http://www.trikkomputer.com/2011/02/daftar-isi.html'>DAFTAR ISI</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Info%20IT'>Content</a>
<ul>
<li><a href='https://www.facebook.com/sunu.MC'>My Facebook</a></li>
<li><a href='http://www.trikkomputer.com/2012/04/my-inspiration.html'>My Inspiration</a></li>
<li><a href='http://www.trikkomputer.com/2011/03/silahkan-hubungi-saya-di-sini.html'>Hubung Saya</a></li>
<li><a href='http://www.trikkomputer.com/2011/12/jasa-buat-blog-siap-pakai.html'>Jasa Pembuatan Blog</a></li>
<li><a href='http://www.trikkomputer.com/2010/03/sms-gratis-by-trik-komputer.html'>SMS Gratis</a></li>
<li><a href='http://scele.teknokrat.ac.id/'>Materi Kuliah</a></li>
<li><a href='#'>Tugas Kuliah</a></li>
</ul></li>
<li><a href='http://www.trikkomputer.com/search/label/Info%20IT' target='_blank'>INFO IT</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Download'>DOWNLOAD</a>
</li>
<li><a href='#'>TIPS N TRIK</a>
<ul>
<li><a href='http://www.trikkomputer.com/search/label/Trik%20Registry'>Trik Registry</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Trik%20dan%20Tips'>Computer</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Trik%20Blogger'>Blogger</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Trik%20Facebook'>Facebook</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Trik%20Gmail'>Trik Gmail</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Patch%20dan%20Crack'>Hacking</a></li>
</ul></li>
<li><a href='#'>GADGET</a>
<ul>
<li><a href='http://www.trikkomputer.com/search/label/Android'>Android</a></li>
<li><a href='http://www.trikkomputer.com/search/label/BlackBerry'>BlackBerry</a></li>
<li><a href='http://www.trikkomputer.com/search/label/Nokia'>Nokia</a></li>
</ul></li>
<li><a href='#'>WINDOWS</a>
<ul>
<li><a href='http://www.trikkomputer.com/search/label/Windows%207'>Windows 7</a></li>
<li><a href='#'>Windows Vista</a></li>
<li><a href='#'>Windows XP</a></li>
</ul></li>
<li><a href='#'>PARTNER LINK</a>
<ul>
<li><a href='http://www.remo-xp.com/'>Remo-XP</a></li>
<li><a href='http://filehippo.com/'>Filehippo</a></li>
<li><a href='http://www.softpedia.com/'>Softpedia</a></li>
</ul></li>
<li><a href='#'>THEMES</a>
<ul>
<li><a href='#'>Windows 7</a></li>
<li><a href='#'>Windows XP</a></li>
</ul></li>
<li><a href='http://quranflash.com/en/quranflash.html'>AL-QUR'AN</a></li>
<li><a href='http://www.trikkomputer.com/2011/01/pasang-iklan-murah-untuk-bisnis-dan.html'>PASANG IKLAN</a></li>
</ul>
</div>

Keterangan:
Kode berwarna hijau adalah Url tujuan, silakan anda ganti dengan Url pada blog anda
Kode berwarna Biru adalah kalimat yang tampil pada menu dropdown, Silakan anda sesuaikan.

Demikianlah Cara Membuat Menu Drop Down ala Trik Komputer, semoga bermanfaat.....!!.

Buat Domain CO.CC Gratis 100%

Saya ingin berlatih punya domain sendiri. Bagaimana cara daftar domain gratis di CO.CC?

Ikuti langkah berikut:

DAFTAR NAMA DOMAIN PILIHAN & BUAT ACCOUNT/AKUN DI CO.CC

1. Daftar dengan mengklik link berikut: co.cc/regist
2. Setelah www. ketik nama yang diinginkan di kotak. Contoh, alkhoirot
3. Klik Check Availability -> klik Continue to registration apabila alamat available (tersedia). Apabila sudah ada yang punya, buat nama lain.
4. Klik Create an Account now (paling bawah) untuk daftar
5. Isi formulir dan kasih tanda tik pada "I accept the Terms of Service" (lihat gambar)
6. Retype password (tulis lagi password) saat tadi daftar isi formulir -> klik Continue
7. Sign-in/log-in/masuk dengan username (email) dan password
8. Sign-in/log-in berhasil -> Selamat! Anda sudah berhasil buat domain dan account di CO.CC. -> klik Set Up (lanjut di bagian kedua)

CARA BUAT SETELAN/SETTINGS DOMAIN DI CO.CC dg URL FORWARDING

Apa itu URL Forwarding?

URL Forwarding adalah mengarahkan/meneruskan/redirect sebuah alamat domain ke alamat situs lain. Contoh, situs alkhoirot.co.cc diarahkan ke http://donlotppa.wordpress.com. Jadi, saat alkhoirot.co.cc diklik, pengunjung akan masuk ke situs donlotppa.wordpress.com

Bagaimana cara buat setting/setelan URL Forwarding di Co.CC?

Ikuti langkah berikut:

1. Setelah Sign-in/Masuk ke CO.CC -> di My Domain (menu kiri) -> klik Select Domain -> pilih domain yang akan diedit -> klik URL Forwarding
2. Kasih tanda tik/klik pada URL Forwarding (sebelah kiri bawah)
3. Isi formulir untuk URL Forwarding
a. Redirect to: isi dengan alamat blog anda di blogspot.com atau wordpress.com
b. Pada Page Title: Isi dengan judul situs.
4. Klik Set Up -> klik OK. Selesai.

CARA MERUBAH BLOGGER BLOGSPOT KE CO.CC (CUSTOM DOMAIN)

A. Setelan/settings di CO.CC

1. Setelah Sign-in/Masuk ke CO.CC -> di My Domain (menu kiri) -> klik Select Domain -> pilih domain yang akan diedit
2. Klik CNAME
3. Pada “Host” isi dengan domain co.cc Anda. Contoh www.alkhoirot.co.cc
4. Pada “TTL” pilih 1D
5. Pada “Type” pilih CNAME
6. Pada “Value” isi dengan: ghs.google.com
7. Klik “Set up.”.
6. Selesai.

B. Setelan/settings di blogger.com

1. Login ke blogger.com Anda.
2. Klik Setelan/Settings
3. Klik Penerbitan/Publishing
4. Klik Domain Ubahsuaian /Custom Domain
5. Klik -> Beralihlah ke setelan lanjut
6. Pada "Domain Anda” -> Isi alamat domain Anda di kotak. Contoh: www.alkhoirot.co.cc (harus pakai www.)
7. Isi verifikasi kata.
8. Klik “Simpan setelan”.
9. Kasih tanda tik pada "Mengarahkan contoh.co.cc ke www.contoh.co.cc
10. Verifikasi kata lagi -> Simpan Setelan. Selesai.

Kalau ada ucapan Selamat! berarti sudah berhasil.

Penting: untuk update blog tetap melalui blogger.com


CARA MERUBAH WORDPRESS.COM KE CO.CC (DOMAIN MAPPING)

Penting: kita harus membayar USD 10 (Rp 100.000) pada Wordpress.com setiap tahun untuk domain mapping ini. Pembayaran dilakukan melalui Paypal atau Kartu Kredit (Credit Card/CC).

A. Setelan/settings di CO.CC

1. Masuk ke account CO.CC Anda
2. Di My Domain, pilih domain yang akan disetting
2. Klik Name Server (menu kiri)
3. Pada name server 1, isi dengan: NS1.WORDPRESS.COM
4. Pada Name Server 2, isi dengan: NS2.WORDPRESS.COM
5. Klik Set up

B. Setelan/settings di Wordpress.com

1. Masuk/login ke account wordpress.com Anda.
2. Klik Settings atau Pengaturan
3. Klik Domain-domain
4. Tambahkan alamat URL co.cc Anda di kotak yang tersedia. Contoh, www.alkhoirot.co.cc
5. Klik Tambahkan nama domain ke blog.
6. Kalau proses ini ok, maka Anda akan diarahkan (redirect) ke situs lain untuk membayar $10 dolar (minimal) untuk setahun pada wordpress.com dengan kartu kredit atau paypal. Karena ini termasuk program upgrade.
7. Selesai.

Penting: Anda tetap update blog melalui alamat wordpress.com anda sebelumnya.
Contoh, apabila blog sebelumnya adalah http://contoh.wordpress.com, maka login/masuknya melalui http://contoh.wordpress.com/wp-login.php

Cara Buat Read More Otomatis di Blogger

Pertama yang harus dilakukan adalah klik
Rancangan -> Edit HTML -> tanda tik/centang Expand Widget Template.
Setelah itu ikuti panduan di bawah.

Peringatan :
Coba dulu di blog eksperimen. Jangan di blog utama.

1. Cari kode </head>
2. Letakkan kode berikut di atasnya kode no. 1

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 230;
summary_img = 140;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script src='http://keerthiset2.110mb.com/excerpt.js' type='text/javascript'/>

Catatan: 
angka-angka di atas dapat dirubah sesuai selera.

3. Cari kode berikut: <data:post.body/>
4. Ganti kode tersebut dengan kode di bawah ini :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div style='clear: both;'/>
<span style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Reade more >></b></a></span>
</b:if>

5. Klik Simpan Template. Selesai.

Cara Membuat Like Facebook Melayang dengan tombol Close

Cara Membuat Like Facebook Melayang dengan tombol Close , setelah dulu saya share  Cara Membuat Iklan Melayang di Blog dengan Tombol Close untuk yang kali ini saya buat Cara Membuat Like Facebook Melayang dengan tombol Close .  Silahkan simak tutorialnya sebagai berikut :

1. Login Blogger
2. Pilih Design
3. Add gadget / Tambah Gadget
4. Pilih HTML/JavaScript
5. Copy Kode Berikut :

<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
background-color: transparancy;
width: 300px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
 barheight=document.getElementById("topbar").offsetHeight
 var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
 var d = document;
 function ml(id){
  var el=d.getElementById(id);
  if (!persistclose || persistclose && get_cookie("remainclosed")=="")
  el.style.visibility="visible"
  if(d.layers)el.style=el;
  el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
  el.x = startX;
  if (verticalpos=="fromtop")
  el.y = startY;
  else{
  el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
  el.y -= startY;
  }
  return el;
 }
 window.stayTopLeft=function(){
  if (verticalpos=="fromtop"){
  var pY = ns ? pageYOffset : iecompattest().scrollTop;
  ftlObj.y += (pY + startY - ftlObj.y)/8;
  }
  else{
  var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
  ftlObj.y += (pY - startY - ftlObj.y)/8;
  }
  ftlObj.sP(ftlObj.x, ftlObj.y);
  setTimeout("stayTopLeft()", 10);
 }
 ftlObj = ml("topbar");
 stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOXQQ1P6a_QDIX-IsfcHNNaWXUfbIFEey5OG3qF6NeJ8JErBo5nhJVkb7EdUzMYiInwzTIf46NdItNio72jOXk8-6CyBN1sTVVGu5J6SrjV9siRhr-w3fMJY33vye5PjE428Gfx2nWks0u/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">


SIMPAN KODE HTML FACEBOOK  / TWITTER ANDA DISINI


</div>
</center>
</div>

6. Save Template

   Demikian Tutorial Cara Membuat Like Facebook Melayang dengan tombol Close , semoga bermanfaat untuk anda dan selamat mencoba. Terimakasih sudah berkunjung dan semoga bermanfaat untuk anda semuanya.

Cara Membuat Iklan Melayang di Blog dengan Tombol Close

 Cara Menbuat Iklan Melayang di Blog dengan Tombol Close, sobat ingin pasang iklan melayang pada blog sobat? nah disini saya akan membagikan tutorial Cara Memasang Iklan Melayang dengan Tombol Close. Langsung saja kita praktekkan yah sobat Cara Memasang Iklan Melayang dengan Tombol Closenya :

1. Login pada blogger
2. Design
3. Add Gadget atau tambah gadget
3. HTML/JavaScript
4. Copy-Paste kode berikut :

<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.
</a>
</div>
<center>

Masukan Kode iklan atau Gambar anda di sini

</center>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></center></div></div>

5. Lalu save

   Nah begitulah Cara Membuat Iklan Melayang di Blog dengan Tombol Close, semoga tutorial ini bermanfaat bagi anda. Terimakasih sudah berkunjung dan semoga bermanfaat untuk anda semuanya.

My Inspiration

Terima kasih

Kamu telah menjadi motifasi

ISPIRASIKU