<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>::: Daniel Iván . COM ::: Violentas palabras de un lagartija nick &#187; microformatos</title>
	<atom:link href="http://danielivan.com/tag/microformatos/feed/" rel="self" type="application/rss+xml" />
	<link>http://danielivan.com</link>
	<description>poemas, recensiones, cuentos, video-arte, arte sonoro, ilustraciones y masturbaciones de todo tipo que salpican hacia los lados.</description>
	<lastBuildDate>Tue, 07 Sep 2010 00:18:21 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Código-Diablo: Agregando etiquetas &#8220;rel=&#8221; personalizadas a los enlaces en Wordpress 2.8.4</title>
		<link>http://danielivan.com/2009/10/20/codigo-diablo-agregando-etiquetas-rel-personalizadas-a-los-enlaces-en-wordpress-2-8-4/</link>
		<comments>http://danielivan.com/2009/10/20/codigo-diablo-agregando-etiquetas-rel-personalizadas-a-los-enlaces-en-wordpress-2-8-4/#comments</comments>
		<pubDate>Tue, 20 Oct 2009 19:12:15 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[webonadas]]></category>
		<category><![CDATA[código]]></category>
		<category><![CDATA[código-diablo]]></category>
		<category><![CDATA[microformatos]]></category>
		<category><![CDATA[microformats]]></category>
		<category><![CDATA[rel=]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://danielivan.com/?p=676</guid>
		<description><![CDATA[Luego de una muy infructuosa y frustrante búsqueda en todos los foros relacionados con Wordpress, XFN y otros microformatos, me fue imposible encontrar un plug-in o pieza de código para hacer esto que voy a explicar. Así que me metí al código de Wordpress 2.8.4 y encontré mi propia solución. No sé si es la [...]]]></description>
			<content:encoded><![CDATA[<p>Luego de una muy infructuosa y frustrante búsqueda en todos los foros relacionados con Wordpress, XFN y otros microformatos, me fue imposible encontrar un plug-in o pieza de código para hacer esto que voy a explicar. Así que me metí al código de Wordpress 2.8.4 y encontré mi propia solución. No sé si es la mejor, pero está funcionando y la comparto por si a alguien le sirve de algo.</p>
<p>Desde algunas versiones anteriores de Wordpress, se incorporó la funcionalidad para agregar etiquetas XFN (etiquetas de &#8220;relación con el enlace&#8221;, uno de los <a href="http://microformats.org/" target="_blank">microformatos</a> más populares) cuando uno agrega un enlace al &#8220;blogroll&#8221; o cualquier categoría de enlaces propia en la interface del blog. La inclusión de una de estas &#8220;relaciones&#8221; da como resultado una etiqueta <span style="color: #ff6600;">rel=&#8221;algo&#8221;</span> en las etiquetas de enlace <span style="color: #ff6600;">&lt;a&gt;</span>. Esta idea es relativamente nueva y está pensada para &#8220;representar las relaciones humanas usando hiperenlaces&#8221;, según dicen sus creadores en la <a href="http://gmpg.org/xfn/" target="_blank">página oficial de la idea</a>. No calificaré la idea en sí misma; eso le tocará a la blogósfera en general (además, la inclusión de la idea en las últimas versiones de Wordpress le está garantizando una gran difusión, casi una imposición, en el mundillo de los blogs).</p>
<p>Lo que es cierto es que la idea ha trascendido rápidamente el ámbito de las &#8220;relaciones humanas&#8221; -tenía que ser- y está comenzando a aplicarse para la invocación de ciertas aplicaciones Javascript basadas en Mootools o JQuery (entre otras) para la inclusión de efectos visuales del tipo &#8220;Lightbox&#8221;, &#8220;Sexy Lightbox&#8221;, entre otras; además de los usos que ya tiene para la invocación de hojas de estilo CSS, enlaces favoritos, etc.</p>
<p><span id="more-676"></span>Al usar la interface de Wordpress para Añadir Enlaces, puede encontrarse en la parte baja el apartado &#8220;Relación con el Enlace (XFN)&#8221;, que ofrece una serie de opciones predeterminadas. <strong>El problema</strong> consiste en que si uno intenta rellenar el campo con una etiqueta personalizada (usaré como ejemplo &#8220;sexylightbox&#8221;, la etiqueta que me llevó a todo esto), el javascript &#8220;reconstruye&#8221; la etiqueta basándose en las opciones predeterminadas, borrando literalmente cualquier cosa que nosotros escribamos.</p>
<p>La primera opción que encontré fue alterar el .js del javascript para evitar la reconstrucción automática, basándome en una sugerencia de <a href="http://www.eduardoburgos.com/2008/05/03/write-custom-rel-tags-for-your-links-in-wordpress-251/" target="_blank">Eduardo Burgos para la versión 2.5.1</a>. Ignoro si en esa versión funcionará, pero en la 2.8.4 NO tiene ningún resultado.</p>
<p>La conclusión a la que llegué fue más sencilla: no alterar el .js sino alterar el formulario que invoca al .js, haciendo que por default incluya la opción para agregar la &#8220;<span style="color: #ff6600;">rel=</span>&#8221; que necesitemos.</p>
<p>Así, el método es el siguiente:</p>
<ol>
<li>Abrimos el archivo <span style="color: #ff6600;">/wp-admin/edit-link-form.php</span>; alrededor de la línea 189 comienza la tabla que contiene el formulario XFN.</li>
<li>Agregamos la siguiente pieza de código, tomando en consideración que se trata de una tabla HTML:<br />
<span style="color: #ff6600;">&lt;tr&gt;</span><span style="color: #ff6600;"><br />
&lt;th scope=&#8221;row&#8221;&gt; &lt;?php /* translators: xfn: http://gmpg.org/xfn/ */ _e(&#8216;<span style="color: #99cc00;">sexylightbox</span>&#8216;) ?&gt; &lt;/th&gt;</span><span style="color: #ff6600;"><br />
&lt;td&gt;&lt;fieldset&gt;&lt;legend&gt;&lt;span&gt; &lt;?php /* translators: xfn: http://gmpg.org/xfn/ */ _e(&#8216;<span style="color: #99cc00;">sexylightbox</span>&#8216;) ?&gt; &lt;/span&gt;&lt;/legend&gt;</span><span style="color: #ff6600;"><br />
&lt;label for=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8220;&gt;</span><span style="color: #ff6600;"><br />
&lt;input type=&#8221;radio&#8221; name=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8221; value=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8221; id=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8221; &lt;?php xfn_check(&#8216;friendship&#8217;, &#8216;<span style="color: #99cc00;">sexylightbox</span>&#8216;, &#8216;radio&#8217;); ?&gt; /&gt; &lt;?php /* translators: xfn: http://gmpg.org/xfn/ */ _e(&#8216;<span style="color: #99cc00;">sexylightbox</span>&#8216;) ?&gt;&lt;/label<br />
</span><span style="color: #ff6600;">&lt;label for=&#8221;friendship&#8221;&gt;</span><span style="color: #ff6600;"><br />
&lt;input name=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8221; type=&#8221;radio&#8221; value=&#8221;" id=&#8221;<span style="color: #99cc00;">sexylightbox</span>&#8221; &lt;?php xfn_check(&#8216;friendship&#8217;, &#8221;, &#8216;radio&#8217;); ?&gt; /&gt; &lt;?php /* translators: xfn: http://gmpg.org/xfn/ */ _e(&#8216;none&#8217;) ?&gt;&lt;/label&gt;</span><span style="color: #ff6600;"><br />
&lt;/fieldset&gt;&lt;/td&gt;</span><span style="color: #ff6600;"><br />
&lt;/tr&gt;</span></p>
<p>Cabe señalar que todos los &#8220;sexylightbox&#8221; que aparecen aquí en verde, deben corresponderse con la etiqueta &#8220;<span style="color: #ff6600;">rel=</span>&#8221; que se quiera agregar.<br />
Cabe también señalar que conservé algunas de las invocaciones a la etiqueta &#8220;friendship&#8221; -que utilicé como modelo- porque por alguna razón la opción &#8220;ninguno&#8221; (none) no parecía funcionar bien si se cambiaban esas invocaciones.<br />
Cabe también, por último, decir que el mejor lugar para pegar este código (si lo vas a copiar y pegar) es entre las etiquetas <span style="color: #ff6600;">&lt;/tr&gt;</span> y <span style="color: #ff6600;">&lt;tr&gt;</span> de cualquiera de las líneas de la tabla.</li>
<li>Guardamos el archivo <span style="color: #ff6600;">edit-link.form.php</span>. El resultado en la interface de Wordpress 2.8.4 es el siguiente:
<p><div class="wp-caption alignnone" style="width: 510px"><a rel="sexylightbox" href="http://farm3.static.flickr.com/2523/4029863090_647c9e3656_o.jpg"><img title="Click para ver en tamaño grande" src="http://farm3.static.flickr.com/2523/4029863090_68102c9ba9.jpg" alt="" width="500" height="272" /></a><p class="wp-caption-text">Click para ver en tamaño grande</p></div></li>
<li>Cuando elegimos la opción &#8220;sexylightbox&#8221; (o la etiqueta &#8220;<span style="color: #ff6600;">rel=</span>&#8221; que hayamos agregado), ésta se incluye de manera automática en el campo y se mezcla con todas aquellas que hayamos elegido (salvo con la etiqueta &#8220;me&#8221; -<em>otra dirección web mía</em>- que anula todas las demás por defecto).</li>
<li>Si queremos eliminar nuestra <span style="color: #ff6600;">rel=</span> personalizada, basta con escoger &#8220;ninguno&#8221;, como cabría imaginar.</li>
<li>Supongo que esto funcionará con cuantas etiquetas queramos agregar, pero yo sólo agregué la que me interesaba (lo cual es egoísta; pero se entiende, espero).</li>
</ol>
<p>El único bug que encontré a esta solución es que cada vez que se edite el enlace deberás asegurarte de que la opción de la etiqueta &#8220;<span style="color: #ff6600;">rel=</span>&#8221; que agregaste esté activada. El .js parece borrar cualquier etiqueta que no esté por defecto en su código. Pero, ¿cuántas veces puede uno editar un enlace en el blogroll? Espero que no muchas.</p>
<p>Puedes ver una aplicación de este método haciendo click en la liga &#8220;Selección de Fotografías&#8221; de la barra de navegación derecha de este blog, donde apliqué la <span style="color: #ff6600;">rel=&#8221;sexylightbox&#8221;</span> para agregar el efecto al link de <a rel="sexylightbox" href="http://www.danielivan.com/fotos/index.html?TB_iframe=1&amp;width=1000&amp;height=500">mi galería de fotografías</a>.</p>
<p>Espero que les sea útil.</p>
]]></content:encoded>
			<wfw:commentRss>http://danielivan.com/2009/10/20/codigo-diablo-agregando-etiquetas-rel-personalizadas-a-los-enlaces-en-wordpress-2-8-4/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
