Industry guru Dave Taylor offers tech support on technical and business topics, including iPhone, iPod, Microsoft Windows, Sony PSP, cellphones, online advertising, CSS, Web design, business, Unix, Linux, SEO, Mac OS X, and shell script programming.     


Modifying search strings on Google site search?

I saw your answer regarding how to modify a Google search box to only look through a specified subdirectory on my site (see Search only subdirectory in Google) and it's interesting, but where's the actual code? I need something I can cut and paste, please!


Dave's Answer:

You're right. I wimped out last time and wrote about the theory behind constraining a search to a specific subdirectory but deferred actually presenting the script. To go back to the beginning, I addressed a question regarding how to modify the Google site search script I wrote about a while back so that it would only search a specific directory rather than your entire site. You'll want to start here: Add a Google site search box to your Web site, then read How to only search a site subdirectory with Google.

Now, in this set of scripts, I am going to assume that you have already spent some time testing different constraints on Google itself and have figured out the specific element you need for things to work. For this example, I'll use inurl:helpdir, though I don't actually have that subdirectory here on Ask Dave Taylor. Got it? :-)

There are two main ways you can take a search string and tweak it to add a specific field. Well, no, there are three. The first is that you can simply add a small snippet of text where you tell your visitors tip: add 'inurl:helpdir' to search our help files, but that's pretty lame and I certainly don't see it as a viable solution.

The two solutions in my head are either to preload the search string with the additional constraint needed - and automatically position the cursor after that passage in the field when selected, or to append the desired constraint to the search string just before it's passed on to Google itself.

This first one is surprisingly tricky and even my pal Dori Smith, author of some of the very best JavaScript books (notably including JavaScript and AJAX Visual Quickstart and JavaScript Essential Training) had to poke around before she solved it. Here's her solution code:

var tempField = document.getElementById("thisField").value;
document.getElementById("thisField").value = tempField;
document.getElementById("thisField").focus();

The specific text field we'd want to have pre-loaded would need to be called "thisField", as in:

<input type="text" name="thisField" id="thisField" value="inurl:helpdir " />

This is cool - it's the same technique Facebook uses in its status field, which preloads "is " when you go to modify your status - but it's also pretty complicated and doesn't quite solve the problem originally posed.

Fortunately the second solution is not only far easier, but much more useful too, because truth be told, if you want the search to be constrained to just your helpdir (or any other directory or set of directories) you don't want users seeing the constraint or being able to tweak it.

The alternative then is to simply append the constraint (inurl:helpdir) to the text field value just before the user's input is sent off to Google for processing. This is done by tying the append to the onSubmit event handler in the actual form tag.

Here's our original search box, so let's start there:

<form method="get" action="http://www.google.com/search">

<div style="border:1px solid black;padding:4px;width:20em;">
<table border="0" cellpadding="0">
<tr><td>
<input type="text" name="q" size="25"
maxlength="255" value="" />
<input type="submit" value="Google Search" /></td></tr>
<tr><td align="center" style="font-size:75%">
<input type="checkbox" name="sitesearch"
value="askdavetaylor.com" checked /> only search Ask Dave Taylor<br />
</td></tr></table>
</div>

</form>

What we want to do is to add the event handler, which looks like this:

<form method="get" action="http://www.google.com/search"
onsubmit='document.getElementById("q").value += " inurl:helpdir";'>

<div style="border:1px solid black;padding:4px;width:20em;">
<table border="0" cellpadding="0">
<tr><td>
<input type="text" name="q" size="25" id="q"
maxlength="255" value="" />
<input type="submit" value="Google Search" /></td></tr>
<tr><td align="center" style="font-size:75%">
<input type="checkbox" name="sitesearch"
value="askdavetaylor.com" checked /> only search Ask Dave Taylor<br />
</td></tr></table>
</div>

</form>

That's all there is to this modification of the search box. One new line of code to append the string just before the form data is sent, and a tiny tweak to assign a (necessarily unique on the page) id to the actual input field so that we can access it with the JavaScript method getElementById.

That should solve your problem neatly, I think! Please let us know how it worked out.

Thanks again to Dori Smith, my JavaScript guru pal, and John Minnihan for their help with this entry.

More Useful HTML, JavaScript and Web Site Programming Articles:
✔   How to Create Predefined Google Image Search Links?
Thanks for the Amazon URL [see Creating Amazon Search Links]. That worked beautifully. In fact, I sent you $5.00 for coffee in thanks....
✔   Can I embed a Facebook search box on my blog site?
I've seen your articles about how to add a Twitter or Google search box on a Web page, but I have a tougher...
✔   Can I use CSS for drop shadows on my blog?
I want to give my site a bit of a facelift and add some neat graphical elements. One of which is drop shadows....
✔   How can I embed interactive photo panoramas on my site/blog?
I read through your blog entry about how to take panoramic photos with iOS 6 and an iPhone 5 and got enthused. I've...
✔   How can I create a Twitter search URL shortcut?
I'd like to add a few Twitter search links to my Web site. Is that possible, or does Twitter prohibit this sort of...

Let's stay in touch!
Sign up for my weekly AskDaveTaylor Newsletter and you'll receive even more tech and gadget help right to your inbox, along with exclusive news and industry updates. It's good stuff. I promise!
    Enter your name: and your email addr:  





Categorized: HTML, JavaScript and Web Site Programming   (Article 7817, Written by )
Tagged: google, javascript, site hacking, site search
Previous: How can my Google site search just look in a subdirectory?
Next: How can I update my Facebook status with Twitter Tweets?




Reader Comments To Date: 1

Leslie Katz said, on February 2, 2008 9:33 PM:

Dave,

The last of your methods restricts searches on my blog by a limiting word in URLs, which is great. But ... It also adds the limiting word to searches on the Web generally.

Is there a way to limit only searches on my blog, but not on the Web?

Leslie

Starbucks coffee cup I do have a lot to say, and questions of my own for that matter, but first I'd like to say thank you, Dave, for all your helpful information by buying you a cup of coffee!

I do have a comment, now that you mention it!











I will never send you any unsolicited email. Ever.






Check This Out Too...

 
Look for Answers
Need Help? Ask Dave Taylor!


Follow Me on Pinterest

Find Me on Google+
ADT on G+
© 2002 - 2013 by Dave Taylor. All Rights Reserved.

Note: This web site is for the purpose of disseminating information for educational purposes, free of charge, for the benefit of all visitors. We take great care to provide quality information. However, we do not guarantee, and accept no legal liability whatsoever arising from or connected to, the accuracy, reliability, currency or completeness of any material contained on this web site or on any linked site. Further, please note that by submitting a question or comment you're agreeing to my terms of service, which are: you relinquish any subsequent rights of ownership to your material by submitting it on this site. My lawyer says "Thanks".
"Ask Dave Taylor®" is a registered trademark of Intuitive Systems, LLC.