Star Snippets Logo

snippets.com

Consultar rich snippets en línea

Ejemplos de integración


General

El proyecto Star-Snippets consiste en tres elementos diferentes, que les presentaremos a continuación. Para disponer de todas las funciones (Evaluación de estrellas + Rich Snippets disponibilidad) los tres elementos deben integrarse.

Snippet HTML

El snippet HTML sirve para definir el lugar de la página en el que la estrella de clasificación será mostrada posteriormente. Además, el snippet HTML permite adaptar el aspecto de las estrellas con parámetros de configuración. En el más sencillo de los casos, el fragmento siguiente es suficiente para enseñar una evaluación rich snippet en la página.

<body>
  ...
  <star-snippet></star-snippet>
  ...
</body>

Código Javascript

El código Javascript se emplea para encontrar los fragmentos HTML en la página, leer sus parámetros de configuración y seguidamente integrar las estrellas en el lugar correspondiente y con la configuración deseada. Para que la integración no influya en la velocidad de las páginas, se recomienda integrar el código Javascript inmediatamente antes de la etiqueta de cierre del cuerpo (</body>).

Como se indica en Página de posibilidades de adaptación, el snippet HTML y el código Java que sigue son suficientes para integrar una o numerosas estrellas de evaluación (rating) en una página. De este modo, los usuarios de la página pueden consultar las evaluaciones de otros usuarios y emitir su propia evaluación.

<body>
  ...
  <!-- star-snippets.com -->
  <script>
    (function() {
      function async_load(){			
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'http://star-snippets.com/script';
        //s.src = 'http://star-snippets.com/script?prevent_cache=' + new Date().getTime(); //el caching también puede impedirse      
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
      }
      if (window.attachEvent)
        window.attachEvent('onload', async_load);
      else
        window.addEventListener('load', async_load, false);
    })();
  </script>
</body> <!-- integrar directamente antes de la etiqueta de cierre del cuerpo -->

Código PHP (Java, etc.)

El tercer y último elemento sirve para generar, a partir de las evaluaciones de los usuarios, unos Rich Snippets para que los motores de búsqueda tales como Google & Co. publiquen las evaluaciones en la lista de resultados de la búsqueda. De este modo, la página despierta, siempre que tenga suficientes evaluaciones positivas, una mayor confianza durante la búsqueda y por esa razón es visitada más frecuentemente.

En principio, también es posible recargar los marcadores de Rich Snippet con Javascript (Ajax). Sin embargo, los motores de las máquinas de búsqueda necesitan esos marcadores en el momento de entrega de la página, razón por la cual los rich snippets recargados con Javascript (Ajax) no son tenidos en cuenta por los motores de búsqueda. Para integrar los rich snippets en la página en el momento de su entrega, puede enviarse una solicitud a star-snippets.com por PHP (o un lenguaje de tu elección) que entregue la evaluación actual de la página empacada en marcadores de rich snippets. Esos marcadores solamente deben ser editados. De este modo, las máquinas buscadoras identificarán los rich snippets y estos podrán ser tenidos en cuenta durante el tratamiento de los resultados de la búsqueda.

<body>
  ...
  <?php
    //el parámetro url debe coincidir con el parámetro href del código Javascript    
    $url = "http://star-snippets.com/rating?url=http://www.example.com";
			
    $title = "Página de ejemplo";
			
    $description = "Una descripción de mi página de ejemplo";
    
    if($title != "")
    {
      $url .= "&name=".rawurlencode($title);
    }
    
    if($description != "")
    {
      $url .= "&description=".rawurlencode($description);
    }
    
    $timeout = 10;
    
    try {
    
      $streamContext = stream_context_create(array('http' => array('timeout' => $timeout)));
      
      $response = file_get_contents($url, false, $streamContext);

      if (!$response)
      {}
      else
      {
        echo $response;
      }
    } catch (Exception $ex) {
    }
			
  ?>
  ...
</body>

Aviso

En caso de que el script anterior genere un error o un aviso, porque tu hosting no dispone de la función 'file_get_contents', puedes emplear el siguiente código en su lugar:

// Comenta esta línea.
// $response = file_get_contents($url, false, $streamContext);

// Emplea en su lugar las siguientes líneas
$session = curl_init($url);
curl_setopt($session, CURLOPT_HEADER, false);  
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
curl_setopt($session, CURLOPT_TIMEOUT, $timeout);
$response = curl_exec($session);
curl_close($session);
  

Joomla (1.5, 1.6, 2.5, 3.0)

Para la integración en Joomla, son necesarias menos adaptaciones en comparación con estándar. La integración puede hacerse fácilmente a través de la instalación de un plugin Joomla. Sólo debes hacer clic en el siguiente botón para descargar el plugin rich snippet.

Descargar el plugin rich snippet para Joomla

También puedes realizar la integración de rich snippet de forma manual, como explicamos a continuación. Esta opción permite una mayor flexibilidad, pero requiere más esfuerzo.

Snippet HTML

El snippet HTML se integra en un sitio cualquiera (por ejemplo en una colaboración, un módulo de cabecera, etc.)

<body>
  ...
  <star-snippet></star-snippet>
  ...
</body>

Códigos Javascript y PHP

El siguiente código puede integrarse directamente junto a la etiqueta de cierre del cuerpo en la plantilla Joomla correspondiente (index.php)

<body>
  ...
  
  <?php
    
    $doc = JFactory::getDocument();
    
    $url = "http://star-snippets.com/rating?url=".JURI::current();
    
    if($doc->getTitle() != "")
    {
      $url .= "&name=".rawurlencode($doc->getTitle());
    }

    if($doc->getDescription() != "")
    {
      $url .= "&description=".rawurlencode($doc->getDescription());
    }
    
    $timeout = 10;
    
    try {
      $streamContext = stream_context_create(array('http' => array('timeout' => $timeout)));
      
      $response = file_get_contents($url, false, $streamContext);

      if (!$response)
      {}
      else
      {
        echo $response;
      }
    } catch (Exception $ex) {
    }
			
  ?>

  <!-- star-snippets.com -->
  <script>
    (function() {
      function async_load(){			
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'http://star-snippets.com/script';
        //s.src = 'http://star-snippets.com/script?prevent_cache=' + new Date().getTime(); //el caching también puede impedirse      
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
      }
      if (window.attachEvent)
        window.attachEvent('onload', async_load);
      else
        window.addEventListener('load', async_load, false);
    })();
  </script>
</body>

Aviso

En caso de que el script anterior genere un error o un aviso, porque tu hosting no dispone de la función 'file_get_contents', puedes emplear el siguiente código en su lugar:

// Comenta esta línea.
// $response = file_get_contents($url, false, $streamContext);

// Emplea en su lugar las siguientes líneas
$session = curl_init($url);
curl_setopt($session, CURLOPT_HEADER, false);  
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
curl_setopt($session, CURLOPT_TIMEOUT, $timeout);
$response = curl_exec($session);
curl_close($session);
  

WordPress

También en la plataforma de publicación de blogs WordPress puede integrarse fácilmente rich snippet, a través de la instalación de un plugin para WordPress. Oprime el botón siguiente para descargar el plugin rich snippet.

Descargar el plugin rich snippet para WordPress

Logo star-snippets.com