Tecnico Programador

Utilizar API Ajax Google Search Engine Javascript para ofrecer información, vídeos y artículos relacionados a las búsquedas de los usuarios. El usuario busca en el buscador y la página lo que hace es mostrar artículos y vídeos relacionados en función de las palabras que escribió el usuario en el buscador. Es interesante y útil para el usuario, y se consigue con un pequeño código Javascript que utiliza la API de Google para las Búsquedas (Search Engine).

API Google Ajax Javascript

La documentación necesaria esta en Code.Google. Es completa y fácil de seguir para utilizarlo sin muchas complicaciones. Actualmente podemos verlo desarrollado en komoloves. Imaginar que un usuario busca “Configurar Torrent” en un buscador, y accede a un artículo nuestro, ¿No sería interesante mostrar al usuario resultados relacionados a esas palabras?. Podemos mostrar al usuario los artículos relacionados a “Configurar Torrent” que poseemos en el blog, además podemos complementar esos artículos con vídeos relacionados a lo que el usuario esta buscando. Todo esto podemos hacerlo utilizando la API de Google para búsquedas.

Conseguir las búsquedas Relacionadas

Para mostrar el resultado correcto, lo primero que tenemos que hacer es obtener las palabras que ha utilizado el cliente en el Buscador. Una vez conseguido, ya podemos utilizar esa información para mostrarle información relevante al usuario. El código lo vamos a estructura en 3 partes, Carga, Desarrollo y Presentación (Mas o Menos).

En el head de nuestra página, obtenemos las palabras utilizadas por el usuario e inicializamos la librería de Google tal y como nos indican en la API de Búsquedas, siempre y cuando haga falta.

<?php $keysreferrer = getKeywords();
    if($keysreferrer!='')
    { ?>

     <script src="http://www.google.com/jsapi?key=ABCDF" type="text/javascript">
        </script>
        <script language="Javascript" type="text/javascript">
        //<![CDATA[
        google.load("search", "1", {"language" : "es"});
        function OnLoad()
        {
            var keys = '';
            var domain = 'komoloves.com';
            keys = "<?php echo $keysreferrer; ?>";
            OnLoadSearchRelated(domain, keys);
        }
        google.setOnLoadCallback(OnLoad);
        //]]>
        </script>
<?php } ?>

El método en Javascript OnLoadSearchRelated crear y configura las búsquedas que queremos mostrar al usuario con información relevante. Necesita las palabras clave y un domino para restringir los resultados a un dominio concreto.

function OnLoadSearchRelated(domain, keywords) {
    // Create a search control
    var searchControl = new google.search.SearchControl();

    var options = new google.search.SearcherOptions();
    options.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);

    var siteKomoloves = new google.search.WebSearch();
    siteKomoloves.setUserDefinedLabel(domain);
    siteKomoloves.setUserDefinedClassSuffix("site"+domain);
    siteKomoloves.setSiteRestriction(domain);
    searchControl.addSearcher(siteKomoloves, options);

    var siteYoutube = new google.search.VideoSearch();
    siteYoutube.setUserDefinedLabel("Videos");
    siteYoutube.setUserDefinedClassSuffix("siteYoutube");

    searchControl.addSearcher(siteYoutube, options);
    searchControl.draw(document.getElementById("searchcontrol"));

    searchControl.setResultSetSize(google.search.Search.SMALL_RESULTSET);
    // Execute an inital search
    searchControl.execute(keywords);
}

Por último un lugar donde queremos ubicar los resultados, en el caso de komoloves, en el sidebar.

<?php
$showdiv = getKeywords();
if($showdiv!=''){ ?>
    <div class="box-sidebar-380">
        <div id="searchcontrol">Loading...</div>
    </div>
<?php } ?>

Espero que os sea de ayuda.