Sunday, February 2, 2014

Widget Sosial Media Icon Dengan Search Box Untuk Blogger


  • Login Ke Blogger
  • Pilih Menu ''Tata letak'' >> Klik ''Tambah Gadget''
  • Klik Gadget ''HTML/JavaScript
  • Taruhlah kode di bwah ini di dalamnya
<style>
#btrixwidget{width:307px;
padding:0 0 5px 0;
border:1px solid black;}

#btrix-searchbox {
    border-radius: 5px;
    background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvi6zmllONcsyPtPr3D346FvoH4p3saCdVn3ZX2IAfcMlepfoSBAt-QwYIi-lHcUO6RST3gc44HMUNEc0C9uwP8Az8sZ02-41qag-1mJx8JI2LUJ8h8AVJEVjYd4CHEMLGX0PXcnSB8EHU/s1600/blue.png) no-repeat scroll center center transparent;
    width: 307px;
    height: 50px;
    disaply: block;
}

form#btrix-searchform {
    display: block;
    padding: 9px 16px;
    margin: 0;
}

form#btrix-searchform #s {
    padding-left: 24px !important;
    padding: 7.5px;
    margin: 0;
    width: 198px;
    font-size: 16px;
    font-family: georgia;
    font-style: italic;
    color: #666666;
    vertical-align: top;
    border: none;
    background: transparent;
}

form#btrix-searchform
#sbutton {
    margin: 0;
    padding: 0;
    height: 40px;
    width: 74px;
    vertical-align: top;
    border: none;
    background: transparent;
}
</style>

<div id="btrixwidget"><center>
<a href="http://twitter.com/USERNAME" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdRmISNDDHBAlEGFtUWjKo5FWK75cDV3ExbdboK-45dsUUP1BOmmLqVohi68LoM0PBgT-h9JKtncvi6MFlMQgQaBZghdPkYwJnlUU_yods9dVA7vOKDyDdPh9Q75o9zxSasp7Q5mGicM/s1600/btrix-twitter.png" alt="" title="twitter" width="62" height="78" class="alignnone size-full wp-image-6249"></a>

<a href="http://www.facebook.com/USERNAME" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcf2yd4zaSLVvsZLB5BnQQtLxwpgLie63ufClNiEDY94WjQrG0p3x3FgCrWJ-gIq-healiCqpZFS_2skbcEC2AAr8HMqfbNvSYGZ9Ie8Tw19M5gZgfrUBc32QIU6twfuZZCfC32I6Q_4Y/s1600/btrix-facebook.png" alt="" title="facebook" width="62" height="78" class="alignnone size-full wp-image-6248"></a>

<a href="http://feeds.feedburner.com/ID Anda" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_11gQlwqMtUqHzERjIVccdgDGFV39D6jLwDpDfv30fPAedJmMo-QgsnjMUe6FvbDg0aCodd5DEiu6RpirfrNWct7cqrx94hsXjU5osSMoBnbtpHKJFkXInoR5ZdiQ_4jWlCyQIaDBWJ0/s1600/btrix-rss.png" alt="" title="rss" width="62" height="78" class="alignnone size-full wp-image-6251"></a>

<a href="http://au.linkedin.com/username" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7LrqloFs8Dyeq27C_ipBaGTVnqeXjwECdsYjnDJUx938Mb3Ejq_VD19-VVbDihImaWbY7859edpHuKCR0xhiC2gtsAq_FU7OV9uIDc1hRxqHp045sIhwsWrHi4rmRFjF5wo39PqKnx3Y/s1600/btrix-linkedin.png" alt="" title="linkedin" width="62" height="78" class="alignnone size-full wp-image-6250"></a>

<div id="btrix-searchbox">
    <form id="btrix-searchform" action="/search" method="get">
        <input type="text" id="s" 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="sbutton"
        />
    </form>
</div>
</center>
</div>
  • USERNAME Ganti dengan username twitter anda
  • USERNAME Ganti dengan usename facebook anda
  • ID Anda Ganti dengan ID FeedBurner anda
  • USERNAME Ganti dengan username linkedin anda
  • Setelah di Edit, Sekarang Klik Simpan
Comments
0 Comment