Google AdSense Search Results within WordPress Pages
Filed in: Adsense Tips, Make Money Online, WordPress — September 9th, 2006
As promised in my previous post, here is the instruction to having AdSense search results within WordPress Pages.
Wordpress Pages are like Posts, except they can do much more than Posts, and they live outside of the normal blog chronology. [Read more...]
What will we do?
- Generate new AdSense search code.
- Create a new Google Search WordPress Page template.
- Create a new Google Search WordPress Page.
- Insert AdSense search box code into WordPress template.
Step 1: Generate new AdSense search code
Generate AdSense for search code as usual, but tick "Open my results within my own site" at Opening of search results page under More options section.
Select "Open results within my own site"
The URL should be: http://www.YourDomain.com/google-search/
Note: You may change the "google-search" to anything else, but make sure you change the "Post slug" when creating a new WordPress Page for Google Search (Step 3).
Then, you will get two blocks of codes. The first part is search box code. The second part is search results code. Copy both of them.
Step 2: Create a new Google Search WordPress Page template
Now, we need to create a new WordPress Page template and insert search results code into it. In this example, I am using WordPress default theme (Kubrick).
- Create a new text file with your text editor.
- Copy and paste the following code into the new text file. The code creates a frame in the page to display Google search results.
PHP:
-
<?php
-
/*
-
Template Name: google search
-
*/
-
?>
-
-
<?php get_header(); ?>
-
-
<div id="content" class="widecolumn">
-
-
<!-- Google Search Result Snippet Begins -->
-
<div id="googleSearchUnitIframe"></div>
-
-
<script type="text/javascript">
-
var googleSearchIframeName = 'googleSearchUnitIframe';
-
var googleSearchFrameWidth = 700;
-
var googleSearchFrameHeight = 1500;
-
var googleSearchFrameborder = 0 ;
-
var googleSearchDomain = 'www.google.com';
-
</script>
-
<script type="text/javascript"
-
src="http://www.google.com/afsonline/show_afs_search.js">
-
</script>
-
<!-- Google Search Result Snippet Ends -->
-
-
</div>
-
-
<?php get_footer(); ?>
-
- Save the file as googlesearch.php
- Upload googlesearch.php into your WordPress theme folder, "default" folder in this example.
Note: If you are using other WordPress templates, you might need to edit page.php of the template, strip out WordPress code, and save as googlesearch.php.
Step 3: Create a new Google Search WordPress Page
Now, we need to create a new WordPress Page using the new WordPress Page template(googlesearch.php) to display Google search results.
- At WordPress admin, goto Write Page under Write.
- Type "Google Search" for the Page Title, but leave blank for the Page Content.
WordPress Page with blank content and "Google Search" as page title. - On the right, expand Page Template: and select "google search" (googlesearch.php).
- Make sure the Post slug is "google-search"
- Save the WordPress page.
Step 4: Insert AdSense search box code into WordPress template
Finally, replace your existing AdSense search box code on WordPress template files with the newly generated search box code in Step 1. Save your template files and upload to your server.
Congratulations!
You're done! You can test your on-site Google AdSense search and see the result at http://www.YourDomain.com/google-search/
Please let me know if you have any problem when implement Google AdSense search results within WordPress Page.
Of course, for those did it, please show us your Google Search WordPress page!
FAQ
Q: How do I hide the "Google Search" page from my page list?
A: You can hide certain WordPress page by using exclude argument in the wp_list_pages template tag. Please refer to "Exclude Pages from List".
Let me do it for you
Are you still blur and don't know how to do it? Hire me to do it for you. 
Comments Feed
TrackBack URL
September 9th, 2006 at 8:11 pm
nice post you have there. i will try to implement them later.
September 10th, 2006 at 12:26 am
Thanks Liew, very useful post. Hope if I can increase my earnings from google adsense.
September 10th, 2006 at 4:48 am
May i know what is the purpose of “Make sure the Post slug is “google-search”?
Thanks for your explanation!
September 10th, 2006 at 5:06 am
@ahwong5: the “post slug” is related to the URL in Step 1, BOTH need to be the SAME.
Since we use “google-search” in Step 1, then we need to make sure we are using “google-search” as post slug in Step 3, too.
September 10th, 2006 at 2:33 pm
Great tutorial,
cheers
September 11th, 2006 at 7:38 am
I can’t search on your site with Adblock Plus Firefox extension enabled. You have to do something about this as many people use this extension
September 11th, 2006 at 11:46 am
@John TP: Well, the Google AdSense code is not under my control. You might need to unblock Google AdSense in AdBlock Plus for it to work.
September 11th, 2006 at 1:40 pm
yaya… adblock almost blocks all adsense…
September 11th, 2006 at 6:10 pm
TQ for the info…i will try it at home tonite
September 11th, 2006 at 7:20 pm
Check out my on site search:
http://www.worldcupcorner.com/search/
I must tweak the design more…
September 11th, 2006 at 8:33 pm
Hey,
Thanks for the helpful post. One question - what’s with the big white space that shows up after the search results. Anything that we can do about that?
September 11th, 2006 at 10:45 pm
@worldcupcorner: nice color theme, look like part of your site.
@fiLi: the AdSense search result page’s default height is 1500px (googleSearchFrameHeight = 1500). I don’t think we can modify the code…
September 12th, 2006 at 2:12 am
Hi - just wanted to thank you very much for providing this. It worked first time - and I’ve been trying to do it (using other people’s advice) for days and days. Brilliant! Shame it looks so crap and we can’t change the height or width of the frame (well, I can’t). Cheers!
September 12th, 2006 at 4:08 am
It is easy to change the width and height of the frame… but I don’t think Google allows us to do so. According to Google AdSense program policy: NO code modification.
September 12th, 2006 at 6:14 am
Altering the code in the obvious places doesn’t help. It seems that the place is reserved for ads on top of the search.
September 12th, 2006 at 6:05 pm
nice post you have here. I will try and wrote my comment here later..
September 12th, 2006 at 6:32 pm
I discovered this when they first introduced this, but I’m not sure how to make it. Thanks for the tutorial.
September 16th, 2006 at 5:21 am
nice..its really work!
September 16th, 2006 at 5:40 pm
Thanks. Your instructions were very useful.
September 21st, 2006 at 12:04 am
Hi…
I’ve implemented it to my site!
After 3 hours working on it, try this, try that, finally it matches my template and looks good! but the search result is kinda lame…
Please visit my site to check it out!
Thanks
September 25th, 2006 at 2:56 am
[...] There are few articles that describe how Wordpress users can have an onsite Google search results to be displayed on their own blog. It can be fairly easy to do that with new pages and template, as featured by this excellent article at LiewCF. [...]
October 14th, 2006 at 7:27 pm
[...] Google AdSense Search Results within WordPress Pages [...]
October 19th, 2006 at 5:15 pm
Man sometimes I feel like a WP-noob.
I’ve done exactly as written above but I can’t get it to work. I’ve add the search field at the bottom of my frontpage. (I’m going to move it up once I get it up and running). The problem is when I click the search button it takes me to a blank page. My blog is installed in a folder called blog, do I have to change anything?
October 25th, 2006 at 10:29 am
[...] Wordpress users (I’m not sure about other blog platforms) will have to take a couple extra steps to get the in-site search results working. LiewCF has a good explanation of the work you’ll need to do to get the results to display on your Wordpress site. [...]
October 27th, 2006 at 12:11 am
[...] Google AdSense Search Results within WordPress Pages [...]
October 30th, 2006 at 11:12 am
Fantastic. It was easy following your instructions Liew. I got mine working in under 15 minutes. Also added headers for Google adsense and at the side too beside the results.
Not sure whether this was allowed or not but since I see you doing it, I guess it’s alright
November 4th, 2006 at 7:37 am
[...] I had a WordPress tutorial about implementing Google AdSense search results within WordPress Pages. Although the tutorial is step-by-step but it is still difficult for some beginners. [...]
November 27th, 2006 at 10:58 am
Hello there,
I don’t understand how come it returns me with this line:
Fatal error: Call to undefined function: get_header() in /home/kenneth/public_html/wp-content/themes/flawless-imperfection/googlesearch.php on line 11
I would be grateful if you could help me out.
Regards,
Kenneth
November 27th, 2006 at 11:16 am
@Kenneth: you should put the wordpress page’s URL in the adsense search, NOT the path of the googlesearch.php.
November 27th, 2006 at 11:23 am
I’m sorry Liew, but could you elaborate more? I still do not understand. FYI, I put my googlesearch.php in /public_html/wp-content/themes/flawless-imperfection.
November 27th, 2006 at 11:26 am
This is how I put it in my header (where I want the search box to appear):
….form method = ” get ” action = ” http://mrdefinite.com/wp-conte…/flawless-imperfection/” target….
November 27th, 2006 at 11:58 am
@Kenneth: you should put “http://mrdefinite.com/?page_id=577″ as the search page URL, not the /wp-content/blahblah…
November 27th, 2006 at 2:12 pm
Liew, I have changed what you said, but what should I out in my post slug? Cos it still doesn’t seem to work..
December 5th, 2006 at 3:25 am
Excellent! Worked the first time. I just love to see a post with steps which works the first time. Thank you so much!
December 13th, 2006 at 4:13 pm
Hi,
First of all, terrific instructions. I had it working right at the first try - though it took me a while to get the search box blend in into my template.. even now it looks kind of ugly - but that’s irrelevant. Those who still haven’t managed to figure it out are most welcome to drop by my site and ask for any kinda help needed on this.
My question is - when I create the search page, using the googlesearch.php template as you’ve shown - that page shows up in the horizontal top-menu as an item named “Google Search”. Any ideas how to get rid of this ??
Thanks,
m^e
December 15th, 2006 at 4:48 am
Hello,
thanks for this helpful post. Just implemented my Google Search WordPress page on my blog.
Cheers,
Matt
December 21st, 2006 at 7:33 pm
very cool thanks. btw the next step is to exclude the ‘google search’ link from the navigation area. The solution is to use the exclude parameter as shown in the wp codex.
December 22nd, 2006 at 12:25 pm
Thanks gary, for the tip - till now not knowing what to do, I’d commented out the wp_list_pages() function and was adding in links manually in the header, which of course was a bitch and a so totally inelegant way of doing so. Now all’s fine
Cheers,
m^e
January 20th, 2007 at 4:00 pm
Thanks a lot, this is a very helpful article.
January 29th, 2007 at 6:14 pm
Works like a charm.
I guess it was the previous theme that caused me some trouble.
Thank you Liew.
February 19th, 2007 at 7:17 am
[...] En sí no es complicado, este link (en inglés) explica cómo hacerlo. En resumen, se trata de usar la posibilidad que ofrece Wordpress de asociar una Página (con mayúscula, para dejar claro que nos referimos a los Pages de Wordpress) a un slug template determinado. Trataré de explicarlo en detalle en otro post. Mientras tanto, prueba a buscar algo dentro del blog usando la casilla de la esquina superior derecha. Verás que en vez de abrirse una ventana nueva, los resultados se muestran dentro del mismo blog. [...]
February 27th, 2007 at 9:39 pm
I get the following error when I try to view the page I created using the googlesearch page template:
Parse error: parse error, unexpected T_DNUMBERon line 9
Any ideas? Thanks for your help.
March 11th, 2007 at 6:39 pm
How came that if I try to search at the top of page, I get the Google page and not a site template? I was only trying to find an example of the plugin!
March 12th, 2007 at 3:59 am
I’ve just started blogging in the last week and am finding myself stumbling along slowly with many things right now as I pick things up.
I spent hours trying to get my custom Google search page sorted, then found this site and had it sorted in 15mins, many thanks for a great step-by-step guide!
May 3rd, 2007 at 4:19 pm
Great post…thanks! One question though, how come you don’t do this on your blog? I tried out your search but it’s not setup.
May 3rd, 2007 at 5:25 pm
@David: thanks for the remind. The on-site search was returning error after I upgraded WordPress to version 2.0. I will implement it again.
May 21st, 2007 at 2:59 pm
Hi Cheon Fong, thanks for the details! Now the search results page looks like it belongs to the site.
However the frame height variable doesn’t seem to have any effect on the page look - still a block of white space before the footer.
June 1st, 2007 at 2:16 am
Increase Adsense Profits by using ‘Adsense For Search’…
If you’re not incorporating Google “Adsense for Search” into your Wordpress blog then you’re not making as much Adsense profit as you could be (***Not the Adsense ads, but the Google search on your own website***). Don’t…
June 2nd, 2007 at 4:21 am
[...] and I told myself I wanted to do it like that. So I followed the link for a “how” to at LiewCF. I tried to follow all the steps but had difficulty at [...]
June 4th, 2007 at 11:07 pm
[...] for search is easy to install in your blog - If you have any trouble installing it, head over to LiewCf who has written a great article about incorporating the Google search function into your theme, [...]
June 18th, 2007 at 3:33 am
For some very weird reason. The search results in Firefox are blank, but it works fine in Opera and IE7. It says PHP: on the search result page.
July 22nd, 2007 at 11:21 am
Worked like a charm! Thanks!
July 28th, 2007 at 7:11 pm
Just yesterday I was trying to implement this feature into my blog. And then today I found your tutorial. Very helpful. I will try this today and test. Thanks a million.
August 14th, 2007 at 12:45 pm
This is an awesome tutorial, thank you much!!
Worked Perfect!
Also I was able to put the Search Code in the PHP file that way if the use wants to search again from the same page they can.
August 14th, 2007 at 1:13 pm
[...] got my information about creating a custom search results page from another blogger who has a tutorial on generating a custom Google AdSense search page. Bookmark or share this post: These icons link to social bookmarking sites where readers can [...]
October 1st, 2007 at 2:31 am
Thanks a lot for the very useful info. I’ve spent a few hours trying to figure out how to get the search results to show up on my page, and you’ve saved me from wasting any more time
Works like a charm now.
Cheers!!
October 9th, 2007 at 11:27 pm
I had implemented this on my sci-tech news site, Sciencebase.com, months and months ago, but totally forgot how to do it to get started on my blogging tips site. Thanks for the timely reminder
Dave B
November 4th, 2007 at 2:47 pm
I don’t have a “Page Template” widget on my wordpress control panel. i use Wordpress 2.3.1
How can I implement it?
January 29th, 2008 at 7:51 am
Great tutorial. Worked first time.
Many thanks.
PP
February 9th, 2008 at 2:46 pm
Simple 3 step process. Excellent, I was searching for this. Now I can easily integrate customized Google search page on my blog.
April 3rd, 2008 at 5:59 pm
Greats Liew. It works now.
Thanks a lot
May 7th, 2008 at 5:25 am
Thx liew for this tip. now i can setup this search engine
June 10th, 2008 at 8:20 am
Good work!
September 11th, 2008 at 1:54 pm
Hello Mate,
Thanks for your nice post, But i want to put adsense search box like your site in which user can select either Web or Site.
How can i put search box like you. Please help me.
and one problem is that my adsense search box is showing inactive. I dnt know why??
Have u any idea about that. Please help me.
Thanks in Advance.
Ankur Gandhi.
September 13th, 2008 at 12:35 am
@Ankur Gandhi: the adsense box format that I use on this site is no longer available. it has been replaced with better adsense custom search. you can read more at https://www.google.com/adsense/support/bin/topic.py?topic=144
October 11th, 2008 at 4:23 pm
great post mate , you can actually take it one step further ans integrate the ads in to the page that you create on wordpress itself so it looks much more integrated on to the site. I have written a post about it on my site.
November 14th, 2008 at 7:20 pm
Thanks for this, it works perfectly.
Well, almonst. I just need to figure out a way to make it fit in with my theme.
Thanks again, I would never have thought of using a page tempate.
Dave
November 19th, 2008 at 9:47 am
u have idea for adsense code integrade with wp searh…!
please help me