Please note, this is a STATIC archive of website developer.mozilla.org from November 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Como crear un Microresumen

Un generador de microresúmenes es un conjunto de instrucciones orientadas a crear un microresumen del contenido de una página. Una página web puede referenciar los generadores correspondientes mediante el uso de etiquetas <link rel="microsummary"> en la sección <head>. O también se pueden descargar e instalar independientemente, por iniciativa del usuario, si cada generador incluye una lista de páginas a las que sea aplicable.

En este tutorial vamos a crear un generador de microresumen para la página inicio de Spread Firefox que se encargue de mostrar el número actual de descargas, junto al texto "descargas de Fx". Por ejemplo: 174475447 descargas de Fx.

Para ello, ante todo, construiremos la hoja XSLT de transformación que convierte la página web en un microresumen; luego veremos cómo especificar que el generador sea aplicable a esa página, y por último aprenderemos cómo publicar el generador para su descarga e instalación.

Durante la construcción de la hoja XSLT, lo que se añade en cada paso se muestra en negrita, para facilitar el seguimiento del proceso.

Comienzo

Un generador se expresa como un documento XML cuyo nodo raíz es <generator> (en el namespace https://www.mozilla.org/microsummaries/0.1). Para construir un generador, hay que empezar por crear un fichero de texto vacío y añadir la declaración XML y un nodo <generator> vacío:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1">
</generator>

Poner nombres

Un generador debe tener atributos name con las descripciones arbitrarias de los microresúmenes creados. Un nombre debe ser lo bastante descriptivo para dar al usuario final una idea fiel de la información incluida en el microresumen.

Dado que nuestro generador va a crear microresúmenes que muestran el número de descargas de Firefox, le llamaremos "Conteo de descargas de Firefox":

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
</generator>

Incluir una hoja XSLT de transformación

Cada generador debe incluir una hoja XSLT de transformación (también llamadas hojas de estilo XSLT) que transforme el contenido de la página en un microresumen. XSLT es un potente lenguaje para transformar documentos: Sirve para producir diversas presentaciones de la misma información.

Para incluir la hoja XSLT en el generador hay que usar un elemento <template>:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
    </transform>
  </template>
</generator>

Obsérvese que aunque el generador puede incluir código XSLT arbitrario (inclusive generación de texto enriquecido), por el momento Firefox sólo muestra el texto plano de la salida XSLT.

Especificar el formato de salida

Dado que la hoja XSLT va a generar un microresumen en formato texto plano, hay que indicarlo usando la etiqueta XSLT <output>:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
    </transform>
  </template>
</generator>

Usar un sólo nodo <template> en la hoja XSLT

El procesador XSLT (incluido en el navegador) transforma los documentos buscando en la hoja XSLT el nodo <template> que mejor se adapte a cada nodo del documento procesado. Cuando lo encuentra, realiza en el nodo procesado las transformaciones incluidas en el <template> elegido.

Este mecanismo es bastante potente, pues permite recorrer el árbol entero del documento procesado y generar salida (recursivamente) basándose en la estructura del documento. sin embargo, para la finalidad de generar un microresumen para la página Spread Firefox, se necesita tan sólo un nodo <template> que referencie el nodo raíz del documento (/) y lo procese de una sóla vez:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
      <template match="/">
      </template>
    </transform>
  </template>
</generator>

Incluir el conteo de descargas

Para incluir el conteo de descargas en la salida de la hoja XSLT, hay que usar la etiqueta XSLT <value-of>, especificando en el atributo select una ruta XPATH que apunte al nodo que contiene el conteo.

XPATH es un lenguage de identificación de nodos en documentos XML/HTML. También contiene algunas funciones básicas para manipular los nodos y sus contenidos. La forma más sencilla de formular una expresión XPATH que apunte al nodo en cuestión es usando la Extensión de chequeo de XPATH, de esta manera:

  1. Instalar la extensión de chequeo de XPATH (si no está ya instalada), reiniciando después Firefox para completar la instalación.
  2. Visitar la página Spread Firefox.
  3. Buscar el conteo de descargas (a fecha actual está casi abajo del todo, a la derecha, bajo el título "Firefox downloads").
  4. Pulsar con el botón derecho sobre el número.
  5. Y seleccionar View XPath en el menú contextual.

El chequeador de XPATH abre entonces una nueva ventana con un campo XPath que contiene la ruta XPATH que apunta al nodo seleccionado, y que a la fecha de hoy es: id('download-count').

Bien, pues basta con añadir a nuestro <template> una etiqueta <value-of> con un atributo select con la ruta XPATH encontrada:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
      <template match="/">
        <value-of select="id('download-count')"/>
      </template>
    </transform>
  </template>
</generator>

Incluir texto

Para incluir en el microresumen el texto "Descargas de Fx", hay que usar una etiqueta XSLT <text> que contenga el texto deseado.

Añadir al <template> un nodo <text> que contenga el texto "Descargas de Fx":

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
      <template match="/">
        <value-of select="id('download-count')"/>
        <text>Descargas de Fx</text>
      </template>
    </transform>
  </template>
</generator>

Obsérvese que el espacio blanco (espacios, tabuladores, saltos de línea) entre etiquetas XSLT no se transmite a la salida de la transformación XSLT (al contrario que en HTML, en que todo el espacio blanco adyacente se traduce a un sólo espacio), así es que si se desea que aparezca algún espacio en blanco, para que el texto quede separado del conteo, hay que incluirlo dentro de la etiqueta <text>.

Y con esta pequeña adición, ya hemos terminado de escribir la hoja de transformación XSLT necesaria para convertir la página de inicio de Spread Firefox en un microresumen.

Especificar la página de aplicación del microresumen

Una vez completa la hoja de transformación, hay que especificar a qué página se aplica. Si fuéramos los administradores del sitio Srpead Firefox, nos bastaría con editar la página inicial e incluir en la sección head una etiqueta <link> para referenciar a nuestro generador:

<head>
  ...
  <link rel="microsummary" href="ruta/de/nuestro/generador.xml">
</head>

Pero como no somos administradores de ese sitio web, tenemos que especificar la página de aplicación dentro del propio generador, y luego publicarlo para que se pueda descargar e instalar. Para especificar la página de aplicación hay que usar una etiqueta <pages> dentro del nodo <generator>:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1"
           name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
      <template match="/">
        <value-of select="id('download-count')"/>
        <text> descargas de Fx</text>
      </template>
    </transform>
  </template>
  <pages>
  </pages>
</generator>

La etiqueta <pages> puede contener tantos nodos <include> y <exclude> como páginas a las cuales el generador se puede aplicar o no, respectivamente.

Para permitir que el generador se pueda aplicar a una página, hay que añadir un nodo <include> cuyo contenido sea una expresión regular que defina las páginas deseadas. Y para impedir que el generador se pueda aplicar a una página, hay que añadir un nodo <exclude> con una expresión regular que defina las páginas no deseadas.

El comportamiento por defecto de un generador es que no es aplicable a ninguna página, de modo que hay que listar explícitamente las páginas deseadas, y no es necesario listar las páginas no deseadas (a menos que se hayan incluido previamente).

Añadamos, pues, una etiqueta <include> para referenciar la página de Spread Firefox:

<?xml version="1.0" encoding="ISO-8859-1"?>
<generator xmlns="https://www.mozilla.org/microsummaries/0.1" name="Conteo de descargas de Firefox">
  <template>
    <transform xmlns="https://www.w3.org/1999/XSL/Transform" version="1.0">
      <output method="text"/>
      <template match="/">
        <value-of select="id('download-count')"/>
        <text> descargas de Fx</text>
      </template>
    </transform>
  </template>
  <pages>
    <include>https://(www\.)?spreadfirefox\.com/(index\.php)?</include>
  </pages>
</generator>

Nótese que la dirección incluida ha de estar escrita como expresión regular.

Publicar el generador para ser descargado

Ahora que el generador está definido y tiene una dirección de aplicación especificada, lo único que queda por hacer es publicarlo para su descarga: Para ello, hay que subirlo a la web y crear en algún lado un enlace de JavaScript que llame al método de FireFox window.sidebar.addMicrosummaryGenerator(), que se encarga de descargar e instalar el generador.

Por ejemplo: Si publicamos el generador en la web en https://people.mozilla.com/~myk/micro...-generator.xml, y queremos que los usuarios lo puedan descargar desde https://people.mozilla.com/~myk/micro...ial/index.html, tendremos que añadir el siguiente código a dicha página index.html:

<a href="javascript:window.sidebar.addMicrosummaryGenerator('https://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">Instalar el microresumen de Spread Firefox</a>

Al pinchar en tal link se producirá un error JavaScript en los navegadores que no soporten microresúmenes, así es que para evitarlo lo mejor es comprobar a priori si el navegador actual soporta microresúmenes, y mostrar un mensaje aclaratorio en caso contrario:

<script>
  const warning = "Se siente: Para descargar e instalar generadores de microresúmenes se necesita un navegador ad hoc, como Firefox 2.0.";
  function addGenerator(url) {
    if (typeof window.sidebar == "object" &&
        typeof window.sidebar.addMicrosummaryGenerator == "function")
      window.sidebar.addMicrosummaryGenerator(url);
    else
     alert(warning);
  }
</script>
<a href="javascript:window.sidebar.addMicrosummaryGenerator('https://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">Instalar el microresumen de Spread Firefox</a>

Conclusión

Ya debemos tener un generador de microresúmenes que muestra el nùmero actual de descargas de Firefox. Tras instalarlo, añadir a los Marcadores la página Spread Firefox, y seleccionar el microresumen del menú Summary en el cuadro de diálogo de "Añadir marcador".

Para más información sobre microresúmenes, ver la página de Microresúmenes

Etiquetas y colaboradores del documento

Etiquetas: 
 Colaboradores en esta página: FredB, DoctorRomi, Mgjbot, Planche, Nukeador, Jorolo, Giraldo, Saturno
 Última actualización por: FredB,