Integrar la búsqueda de google en tu wordpress

Google Buscador


El tutorial es bastante simple, pero iremos explicando paso a paso como integrar el buscador que nos ofrece google para que los resultados nos aparezcan en nuestro WordPress.

Ahora entramos a nuestra cuenta de Google Adsense y en la pestaña de Configuración de Adsense seleccionamos Adsense para búsqueda

google_busca.jpg

02. Tipo de búsqueda

Una vez que damos clic en Continuar nos aparecerá la pantalla que corresponde al tipo de búsqueda, en primer lugar seleciconamos en la parte derecha WebSearch de Google + SiteSearch y en la parte de abajo ingresamos el sitio donde integraremos esto, en este caso yo utilizaré http://www.politolia.wordpress.com.

google_busca1.jpg

02.1. Diseño del cuadro de búsqueda

Ahora viene la parte de acomodar el cuadro de búsqueda, aquí seleccionen la opción que más les guste ó que mejor se adapte al diseño se su sitio.

google_busca1.jpg

02.2. Búsqueda adaptada al sitio web

Más abajo nos encontramos con otras opciónes donde seleccionamos el idioma, codificación y lo “más importante” es que aquí es donde definimos que los resultados se abran en una página de nuestro blog.

google_busca3.jpg

La url que ingresaremos será la misma de la página que creamos en WordPress

En mi caso tendría que poner la siguiente url: http://www.politolia.wordpress.com/google-search/

03. Personalizar la página de resultados

Esta parte ya corresponde a cada uno de ustedes cómo desean que se vean los resulte más amigable para su diseño utilizando las paletas que nos ofrece google ó creando las nuestras.

google_busca4.jpg

En esta misma pantalla tenemos “más opciones” donde definimos el país o territorio para el dominio de Google, esto es por si quieren que las búsquedas se hagan por ejemplo en google.com.mx ó google.com.ar etc…. etc… y el criterio de seguimiento por si desean agregarle alguno a la hora de hacer la búsqueda.

google_busca5.jpg

04. El formulario de búsqueda

Después de haber terminado el paso anterior se darán cuenta que google nos dá dos códigos para que hagamos funcionar la búsqueda.

Hagan una copia de respaldo del archivo search.php de su theme y reemplazen el código que viene por default por el que les dá google en la primer área de texto.

PHP:


Google

 

Este viene siendo el código de la caja de búsqueda.

05. Creando el template de resultados para la búsqueda

Ahora vamos a crear un archivo llamado google.php que guardaremos de igual forma en la carpeta de nuestro theme, a este archivo le vamos a pegar el código que nos dá google en la segunda área de texto.

Antes de poner el código de google, pongan esto a su archivo

PHP:

Esto es para que al momento de crear una página podamos definir que tome como template este archivo que estamos creando.

Ahora si pegamos abajo el código de google de tal forma que nos queda algo como esto:

PHP:

var googleSearchIframeName = ‘googleSearchUnitIframe’;
var googleSearchFrameWidth = 550;
var googleSearchFrameborder = 0 ;
var googleSearchDomain = ‘www.google.com’;

06. Editando la página de resultados para la búsqueda

Ahora lo último que nos queda por hacer es editar la página que creamos al principio del tutorial llamada “Google Search” en su administrador.

Al editar la página en la barra de la derecha seleccionen en la parte de template/plantilla la que dice Google Search

google_busca6.jpg

Listo, con esto hemos terminado el tutorial… espero que les pueda ser de utilidad🙂

Índice

Creando la página de resultados
Adsense para búsqueda
Tipo de búsqueda
Diseño del cuadro de búsqueda
Búsqueda adaptada al sitio web
Personalizar la página de resultados
El formulario de búsqueda
Creando el template de resultados
Editando la página de resultados

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: