Di perjalanan blog saya yang ke 2 (dua) ini saya akan posting cara membuat tombol
Pencarian alexa, buat di web - blog, tentu widgate pencarian dari alexa ini sangat lah
Bagus ramping elegant, walau di web - blog ada bawa,an default nya juga tidak ada
Salah nya kalau teman dan sobat blogging mencoba, artikel ini silahkan simak disini
Berikut di bawah cara memasang widgate Modifikasi kotak pencarian dengan widgate alexa
Masuk ke akun web | blog atau | wordpress anda dan sigin
Lalu pilih dashboard untuk blogger elemen halaman | layout
Selanjut nya tambah gadget kemudian pilih html jangan compose javascript
Dan selanjut nya copy code di bawah ini dan paste pada mode html javascript
<style>
.border { border: 1px#ccc;border-style:solid; margin:1em 4em 0em 1em;width:90%;padding:10px 2px 3px 5px;-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}
.border:hover{
-moz-box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
}
.balexa {
font: bold 12px Tahoma, Geneva, sans-serif,"times new roman";
font-style: normal;
color: #ffffff;
background: #186adf;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #15a299;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 7px 15px;
cursor:pointer;
margin: 5px 0 0 3px auto;
}
.balexa:active {
cursor:wait;
position: relative;
top: 2px;
}
.balexa::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
.blsbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.blsbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
</style>
<div class='border'>
<form method="get" action="http://www.alexa.com/data/details/traffic_details" target="_blank" rel="nofollow">
<input class="blsbox" name="url" maxlength="255" size="40" type="text" onblur='if (this.value == "") {this.value = "Enter the Url...";}'
onfocus='if (this.value == "Enter the Url...") {this.value = ""}'
type="text" value="Enter the Url..." />
<input value="Alexa" type="submit" class="balexa" /></form>
</div
.border { border: 1px#ccc;border-style:solid; margin:1em 4em 0em 1em;width:90%;padding:10px 2px 3px 5px;-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}
.border:hover{
-moz-box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
box-shadow: inset 1px 1px 10px 1px rgba(001, 001, 222, 0.4);
}
.balexa {
font: bold 12px Tahoma, Geneva, sans-serif,"times new roman";
font-style: normal;
color: #ffffff;
background: #186adf;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #15a299;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 7px 15px;
cursor:pointer;
margin: 5px 0 0 3px auto;
}
.balexa:active {
cursor:wait;
position: relative;
top: 2px;
}
.balexa::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
.blsbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.blsbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
</style>
<div class='border'>
<form method="get" action="http://www.alexa.com/data/details/traffic_details" target="_blank" rel="nofollow">
<input class="blsbox" name="url" maxlength="255" size="40" type="text" onblur='if (this.value == "") {this.value = "Enter the Url...";}'
onfocus='if (this.value == "Enter the Url...") {this.value = ""}'
type="text" value="Enter the Url..." />
<input value="Alexa" type="submit" class="balexa" /></form>
</div
Setelah semua nya terpasang dengan benar, lalu save simpan penempatan widgate ini
Silahkan menurut selera anda di sidebar di header di foter atau dimana saja sesuka anda
Anda juga bisa memasang widgate rank alexa, dan toolbar alexa buka halaman di bawah ini :
Buka halaman : Menurun Kan Rank Alexa Secepat Kilat
Buka halaman : Membuat Widgate Info Alexa
Buka halaman : Install Toolbar Alexa
Selengkap nya buka halaman di bawah ini :
Silahkan buka : Modifikasi kotak pencarian dengan widgate alexa