Tambahkan Kotak Pencarian Sleek Dengan Tombol Sosial Untuk Blogger
Kotak Pencarian adalah gadget yang berguna di blogger, karena pengguna dapat mencari posting dari kata kunci, itu akan cara mudah untuk menemukan posting, ketika kita tidak dapat menemukan posting dari kategori. Di kotak pencarian ini saya sertakan dengan ikon jejaring sosial. Ini termasuk dengan efek hover. Jadi, Anda dapat menautkan profil jejaring sosial Anda dengan gadget ini. Ini akan membantu Anda meningkatkan pengikut juga. Anda dapat menambahkan widget ini dengan beberapa langkah, hanya menggunakan tambahkan gadget ke, tambahkan ke blogger. Ikuti di bawah ini Langkah-langkah untuk menambahkannya ke blog Anda.
1. Masuk ke akun blogger → Buka Desain → Elemen Halaman 2. Klik Tambah Gadget dan pilih 'HTML / Javascript' 3. Tempel salah satu kode di bawah ini. (Pilih gaya) Gaya 1
<style type="text/css">
/* ---------http://mix--er.blogspot.com----------- */
#Bt-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-yLXFHfCDxGkhb8SMlqkwrkNVN6Zsy437rX5X4_vNS1xBXM_wzxSrA_AxFhqX_c79_dCEvsFVKlXrz-6nvdaFLPakBhZLhFm-CMtRbOR_UtZFG3Y5gAk1SJ3ib55sQev5M9f198JfWgA/s1600/whitez+by+abt+-+Copy.png) no-repeat scroll center center transparent;width:290px;height:80px;display:block;border:1px solid #000000;}
form#Bt-searchform{display: block;padding: 10px 12px;margin:0;}
form#Bt-searchform #s{padding: 6px;margin-left:7px;width: 235px;font-size:14px;color:#000000;vertical-align: top;border:none;background:transparent;}
form#Bt-searchform #sbutton{margin-left:215px;margin-top: -30px;padding:0;height:30px;width:60px;vertical-align: top;border:none;background:transparent;}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px}
.social-connect-widget img:hover{
opacity:0.4;
filter:alpha(opacity=40);
}</style>
<div id="Bt-searchbox">
<form id="Bt-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>
<div class='social-connect-widget' style='margin-top:-30px;margin-bottom:10px;margin-left:15px;'>
<a href='http://twitter.com/username'><img alt='Follow Us on Twitter!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwPmzncGN1lEIoVKRe6F2YgzhFzRWF-ajyc0p82G96LtvHYHcTApXyyC3F9R-SQbbUArhzO25itivYyE6msWRfdaCmH7VVghGKkNU9pANTpRP6wBuZ_YGRnL9IrOMgEwDabgHjA9M7by4/s1600/twitter.png' title='Follow Us on Twitter!'/></a>
<a href='http://facebook.com/username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKPxgjjgiyrM1f57Uzn60E1DMbvolP-TCGJ3B1LAMvs7zUnws-k1pougJOpzAMNS4SD5xMqHwa7-co7IrA099tF59Wa9ZbFQxvlNIqDUcj1eq14dVqGgK0LJPhf63T82o_mxwR6AjBVpQ/s1600/facebook.png' title='Be Our Fan'/></a>
<a href='http://stumbleupon.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgezne2Sp4PFcQkVgTPEqfH0D-MNJwiJd1iGf69DsHgznOVk80dHqQZbCleXV5FyMyR5_msCzS4mL88Kql5TFx1m466MV4ct-YYwzmw7tj7ilW0MLBFqwm24JYWVkMKomuDT4-o-H6yk2I/s1600/stumbleupon.png' title='Follow Us'/></a><a href='https://plus.google.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3oP0Y-EVIRKkoMrXBPY_dG5zYJxKex7xAd2yVFcxKiucTaXjPF97bGifVKwwH7YSYxevu3JWz_6S1c20H6qqybrBON17hHSDLxcC9IDpqnozdtrGoG6I4jOpG1hyphenhyphens_jZrQFwUmP_Qwq8/s1600/google.png' title='Follow Us'/></a>
<a href='http://digg.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwT4mvVwn6E_AdLCrelz_K5XkRp0atbmCsHN690DJ0ieDGmOfg9zplYcr32vJhyb3Z0tt457LmiPkylUtgv50NGZ2Dvyt_v2efojRXpzxt_3eZYWpkGYDqOGmN1yMg5F5vWYhXSIucQqs/s1600/digg.png' title='Follow Us'/></a>
<a href='http://feeds.feedburner.com/feedname'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi54YTexonbwBVSilScOUGIvia28IFc_lz-kMWoyHlASNHugsw9rPFHmlj3EpRca9DTRqEHGB96jrWTAG5JtQY2rCBdibXGSoKUWxA7ULxeAiFmZlWbwwIh0hSNzDCUiO5EPoJq8tvEbLA/s1600/rss.png' title='RSS Feed'/></a><a href='http://mix--er.blogspot.com'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikDPFDHhJVtI-FnzUJ7oPy01yIqN_r6PW9arJKowbDeQcczDD2ixMoXk3feg9P1mX3NYyMTkxbvyP_KAGoW8g_t70uab6oxDZJ0VGlhl-qQx3DunB4yR5PC2NA254hAFK3-D4xHqnizoI/s1600/image.png' target='_blank'/></a>
</div>
Gaya 2
<style type="text/css">
/* ---------http://mix--er.blogspot.com----------- */
#Bt-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDuWw5KYFJp3tVrBIRNzeGtFbNz_T36LuU06LMJTH2praMb6xzSobmfC-N3dfBra-X6Hct3RzC_WPouuN0HSdM81Nk8sW8njlLo0NczSv1GEWgUVnCjZ0SyV432hv0br4aZ-kmhLk-xq8/s1600/pink.png) no-repeat scroll center center transparent;width:290px;height:80px;display:block;border:1px solid #000000;}
form#Bt-searchform{display: block;padding: 10px 12px;margin:0;}
form#Bt-searchform #s{padding: 6px;margin-left:7px;width: 235px;font-size:14px;color:#000000;vertical-align: top;border:none;background:transparent;}
form#Bt-searchform #sbutton{margin-left:215px;margin-top: -30px;padding:0;height:30px;width:60px;vertical-align: top;border:none;background:transparent;}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px}
.social-connect-widget img:hover{
opacity:0.4;
filter:alpha(opacity=40);
}</style>
<div id="Bt-searchbox">
<form id="Bt-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>
<div class='social-connect-widget' style='margin-top:-30px;margin-bottom:10px;margin-left:15px;'>
<a href='http://twitter.com/username'><img alt='Follow Us on Twitter!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwPmzncGN1lEIoVKRe6F2YgzhFzRWF-ajyc0p82G96LtvHYHcTApXyyC3F9R-SQbbUArhzO25itivYyE6msWRfdaCmH7VVghGKkNU9pANTpRP6wBuZ_YGRnL9IrOMgEwDabgHjA9M7by4/s1600/twitter.png' title='Follow Us on Twitter!'/></a>
<a href='http://facebook.com/username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKPxgjjgiyrM1f57Uzn60E1DMbvolP-TCGJ3B1LAMvs7zUnws-k1pougJOpzAMNS4SD5xMqHwa7-co7IrA099tF59Wa9ZbFQxvlNIqDUcj1eq14dVqGgK0LJPhf63T82o_mxwR6AjBVpQ/s1600/facebook.png' title='Be Our Fan'/></a>
<a href='http://stumbleupon.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgezne2Sp4PFcQkVgTPEqfH0D-MNJwiJd1iGf69DsHgznOVk80dHqQZbCleXV5FyMyR5_msCzS4mL88Kql5TFx1m466MV4ct-YYwzmw7tj7ilW0MLBFqwm24JYWVkMKomuDT4-o-H6yk2I/s1600/stumbleupon.png' title='Follow Us'/></a><a href='https://plus.google.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3oP0Y-EVIRKkoMrXBPY_dG5zYJxKex7xAd2yVFcxKiucTaXjPF97bGifVKwwH7YSYxevu3JWz_6S1c20H6qqybrBON17hHSDLxcC9IDpqnozdtrGoG6I4jOpG1hyphenhyphens_jZrQFwUmP_Qwq8/s1600/google.png' title='Follow Us'/></a>
<a href='http://digg.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwT4mvVwn6E_AdLCrelz_K5XkRp0atbmCsHN690DJ0ieDGmOfg9zplYcr32vJhyb3Z0tt457LmiPkylUtgv50NGZ2Dvyt_v2efojRXpzxt_3eZYWpkGYDqOGmN1yMg5F5vWYhXSIucQqs/s1600/digg.png' title='Follow Us'/></a>
<a href='http://feeds.feedburner.com/feedname'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi54YTexonbwBVSilScOUGIvia28IFc_lz-kMWoyHlASNHugsw9rPFHmlj3EpRca9DTRqEHGB96jrWTAG5JtQY2rCBdibXGSoKUWxA7ULxeAiFmZlWbwwIh0hSNzDCUiO5EPoJq8tvEbLA/s1600/rss.png' title='RSS Feed'/></a><a href='http://mix--er.blogspot.com'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikDPFDHhJVtI-FnzUJ7oPy01yIqN_r6PW9arJKowbDeQcczDD2ixMoXk3feg9P1mX3NYyMTkxbvyP_KAGoW8g_t70uab6oxDZJ0VGlhl-qQx3DunB4yR5PC2NA254hAFK3-D4xHqnizoI/s1600/image.png' target='_blank'/></a>
</div>
Gaya 3
<style type="text/css">
/* ---------http://mix--er.blogspot.com----------- */
#Bt-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhscteTJVXfOXCmIuzuf2majY-LQ1-X-rOPIGfIJWYbIeCFbE0rpIwWslHd4jh1TlFGs8iPJKBr04f_DLLt1iqAS7IATM-FC8Qjfkdn2Ukie_pDDPqErVThSr7NR80pl5aNFz3yFzaAxWo/s1600/orange.png) no-repeat scroll center center transparent;width:290px;height:80px;display:block;border:1px solid #000000;}
form#Bt-searchform{display: block;padding: 10px 12px;margin:0;}
form#Bt-searchform #s{padding: 6px;margin-left:7px;width: 235px;font-size:14px;color:#000000;vertical-align: top;border:none;background:transparent;}
form#Bt-searchform #sbutton{margin-left:215px;margin-top: -30px;padding:0;height:30px;width:60px;vertical-align: top;border:none;background:transparent;}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px}
.social-connect-widget img:hover{
opacity:0.4;
filter:alpha(opacity=40);
}</style>
<div id="Bt-searchbox">
<form id="Bt-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>
<div class='social-connect-widget' style='margin-top:-30px;margin-bottom:10px;margin-left:15px;'>
<a href='http://twitter.com/username'><img alt='Follow Us on Twitter!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwPmzncGN1lEIoVKRe6F2YgzhFzRWF-ajyc0p82G96LtvHYHcTApXyyC3F9R-SQbbUArhzO25itivYyE6msWRfdaCmH7VVghGKkNU9pANTpRP6wBuZ_YGRnL9IrOMgEwDabgHjA9M7by4/s1600/twitter.png' title='Follow Us on Twitter!'/></a>
<a href='http://facebook.com/username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKPxgjjgiyrM1f57Uzn60E1DMbvolP-TCGJ3B1LAMvs7zUnws-k1pougJOpzAMNS4SD5xMqHwa7-co7IrA099tF59Wa9ZbFQxvlNIqDUcj1eq14dVqGgK0LJPhf63T82o_mxwR6AjBVpQ/s1600/facebook.png' title='Be Our Fan'/></a>
<a href='http://stumbleupon.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgezne2Sp4PFcQkVgTPEqfH0D-MNJwiJd1iGf69DsHgznOVk80dHqQZbCleXV5FyMyR5_msCzS4mL88Kql5TFx1m466MV4ct-YYwzmw7tj7ilW0MLBFqwm24JYWVkMKomuDT4-o-H6yk2I/s1600/stumbleupon.png' title='Follow Us'/></a><a href='https://plus.google.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3oP0Y-EVIRKkoMrXBPY_dG5zYJxKex7xAd2yVFcxKiucTaXjPF97bGifVKwwH7YSYxevu3JWz_6S1c20H6qqybrBON17hHSDLxcC9IDpqnozdtrGoG6I4jOpG1hyphenhyphens_jZrQFwUmP_Qwq8/s1600/google.png' title='Follow Us'/></a>
<a href='http://digg.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwT4mvVwn6E_AdLCrelz_K5XkRp0atbmCsHN690DJ0ieDGmOfg9zplYcr32vJhyb3Z0tt457LmiPkylUtgv50NGZ2Dvyt_v2efojRXpzxt_3eZYWpkGYDqOGmN1yMg5F5vWYhXSIucQqs/s1600/digg.png' title='Follow Us'/></a>
<a href='http://feeds.feedburner.com/feedname'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi54YTexonbwBVSilScOUGIvia28IFc_lz-kMWoyHlASNHugsw9rPFHmlj3EpRca9DTRqEHGB96jrWTAG5JtQY2rCBdibXGSoKUWxA7ULxeAiFmZlWbwwIh0hSNzDCUiO5EPoJq8tvEbLA/s1600/rss.png' title='RSS Feed'/></a><a href=http://mix--er.blogspot.com/'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikDPFDHhJVtI-FnzUJ7oPy01yIqN_r6PW9arJKowbDeQcczDD2ixMoXk3feg9P1mX3NYyMTkxbvyP_KAGoW8g_t70uab6oxDZJ0VGlhl-qQx3DunB4yR5PC2NA254hAFK3-D4xHqnizoI/s1600/image.png' target='_blank'/></a>
</div>
Gaya 4
<style type="text/css">
/* ---------http://mix--er.blogspot.com----------- */
#Bt-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvu5LodBNqyzqdasg5z5rCaPvjUIgsHgFr_6uZITKYyo2uVUQP-LFRSS1rUu5za6dJthSR8y0enRNae4G76sCmEUCuITAg8ctlX2Tkb9J3IRiZ2Df_yprNZ6iB-rVY_EO_YNdy7VzujHo/s1600/black.png) no-repeat scroll center center transparent;width:290px;height:80px;display:block;border:1px solid #000000;}
form#Bt-searchform{display: block;padding: 10px 12px;margin:0;}
form#Bt-searchform #s{padding: 6px;margin-left:7px;width: 235px;font-size:14px;color:#000000;vertical-align: top;border:none;background:transparent;}
form#Bt-searchform #sbutton{margin-left:215px;margin-top: -30px;padding:0;height:30px;width:60px;vertical-align: top;border:none;background:transparent;}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px}
.social-connect-widget img:hover{
opacity:0.4;
filter:alpha(opacity=40);
}</style>
<div id="Bt-searchbox">
<form id="Bt-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>
<div class='social-connect-widget' style='margin-top:-30px;margin-bottom:10px;margin-left:15px;'>
<a href='http://twitter.com/username'><img alt='Follow Us on Twitter!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwPmzncGN1lEIoVKRe6F2YgzhFzRWF-ajyc0p82G96LtvHYHcTApXyyC3F9R-SQbbUArhzO25itivYyE6msWRfdaCmH7VVghGKkNU9pANTpRP6wBuZ_YGRnL9IrOMgEwDabgHjA9M7by4/s1600/twitter.png' title='Follow Us on Twitter!'/></a>
<a href='http://facebook.com/username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKPxgjjgiyrM1f57Uzn60E1DMbvolP-TCGJ3B1LAMvs7zUnws-k1pougJOpzAMNS4SD5xMqHwa7-co7IrA099tF59Wa9ZbFQxvlNIqDUcj1eq14dVqGgK0LJPhf63T82o_mxwR6AjBVpQ/s1600/facebook.png' title='Be Our Fan'/></a>
<a href='http://stumbleupon.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgezne2Sp4PFcQkVgTPEqfH0D-MNJwiJd1iGf69DsHgznOVk80dHqQZbCleXV5FyMyR5_msCzS4mL88Kql5TFx1m466MV4ct-YYwzmw7tj7ilW0MLBFqwm24JYWVkMKomuDT4-o-H6yk2I/s1600/stumbleupon.png' title='Follow Us'/></a><a href='https://plus.google.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3oP0Y-EVIRKkoMrXBPY_dG5zYJxKex7xAd2yVFcxKiucTaXjPF97bGifVKwwH7YSYxevu3JWz_6S1c20H6qqybrBON17hHSDLxcC9IDpqnozdtrGoG6I4jOpG1hyphenhyphens_jZrQFwUmP_Qwq8/s1600/google.png' title='Follow Us'/></a>
<a href='http://digg.com/Username'><img alt='Be Our Fan!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwT4mvVwn6E_AdLCrelz_K5XkRp0atbmCsHN690DJ0ieDGmOfg9zplYcr32vJhyb3Z0tt457LmiPkylUtgv50NGZ2Dvyt_v2efojRXpzxt_3eZYWpkGYDqOGmN1yMg5F5vWYhXSIucQqs/s1600/digg.png' title='Follow Us'/></a>
<a href='http://feeds.feedburner.com/feedname'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi54YTexonbwBVSilScOUGIvia28IFc_lz-kMWoyHlASNHugsw9rPFHmlj3EpRca9DTRqEHGB96jrWTAG5JtQY2rCBdibXGSoKUWxA7ULxeAiFmZlWbwwIh0hSNzDCUiO5EPoJq8tvEbLA/s1600/rss.png' title='RSS Feed'/></a><a href='http://mix--er.blogspot.com/'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikDPFDHhJVtI-FnzUJ7oPy01yIqN_r6PW9arJKowbDeQcczDD2ixMoXk3feg9P1mX3NYyMTkxbvyP_KAGoW8g_t70uab6oxDZJ0VGlhl-qQx3DunB4yR5PC2NA254hAFK3-D4xHqnizoI/s1600/image.png' target='_blank'/></a>
</div>
* Ganti USERNAME Dengan Nama Pengguna Twitter.
* Ganti USERNAME Dengan Nama Pengguna faceook.
* Ganti USERNAME Dengan Nama pengguna stumbleupon.
* Ganti USERNAME Dengan digg Nama pengguna.
* Ganti USERNAME Dengan nama feedburner.
4. Simpan HTML / Javascript. kamu selesai.
0 komentar:
Posting Komentar