Showing posts with label Search Box. Show all posts
Showing posts with label Search Box. Show all posts

August 13, 2011

How To Add Google Index Pages Checker


Today i'm tell you how to add cool gadget to your website, this is a small and faster gadget! this tool has a very cool design! when you enter the "site:" operator with your chosen URL. It will return the total link count for each URL. this count url of google search engine only. i hope you really like this gadget so add your comments and share with you friends.Thank you.

1.Login to your dashboard--> Design- ->Page Elements

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the code given below and click save.














<form method="get" action="http://www.google.com/search" target="_blank" rel="nofollow"><input name="q" value="site:" maxlength="255" size="40" type="text"><input value="Google Index" type="submit"><input value="en" name="hl" type="hidden"></form>


Note: To check google index pages ,Enter URL with http:// after the word site:


You are done.

Picture From: http://www.personal.psu.edu/esc10/blogs/E-Tech/2008/10/google-2001.html

How To Add Smart CSS Search Box to Blogger V1


Many bloggers have a google custom search gadget. but i do not like google custom search gadget! so here is the right way to add CSS Search Box to blogger side bar. this is very cool gadget and have a cool design. now you can add this gadget to your blog. Please read below steps and add this gadget. so please add your ideas, comments and anything here..nice day!

1.Login to your blogger dashboard--> Design -> Edit HTML

2.Scroll down to where you see </head> tag .

3.Copy below code and paste it just before the </head> tag






<style type='text/css'>
.formbutton{
cursor:pointer;
border:solid 4px #ccc;
background:#999;
color:#fff;
font-weight:bold;
padding: 1px 2px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAz690SeM-AqLToWSlFOkPv7WhfwPSFwsXRWTpg4NO_VY3HRumNqIjpOFtBiBcy_KXlqrHbyLinrZxLrNZRf-QQpFTcnaNfuc4aJ0z40Rwj0-pdkX6_eLuNGmerTS_DNwyzto6N2IXHLQ/) repeat-x left top;
}
.formbox{
border:solid 5px #000000;
background:#ffffff;
color:#000;
font-weight:normal;
padding: 1px 2px;
}
</style>


NOTE:You can change background image,colors,borders,.. as your choice.

4.Now save your template.

5.Go to Layout-->Page Elements and click on "Add a gadget".

6.Select "html/java script" and add the code given below and click save

<form id="searchthis" action="http://YOURBLOG.blogspot.com/search" style="display:inline;" method="get">
<input id="b-query" class="formbox" maxlength="255" name="q" size="35" type="text"/>
<input id="b-searchbtn" class="formbutton" value="Search" type="submit"/>
</form>


Note:Replace "YOURBLOG" with your blog name.

You are done

How To Add Smart CSS Search Box to Blogger V2


Hi! dear visitors. Here is the CSS search box v2 gadget. i think this better thank older css search box v1. so here is the new way to add CSS Search Box v2 to blogger side bar. this is very cool gadget and have a cool design. now you can add this gadget to your blog. Please read below steps and add this gadget. it's very charm and beautiful. so please add your ideas, comments and anything here.Thank You..

1.Login to your blogger dashboard--> Design- -> Edit HTML

2.Scroll down to where you see </head> tag .

3.Copy below code and paste it just before the </head> tag






<style type='text/css'>
#search {
height:34px;
width:auto;
margin-top:10px;
padding:17px 5px 10px 15px;
width:311px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-5pXj_jrKIEuIV-kO03KsTLfuMLeA5mdnuTEfG7GGSPDkTWhTghTV8uJKyEBgHqv1k9Zl_YucGd3J6cpWXG9z5P_XO1lazO37nhLSjZHRXYsVTGd4KkN-RguxTbDW1Dv3Q3_Df9pm5TBH/);
}
#search form {
margin: 0;
padding: 0;
}

#search fieldset {
margin: 0;
padding: 0;
border: none;
}

#search p {
margin: 0;
font-size: 85%;
}

#s {
margin-left:0px;
float: left;
width:231px;
padding: 6px 2px 6px 5px;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB5h08ahbP_7rNaB0TOq_nD4IuY4aou2Nl9iPql9ah1DtMd2jHD97Jtv5u0WcjudYlf0k1CBsgqfftC149cW92YR1Y_RNTglOV6ezmbShyDSavS8OGdwrZQA_L9TJAOMnapWP3WK9JUOo9/s1600/sform.png) no-repeat;
border:none;
font: normal 100% &quot;Tahoma&quot;, Arial, Helvetica, sans-serif;
color:#C6C6C6;
}

#searchsubmit {
width:57px;
float: left;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaH2Nip02oL0coeJ2hN2YvFZRPu-Ln4VG8KqqcCjI68mLeuqYc_YxpnQ2Kn_NLpiZ7OnIH7Xk3drtuS1vWX3oKCky084EoKewotvfekmkMuJZILhrkOU986q7PvMYHzcFgZ_k0gnq1BFzN/);
border:none;
font: bold 100% &quot;century gothic&quot;, Arial, Helvetica, sans-serif;
color: #FFFFFF;
height:28px;
margin-left:5px;
}

</style>


Note:Please host above 3 images yourself.

4.Now save your template.

5.Go to Layout-->Page Elements and click on "Add a gadget".

6.Select "html/java script" and add the code given below and click save

<div id='search'>
<form id="searchform" action="http://YOURBLOG.blogspot.com/search" style="display:inline;" method="get">
<input id="s" name="q" type="text" value=""/>
<input id="searchsubmit" value="" type="submit"/>
</form>
</div>


Note: Remember to replace "YOURBLOG" with your blog name.

You are done

August 12, 2011

How To Add Search Box to Search in Your Blogsite(Website)


Hi my dear visitors. today im gonna show you how to a search box to blogger, I my self find out that Blogger Search engine is not good . Its result is not accuracy . I search for a term but it give me some posts that is not related to what I search . so here is the custom search box to blogger. i hope you really like my bpost. thank you for visitng my blog! we will meet again in next post.!












1.Login to your blogger account.Go Design--> Add a Gadget --> Select “HTML/JavaScript

2.Copy below code and paste it.Click save and refresh your site

<p align="left">
<form id="searchthis" action="YOUR BLOG URL/search" style="display:inline;" method="get">
<strong>NAME OF YOUR BLOG<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" value="Search" type="submit"/>
</form></p>



Note: Remember to replace "YOUR BLOG URL" and "NAME OF YOUR BLOG" with your
details.
If you want to change the size of your search box than just change the value 20 to 35(any
value you like to get a bigger search box.
You can also change the “Search” button to say, “Hit” or “Go” or "Enter" or "Read more",
by changing the Value in the above html code.

3.You can see search box like below one.


Tips n Tricks