/ SEO

Implementar un Buscador Personalizado de Google en tu Sitio Web

En este artículo vamos a implementar un buscador personalizado de Google en nuestro sitio web, este buscador podrá mostrar todas las páginas indexadas de nuestro sitio web por Google.

Implementar un buscador en nuestro sitio web es algo que hay que considerar, ya que nuestros usuarios desearan realizar busquedas cuando tu sitio contenga múltiples artículos.

Para lograr esta hazaña vamos a dirigirnos a la siguiente dirección web https://cse.google.com.

Una vez en esta página iniciamos sesión haciendo clic en el botón Iniciar sesión en motor de búsqueda personalizado.

Iniciar sesion en motor de busqueda personalizado

Ahora solo tienes que ingresar tu usuario y contraseña de tu cuenta de Google.

Una vez que hayas accedido te redireccionara a una página similar a esta, aquí se muestran la lista de los motores de búsqueda creados anteriormente, en mi caso solo he creado uno que es 01luisrene.com.

Panel principal del buscador Google

Si aun no tienes creado ningún motor de búsqueda vamos a crearlo es muy fácil, primero haz clic en la opción Add.

Nuevo motor de búsqueda

Ahora en esta página vamos a llenar los datos básicos que nos solicita y para finalizar clic en el botón CREAR.

Datos nuevo motor búsqueda

En esta página nos muestra un mensaje Has creado correctamente tu motor de búsqueda personalizado y nos muestra tres opciones la primera es para obtener el código, la segunda es la URL pública, la tercera el Panel de control.

Resultado crear nuevo motor búsqueda

Bueno lo razonable seria obtener el código y ya, pero quiero profundizar un poquito más sobre el panel de control, así que hacemos clic en el botón Panel de control.

Aquí vamos a ingresar los datos que se nos solicita, realizamos los ajustes que creamos por conveniente y para finalizar hacemos clic en el botón Actualizar que se encuentra en la parte inferior.

La sección que se encuentra en el recuadro verde es donde se ingresaran los datos y configuraciones. En la sección del recuadro fucsia se muestra nuestro formato de búsqueda que hemos creado gracias a Google.

Configuracion nuevo motor búsqueda

Continuando hacemos clic en la opción de Apariencia.

Apariencia búscador

En esta sección podemos encontrar los diferentes diseños para nuestro buscador personalizado, por defecto viene el que muestra los resultados en una caja flotante.

Diseño del motor de búsqueda

En esta sección podemos encontrar los diferentes diseños para nuestro buscador personalizado, por defecto viene el que muestra los resultados en una caja flotante.

Diseño ancho completo

Esto vendría a ser el código generado, recuerda que el código aquí generado solo sirve para realizar búsquedas en el sitio web https://01luisrene.com.

Código buscador

Demo

Vamos a realizar una demostración del uso del código obtenido para nuestro buscador personalizado de Google.

Buscador personalizado


Recuerda que las etiquetas se muestran en tablas así que ten en cuenta esto ya que si tu diseño tiene estilos personalizados para las tablas esto podria influir en su aspecto.


Luis Rene Mas Mas

Luis Rene Mas Mas

Hola, soy desarrollador front-end, me encanta las tecnologías web, mi pasatiempo favorito es administrar este blog.

Leer Más