Integrate Google search results pages on WordPress CSE

Integrate Google search results pages on WP CSE : Google Custom Search Engine (Google CSE) is the first tool that lets you create your first search engine based on Google and integrated into the website. 

You have the ability to customize the settings to suit the purpose of their own search, eg search only on one designated site, search under the keywords given, integrated (or eliminating) advertising on search results, change the display language ... Details on how to create, use, and you can customize them to dig around in the homepage of Google CSE, or search online. Due to the post, please ignore such details.

The advantage of Google CSE

A particularly useful feature of Google CSE is that it enables integrated search results page on the website. Instead the search page link in Google:

http://www.google.com/cse?cx=015656627415006543897%3Ajavmyt6rnyc&ie=UTF-8&q=unikey&sa=Search&siteurl=www.google.com%2Fcse%2Fhome%3Fcx%3D015656627415006543897%3Ajavmyt6rnyc

you can turn it into (note that the domain has been transferred to your domain):

http://yourdomain.com/search-results?cx=015656627415006543897%3Ajavmyt6rnyc&cof=FORID%3A10&ie=UTF-8&q=unikey&sa.x=0&sa.y=0#1045

This feature has two major advantages of SEO:

1) Do not allow visitors to "go out" website (decrease Bounce Rate). This is evident by the customer not being pushed out every time you search Google.

2) Increased page views / hits (Page Views / Visits). Previously, when users search Google ejected, then returned to the website, ie 2 hits for two pageviews (search and found the article page). With the integrated search results page in the website, the user remains at the website (1 hits) and see at least 3 pages (search page, search results pages and article pages found).

Therefore, we all want to integrate search results page on the website instead of to the default. Here we explain how to integrate WordPress (for systems other blog, Google has one general guidelines at their homepage, you can refer to if needed).

Integrated search results pages of Google CSE in WordPress


Step 1. Select a show


Visit the Google CSE and in the Control Panel of the search engines that you have created. Look and Feel in the category, and select the Iframe in the Choose a hosting option as shown below:

Integrate Google search results pages on WP CSE

You can choose the template display search results and customizable colors for them like in the picture.

Step 2. Get the code

Once customization is complete, the Get Code button to retrieve most inserted code website:

Integrate Google search results pages on WordPress CSE

Here in search results Specify item details you must enter the URL of the page displaying the search results (which we have just built a little while). Here I am to default http://yourdomain.com/search-results form, you change the domain is given.

In the Search box code is the code to display the search box. Or copy and paste this code where you want to display. Normally the header.php file, open this file and pasting it into the test again (then can customize to suit location).

Search results code section containing code that we will use to display the search results. You copy this code and recalled little bit used.

Step 3. Create a page template for WordPress


Page.php file you open in WordPress template and save it with name-results.php search. Open files and perform search-results.php following amendments:

1. Delete the entire Loop while away, replace it with the code in the Search results earlier code that we copied above. VD initial search-results.php code as follows:

<? Php get_header ()?>
<Div id = "page">
 <? Php if (have_posts ()): the_post (); ?>
 <H1 id = "soft-title"> <? Php the_title (); ?> </ H1>
 <Div id = "soft-content">
  <? Php the_content (); ?>
 </ Div>
 <? Other Php: error (); endif; ?>
</ Div>
<? Php comments_template ('', true); ?>
<? Php get_footer ()?>

Remove the middle (loop Loop go) and add the code Google CSE on, we have:

<? Php get_header ()?>
<Div id = "page">
 <! - Loop Loop has been removed ->

 <! - Google Code CSE added ->
 <Div id = "cse-search results"> </ div>
 <Script type = "text / javascript">
   googleSearchIframeName var = "cse-search results";
   googleSearchFormName var = "cse-search-box";
   is googleSearchFrameWidth = 600;
   googleSearchDomain var = "www.google.com";
   googleSearchPath var = "/ cse";
 </ Script>
 <Script type = "text / javascript" src = "http://www.google.com/afsonline/show_afs_search.js"> </ script>
</ Div>
<? Php comments_template ('', true); ?>
<? Php get_footer ()?>
2. Add to the top of it the following code:
<? Php
/ *
Template Name: Search results (Google CSE)
* /
?>
Final result:
<? Php
/ *
Template Name: Search results (Google CSE)
* /
?>
<? Php get_header ()?>
<Div id = "page">
 <! - Loop Loop has been removed ->

 <! - Google Code CSE added ->
 <Div id = "cse-search results"> </ div>
 <Script type = "text / javascript">
   googleSearchIframeName var = "cse-search results";
   googleSearchFormName var = "cse-search-box";
   is googleSearchFrameWidth = 600;
   googleSearchDomain var = "www.google.com";
   googleSearchPath var = "/ cse";
 </ Script>
 <Script type = "text / javascript" src = "http://www.google.com/afsonline/show_afs_search.js"> </ script>
</ Div>
<? Php comments_template ('', true); ?>
<? Php get_footer ()?>

After fixing search-results.php file, upload it to remember your host.

Finally, you go to the WordPress Admin, create a new one named Page Search Results:

Integrate Google search results pages on WP CSE

In particular it should be noted (all 3 points are very important):
URL URL Page must coincide with the declared earlier in the Google CSE. Otherwise, you can edit the custom page of Google CSE.
The Content of the Page not enter anything
Under Templates, select the template memory Search Results (Google CSE). This is the template that we created above.

Publish Page is finished! Now you try at home, try typing keywords into the search box (with its own code is inserted as said header.php) and press Enter, search results will be forwarded to the Search Results page, which I had created not pushed out Google.

For a better understanding, you can test to see how they TaiPhanMem.org in operation. Complete instructions and pictures in this article are based on the way that I do with TaiPhanMem.org.

Wish you have one pro WordPress blog. Any suggestions please leave comments below.

Tweet