Integrate Google Adsense Search into WordPress Default Search

Add Google Adsense search into your WordPress default search or replace it. Here method to Integrate and combine Google Adsense Search and WordPress Default Search.This is more accurate and earn money for you also.

We provides codes and steps to Integrate it into website make sure you have active adsense account to follow these step.

Setting Up Google Custom Search

1. Go to Google AdSense
2. If you don’t have a Google Account yet, Create a Google Account
3. In the AdSense control panel, go to the ‘AdSense Setup’ tab
4. Click on the ‘AdSense for Search’

Now it’s time to setup the Google Custom Search

1. Choose “only sites I select”
2. Enter your domain + “*” to the Selected Sites list. e.g. srdelta.com/*
3. Check the other options, which should be ok by default. Hit Continue >>
4. Edit the looks of the search box or if the Default “Look & Feel” is OK, Hit Continue >>
5. Choose On my website using an iframe or on a Google page in the same window any option you prefer and
6. Enter URL where search results will be displayed: http://yourdomain.com/index.php? – e.g. https://www.wrock.org/index.php? [If you chosen iframe]
7. Don’t forget the question mark (?) after the index.php[for iframe]
8. Edit the search results palette and options, when satisfied, Continue >> again.
9. Hit Submit and Get Code
10. Image Below and Now next

On the next page, you will see two or three boxes, one with Search Box Code, and the other with Search Results Code and third is Popular queries(paste with search result).

• The Search Box Code will go into searchform.php
• The Search Results Code will go into search.php

Search Functionality in WordPress

In most WordPress Themes there are two php-files that handle the search form and search results:

• searchform.php
• search.php

searchform.php is the actual search form and it can be displayed anywhere in your blog. Most templates display search form at the top of the sidebar or in the header , but your template might have it elsewhere or nowhere at all. If your template doesn’t have default search you can add it yourself, or you can use a search widget to display search. Get Most beautiful WordPress themes
Read also Top Google Adsense-Earners

search.php is used to display search results, based on the search query from the search form displayed by searchform.php.

Editing the WordPress Template and Inserting the Google Custom Search

Step 1 : searchform.php

• Go to Theme Editor in WordPress.
• Open searchform.php (or edit it directly through ftp or such)
• Look for the original search form, which starts with <form> and ends with </form>
• Take a copy of the original form, and paste it to text editor.
• Now, replace the original form in the searchform.php with the Google Search Box -code (the one with <form> and such)
• Insert this line between the Submit line and </div>
• The “s” is used by the default WordPress Search, as Google Custom Search uses “q”
• There should be this kind of text inside the form tag
• Add the name variable and onsubmit -command inside the form tag, like this

Your Default WordPress Search Form looks like this:

<div class="input-group"><form role="search" method="get" id="searchform" class="searchform" action="' . home_url( '/' ) . '" >
	<div><label class="screen-reader-text" for="s">' . __( 'Search for:','level' ) . '</label>
	<input type="text" class="input-group-field" placeholder="'. esc_attr__( 'Search …','level' ) .'" value="' . get_search_query() . '" name="s" id="s" />
	<input class="input-group-button button" type="submit" id="searchsubmit" value="'. esc_attr__( 'Go','level' ) .'" />
	</div>
	</div>
	</form>

You Need to replace this with Google Adsense Search form

<form action="http://www.google.co.in" id="cse-search-box">
  <div>
    <input type="hidden" name="cx" value="partner-pub-9xxxxxxxxxxx5" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" size="55" />
    <input type="submit" name="sa" value="Search" />
  </div>
</form>

Or you Exit your default search style like me

<div class="input-group"><form role="search" method="get" id="searchform" class="searchform" action="http://www.google.co.in" >
	<input type="hidden" name="cx" value="partner-pub-9xxxxxxxxxxxx" />
	<input type="hidden" name="ie" value="UTF-8" />
	<input type="text" class="input-group-field" placeholder="Search.." value="<?php get_search_query(); ?>" name="q" id="s" />
	<input class="input-group-button button" name="sa" type="submit" id="searchsubmit" value="Go" />
	</div>
	</form>

Also you need to place search scripts and code provides to you after saving search form in adsense website

Copy these codes and put in footer.php file. You can use these into your html or any other website as well.

Now back to code editing :

if your custom theme uses some other name than “searchform”, replace searchform with whatever you want, just make sure you replace it in the name=”” and inside onSubmit as well. With this we can pass the search terms in the s-variable (used by WordPress search) as well as the q-variable (used by the Google Custom Search).

If your original search form (you have copied on the text editor) had some custom names or id’s, try to put them in without messing the Google search code. I added the id and class variables from my theme. You can also add default value to the text input if you like, like this (using fancy javascript to change it based on user activity).

In the end, you will have something like this in your searchform.php:

<form action="https://www.wrock.org/index.php?" name="searchform" id="searchform" onSubmit="document.searchform.s.value = document.searchform.q.value" >
<div>
<input type="hidden" name="cx" value="partner-pub-xxxxxxxxxxxxxxx" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" id="searchbox" value="Search from yourdomain.com" onfocus="if(this.value == 'Search from yourdomain.com') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search from yourdomain.com';}" />
<input type="submit" name="sa" value="Go" />
<input type="hidden" name="s" value="" />
</div>
</form>
<script type="text/javascript" src="https://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script>

• You should now have functioning search in your blog, but only the default WordPress Default results are visible.
• Change srdelta.com with your own domain

Step 2 : search.php

To get the Google Custom Search results visible too, we have to edit the search.php

This is even easier than the searchform.php edit, as you just have to take the Search Results Code from the Google AdSense for Search page, and insert it in the search.php where you see fit. I placed it on the top portion, over the WordPress post results, which start with: <?php while (have_posts()) : the_post(); ?>

If you don’t care about the default WordPress Search results, and just want the Google Custom Search in, the most simple search.php (Search Results) page looks like this (ignoring the sidebar):

<?php get_header(); ?>
*GOOGLE SEARCH RESULTS CODE HERE*
<?php get_footer(); ?>