<?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>voragine.net &#187; Desarrollo web</title>
	<atom:link href="http://voragine.net/archivo/weblogs/feed" rel="self" type="application/rss+xml" />
	<link>http://voragine.net</link>
	<description>Autonomía digital y tecnológica.</description>
	<lastBuildDate>Mon, 06 Feb 2012 16:55:48 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3-RC3-19589</generator>
		<item>
		<title>Cómo ejecutar PHP periódicamente con cron en un servidor Linux</title>
		<link>http://voragine.net/weblogs/como-ejecutar-php-periodicamente-con-cron-en-un-servidor-linux</link>
		<comments>http://voragine.net/weblogs/como-ejecutar-php-periodicamente-con-cron-en-un-servidor-linux#comments</comments>
		<pubDate>Sat, 31 Dec 2011 07:00:23 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[GNU/Linux]]></category>
		<category><![CDATA[Scripting y programación]]></category>
		<category><![CDATA[bash]]></category>
		<category><![CDATA[cron]]></category>
		<category><![CDATA[curl]]></category>
		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=866</guid>
		<description><![CDATA[Primero tenemos que tener la posibilidad de <strong><a title="Usando PHP desde la línea de comandos -- php.net" href="http://php.net/manual/es/features.commandline.php">ejecutar un script PHP desde la línea de comandos</a></strong>, o en su defecto <a title="Ejecutar scripts PHP automáticamente desde el cron con CURL -- programacion.com" href="http://www.programacion.com/articulo/ejecutar_scripts_php_automaticamente_desde_el_cron_con_curl_302">ejecutarlo con curl</a>; en este tutorial lo haremos ejecutando el PHP directamente en la línea de comandos sin curl. Luego tenemos que generar el archivo PHP, y un script sh que ejecute el script PHP. Por último, <strong><a title="MANUAL BÁSICO DE CRON -- linuxtotal.com.mx" href="http://www.linuxtotal.com.mx/index.php?cont=info_admon_006">configuraremos cron para que ejecute el script de bash con la periodicidad que necesitemos</a></strong>.]]></description>
			<content:encoded><![CDATA[<p>Primero tenemos que tener la posibilidad de <strong><a title="Usando PHP desde la línea de comandos -- php.net" href="http://php.net/manual/es/features.commandline.php">ejecutar un script PHP desde la línea de comandos</a></strong>, o en su defecto <a title="Ejecutar scripts PHP automáticamente desde el cron con CURL -- programacion.com" href="http://www.programacion.com/articulo/ejecutar_scripts_php_automaticamente_desde_el_cron_con_curl_302">ejecutarlo con curl</a>; en este tutorial lo haremos ejecutando el PHP directamente en la línea de comandos sin curl. Luego tenemos que generar el archivo PHP, y un script sh que ejecute el script PHP. Por último, <strong><a title="MANUAL BÁSICO DE CRON -- linuxtotal.com.mx" href="http://www.linuxtotal.com.mx/index.php?cont=info_admon_006">configuraremos cron para que ejecute el script de bash con la periodicidad que necesitemos</a></strong>.</p>
<p>Para ejecutar un script PHP en la línea de comandos necesitamos tener instalado el paquete <code>php5-cli</code>, como root.</p>
<pre class="brush: bash; title: ; notranslate">apt-get install php5-cli</pre>
<p>La sintaxis para ejecutar un script PHP es la siguiente:</p>
<pre class="brush: bash; title: ; notranslate">php file.php</pre>
<p>Generamos un script PHP mínimo, <a title="PHP to save data to a text file -- http://board.flashkit.com" href="http://board.flashkit.com/board/showthread.php?t=491680">que escribirá una línea en un archivo de texto plano cada vez que se ejecute</a>, y lo llamamos por ejemplo <code>test.cron.php</code>; el archivo se alojará en el mismo directorio que los scripts.</p>
<pre class="brush: php; title: ; notranslate">$time = date(&quot;G:i:s&quot;);
$entry = &quot;Información guardada a las $time.\n&quot;;
$file = &quot;/var/www/testdir/test.cron.txt&quot;;
$open = fopen($file,&quot;a&quot;);

if ( $open ) {
	fwrite($open,$entry);
	fclose($open);
}</pre>
<p>Para que al ejecutar el script con cron no nos dé el error <code>Could not open input file: test.cron.php</code>, es recomendable especificar la ruta completa al archivo PHP. Si el error que obtenemos está relacionado con <code>open_basedir restriction</code> tenemos que definir la variable <code>open_basedir</code> en el archivo <code><a title="Descripción de las directivas del núcleo de php.ini -- php.net" href="http://php.net/manual/es/ini.core.php">/etc/php5/cli/php.ini</a></code> y asignarle como valor la ruta del directorio donde se encuentre el script PHP, como root, <a title="open_basedir restriction in effect -- forosdelweb.com" href="http://www.linuxtotal.com.mx/index.php?cont=info_admon_006">importante el punto final</a>:</p>
<pre class="brush: bash; title: ; notranslate">open_basedir = /var/www/testdir/.</pre>
<p>Luego reiniciamos el servidor apache, como root:</p>
<pre class="brush: bash; title: ; notranslate">/etc/init.d/apache restart</pre>
<p>Creamos ahora un script de bash que ejecute el script PHP; lo llamamos por ejemplo <code>test.cron.sh</code>:</p>
<pre class="brush: bash; title: ; notranslate">#!/bin/sh
php /var/www/testdir/test.cron.php</pre>
<p>Es importante la primera línea que le dice al sistema el tipo de shell que debe usar para ejecutar el script. La shell tiene que ser la misma que almacena la variable <code>SHELL</code> del archivo <code>/etc/crontab</code>, <code>/bin/sh</code> en mi caso.</p>
<p>Por último, <strong><a title="MANUAL BÁSICO DE CRON -- linuxtotal.com.mx" href="http://www.linuxtotal.com.mx/index.php?cont=info_admon_006">configuramos cron</a></strong>, tras asegurarnos de que el demonio crond está corriendo. Básicamente necesitamos decirle a cron qué script queremos ejecutar y con qué periodicidad. Podemos hacerlo editando el archivo <code>/etc/crontab</code>, añadiéndole la siguiente línea, a continuación de las reglas ya existentes, como root:</p>
<pre class="brush: bash; title: ; notranslate">*/15 * * * * usuario /var/www/testdir/./test.cron.sh</pre>
<p>En este caso, el script <code>/var/www/testdir/./test.cron.sh</code> se ejecutará cada quince minutos. Es importante que el <code>usuario</code> tenga suficientes permisos para leer y ejecutar el script.</p>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-ejecutar-php-periodicamente-con-cron-en-un-servidor-linux/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cómo transformar el formato de un flujo RSS, mediante DOM, para poder usarlo libremente con PHP</title>
		<link>http://voragine.net/weblogs/como-transformar-el-formato-de-un-flujo-rss-mediante-dom-para-poder-usarlo-libremente-con-php</link>
		<comments>http://voragine.net/weblogs/como-transformar-el-formato-de-un-flujo-rss-mediante-dom-para-poder-usarlo-libremente-con-php#comments</comments>
		<pubDate>Wed, 14 Dec 2011 18:38:49 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[RSS]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=854</guid>
		<description><![CDATA[RSS o Really Simple Syndication es una simplificación de XML. Mediante DOM (Document Object Model) podemos transformar cualquier flujo XML en una matriz multidimensional con la que podremos operar fácilmente en PHP.]]></description>
			<content:encoded><![CDATA[<p>RSS o Really Simple Syndication es una simplificación de XML. Mediante DOM (Document Object Model) podemos transformar cualquier flujo XML en una matriz multidimensional con la que podremos operar fácilmente en PHP.</p>
<p>Tomemos como ejemplo un XML de los últimos tweets de un usuario de Twitter, <a title="skotperez en twitter" href="http://twitter.com/skotperez">@skotperez</a> en este caso. Podemos <a title="How to follow a Twitter account feed using RSS Reader in New Twitter -- God, Your Book Is Great !!" href="http://saravananthirumuruganathan.wordpress.com/2011/05/29/how-to-follow-a-twitter-account-feed-using-rss-reader-in-new-twitter/">extraer esta información gracias a la API de Twitter</a>.</p>
<p><code><a href="https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=skotperez">https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=skotperez</a></code></p>
<p>Una vez que tenemos el feed lo <strong><a title="How to parse RSS feeds with PHP -- Software 51" href="http://www.softarea51.com/tutorials/parse_rss_with_php.html">podemos manipular con DOM y almacenar el resultado en una variable</a></strong>, <code>$arrFeeds</code> en este caso:</p>
<pre class="brush: php; title: ; notranslate">
$feed_url = &quot;https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=skotperez&quot;;
$doc = new DOMDocument();
$doc-&gt;load($feed_url);
$arrFeeds = array();
foreach ($doc-&gt;getElementsByTagName('item') as $node) {
  $itemRSS = array (
    'title' =&gt; $node-&gt;getElementsByTagName('title')-&gt;item(0)-&gt;nodeValue,
    'desc' =&gt; $node-&gt;getElementsByTagName('description')-&gt;item(0)-&gt;nodeValue,
    'link' =&gt; $node-&gt;getElementsByTagName('link')-&gt;item(0)-&gt;nodeValue,
    'date' =&gt; $node-&gt;getElementsByTagName('pubDate')-&gt;item(0)-&gt;nodeValue
  );
  array_push($arrFeeds, $itemRSS);
}
</pre>
<p>Luego podemos hacer correr un loop a lo largo de los elementos de la matriz para obtener la información que queramos:</p>
<pre class="brush: php; title: ; notranslate">
foreach ( $arrFeeds as $tw ) {
  echo $tw['date'];
  echo &quot;&lt;br /&gt;&quot;;
  echo $tw['desc'];
  echo &quot;&lt;br /&gt;&quot;;
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-transformar-el-formato-de-un-flujo-rss-mediante-dom-para-poder-usarlo-libremente-con-php/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cómo centrar un elemento exactamente en el centro, con CSS</title>
		<link>http://voragine.net/weblogs/como-centrar-un-elemento-exactamente-en-el-centro-con-css</link>
		<comments>http://voragine.net/weblogs/como-centrar-un-elemento-exactamente-en-el-centro-con-css#comments</comments>
		<pubDate>Tue, 22 Nov 2011 07:00:07 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Breves]]></category>
		<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=841</guid>
		<description><![CDATA[Para centrar un elemento de unas dimensiones concretas, por ejemplo de 100px de alto y 200px de ancho, en el centro de la página con CSS podemos usar los siguientes atributos de CSS.]]></description>
			<content:encoded><![CDATA[<p>Para <strong><a title="Quick CSS Trick: How To Center an Object Exactly In The Center -- CSS Trick" href="http://css-tricks.com/320-quick-css-trick-how-to-center-an-object-exactly-in-the-center/">centrar un elemento de unas dimensiones concretas</a></strong>, por ejemplo de 100px de alto y 200px de ancho, en el centro de la página podemos usar los siguientes atributos de CSS:</p>
<pre class="brush: css; title: ; notranslate">
.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-centrar-un-elemento-exactamente-en-el-centro-con-css/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Galería mínima para imágenes, vídeos o textos, en jQuery</title>
		<link>http://voragine.net/weblogs/galeria-minima-para-imagenes-videos-o-textos-en-jquery</link>
		<comments>http://voragine.net/weblogs/galeria-minima-para-imagenes-videos-o-textos-en-jquery#comments</comments>
		<pubDate>Mon, 21 Nov 2011 18:39:06 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[fadeIn]]></category>
		<category><![CDATA[fadeOut]]></category>
		<category><![CDATA[galerías de imagenes]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=836</guid>
		<description><![CDATA[El siguiente script de jQuery añade una galería mínima, muy sencilla, que permite paginar contenido e ir accediendo a él mediante unas flechas de anterior y siguiente, con transición fadeIn-fadeOut.]]></description>
			<content:encoded><![CDATA[<p>El siguiente script de jQuery añade una galería mínima, muy sencilla, que permite paginar contenido e ir accediendo a él mediante unas flechas de anterior y siguiente, con transición fadeIn-fadeOut.</p>
<p>El DOM debe ser algo como lo que sigue:</p>
<pre class="brush: xml; title: ; notranslate">
&lt;div id=&quot;flus&quot;&gt;

  &lt;div class=&quot;part&quot;&gt;
   &lt;img src=&quot;http://url.de/la-imagen.png&quot; alt=&quot;Descripción de la imagen&quot; /&gt;
  &lt;/div&gt;&lt;!-- end .part --&gt;

  &lt;div class=&quot;part&quot;&gt;
   &lt;img src=&quot;http://url.de/la-imagen.png&quot; alt=&quot;Descripción de la imagen&quot; /&gt;
  &lt;/div&gt;&lt;!-- end .part --&gt;

  &lt;div class=&quot;part&quot;&gt;
   &lt;img src=&quot;http://url.de/la-imagen.png&quot; alt=&quot;Descripción de la imagen&quot; /&gt;
  &lt;/div&gt;&lt;!-- end .part --&gt;

&lt;/div&gt;&lt;!-- end #flus --&gt;
</pre>
<p>Ahora el script:</p>
<pre class="brush: jscript; title: ; notranslate">
// minimum jQuery gallery
$(document).ready(function(){
        $('#flus div.part').hide();
        $('#flus div.part:first').show().addClass('visto');
        var $curr = $('.visto');
        $('#flus').append('&lt;div class=&quot;flus-flechas&quot;&gt;&lt;span class=&quot;flus-flecha&quot; id=&quot;flus-prev&quot; title=&quot;P&amp;aacute;gina anterior&quot;&gt;&amp;laquo;&lt;/span&gt;&lt;span class=&quot;flus-flecha&quot; id=&quot;flus-next&quot; title=&quot;P&amp;aacute;gina siguiente&quot;&gt;&amp;raquo;&lt;/span&gt;&lt;/div&gt;');
        $('#flus-prev').click(function(){
                if ( $('#flus div.part:first').hasClass('visto') ) {
                } else {
                        $curr = $curr.prev();
                        $('.visto').fadeOut('100').removeClass('visto');
                        $curr.fadeIn('600').addClass('visto');
                }
        });
        $('#flus-next').click(function(){
                if ( $('#flus div.part:last').hasClass('visto') ) {
                } else {
                        $curr = $curr.next();
                        $('.visto').fadeOut('100').removeClass('visto');
                        $curr.fadeIn('600').addClass('visto');
                }
        });
});
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/galeria-minima-para-imagenes-videos-o-textos-en-jquery/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cómo obtener el thumbnail y otros datos de vídeos de Youtube</title>
		<link>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-youtube</link>
		<comments>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-youtube#comments</comments>
		<pubDate>Tue, 01 Nov 2011 16:54:36 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[youtube]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=802</guid>
		<description><![CDATA[La <a title="Developer Tools -- Youtube" href="http://www.youtube.com/dev">API de Youtube</a> es bastante más farragosa que la de Vimeo; si para <a title="Cómo obtener el thumbnail y otros datos de vídeos de Vimeo, usando su API -- voragine.net" href="http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-vimeo-usando-su-api">obtener datos de un vídeo de Vimeo</a> utilizábamos su API, en el caso de Youtube no merece la pena. En las FAQ de la propia página de Youtube sugieren métodos que nada tienen que ver con extraer datos de la página, como por ejemplo para <a title="YouTube en tu sitio -- Youtube" href="http://www.youtube.com/youtubeonyoursite">conocer las dimensiones de un vídeo</a>.]]></description>
			<content:encoded><![CDATA[<p>La <a title="Developer Tools -- Youtube" href="http://www.youtube.com/dev">API de Youtube</a> es bastante más farragosa que la de Vimeo; si para <a title="Cómo obtener el thumbnail y otros datos de vídeos de Vimeo, usando su API -- voragine.net" href="http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-vimeo-usando-su-api">obtener datos de un vídeo de Vimeo</a> utilizábamos su API, en el caso de Youtube no merece la pena. En las FAQ de la propia página de Youtube sugieren métodos que nada tienen que ver con extraer datos de la página, como por ejemplo para <a title="YouTube en tu sitio -- Youtube" href="http://www.youtube.com/youtubeonyoursite">conocer las dimensiones de un vídeo</a>.</p>
<p>Así que para <strong><a title="How to grab thumbnails for youtube and google video -- scottklarr.com" href="http://www.scottklarr.com/topic/415/how-to-grab-thumbnails-for-youtube-and-google-video/">utilizar el thumbnail de un vídeo de Youtube</a></strong> lo único que tenemos que hacer es hacer una petición al servidor que los aloja, con el identificador del vídeo:</p>
<pre class="brush: php; title: ; notranslate">
$video_id = AtiYuWFXC1g;
// thumb de alta calidad
$video_thumb_hq = &quot;http://img.youtube.com/vi/$video_id/hqdefault.jpg&quot;;
// thumb de calidad baja
$video_thumb = &quot;http://img.youtube.com/vi/$video_id/default.jpg&quot;;
$video_w = &quot;500&quot;; // definimos la que nos interese
$video_h = $video_w * 0.8235;
</pre>
<p>Con estos datos podemos obtener la miniatura en nuestra página:</p>
<pre class="brush: php; title: ; notranslate">
$video_out = &quot;&lt;/pre&gt;
&lt;img style=&quot;width: 125px;&quot; src=&quot;$video_thumb_hq&quot; alt=&quot;$video_title&quot; /&gt;
&lt;pre&gt;
&quot;;
echo $video_out;
</pre>
<p>Y el vídeo también:</p>
<pre class="brush: php; title: ; notranslate">
$video_codigo = &quot;&lt;/pre&gt;
&lt;iframe src=&quot;http://www.youtube.com/embed/$video_id&quot; frameborder=&quot;0&quot; width=&quot;$video_w&quot; height=&quot;$video_h&quot;&gt;&lt;/iframe&gt;
&lt;pre&gt;&quot;;
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-youtube/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cómo obtener el thumbnail y otros datos de vídeos de Vimeo, usando su API</title>
		<link>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-vimeo-usando-su-api</link>
		<comments>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-vimeo-usando-su-api#comments</comments>
		<pubDate>Mon, 31 Oct 2011 12:46:22 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[unserialize]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[vimeo]]></category>
		<category><![CDATA[vimeo API]]></category>
		<category><![CDATA[vimeo thumbnail]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=797</guid>
		<description><![CDATA[Vimeo tiene una API realmente ágil y sencilla. Mediante una petición vía URL se obtienen todos los datos relacionados con un vídeo, pudiendo definir el formato de estos datos. Tal como se explica en la <strong><a title="Developers / Simple API -- vimeo.com" href="http://vimeo.com/api/docs/simple-api">API de Vimeo</a></strong>.]]></description>
			<content:encoded><![CDATA[<p>Vimeo tiene una API realmente ágil y sencilla. Mediante una petición vía URL se obtienen todos los datos relacionados con un vídeo, pudiendo definir el formato de estos datos. Tal como se explica en la <strong><a title="Developers / Simple API -- vimeo.com" href="http://vimeo.com/api/docs/simple-api">API de Vimeo</a></strong>:</p>
<blockquote><p><code>http://vimeo.com/api/v2/video/<strong>video_id</strong>.<strong>output</strong></code><br />
<strong><code>video_id</code></strong> The ID of the video you want information for.<br />
<strong><code>output</code></strong> Specify the output type. We currently offer JSON, PHP, and XML formats.</p></blockquote>
<p>La opción de salida PHP nos permite tener todos los datos del vídeo en una matriz para usarlos a voluntad, pero antes <a title="Get img thumbnails from Vimeo? -- Stackoverflow" href="http://stackoverflow.com/questions/1361149/get-img-thumbnails-from-vimeo">debemos aplicarles el filtro unserialize()</a>:</p>
<pre class="brush: php; title: ; notranslate">
$video_id = 8241516;
$video_info = unserialize(file_get_contents(&quot;http://vimeo.com/api/v2/video/$video_id.php&quot;));
$video_thumb = $video_info[0]['thumbnail_medium'];
$video_title = $video_info[0]['title'];
$video_w = $video_info[0]['width'];
$video_h = $video_info[0]['height'];
$video_url = $video_info[0]['video_url'];
</pre>
<p>Con estos datos podemos obtener la minuatura con un enlace al vídeo:</p>
<pre class="brush: php; title: ; notranslate">
$video_out = &quot;
&lt;a href='$video_url' title='$video_title'&gt;&lt;img style='width: 125px;' src='$video_thumb' alt='$video_title' /&gt;&lt;/a&gt;
&quot;;
echo $video_out;
</pre>
<p>O embeber el vídeo:</p>
<pre class="brush: php; title: ; notranslate">
$video_codigo = &quot;&lt;iframe src='http://player.vimeo.com/video/$video_id?title=0&amp;amp;byline=0&amp;amp;portrait=0&amp;amp;color=ffffff' width='$video_w' height='$video_h' frameborder='0' webkitAllowFullScreen allowFullScreen&gt;&lt;/iframe&gt;&quot;;
echo $video_codigo;
</pre>
<p>La API permite obtener datos también de los usuarios, hacer listas de reproducción. Bien sencillo.</p>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-obtener-el-thumbnail-y-otros-datos-de-videos-de-vimeo-usando-su-api/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Formularios con efectos onclick y onfocus de JavaScript pero que utilizan solo HTML y CSS</title>
		<link>http://voragine.net/weblogs/formularios-con-efectos-onclick-y-onfocus-de-javascript-pero-que-utilizan-solo-html-y-css</link>
		<comments>http://voragine.net/weblogs/formularios-con-efectos-onclick-y-onfocus-de-javascript-pero-que-utilizan-solo-html-y-css#comments</comments>
		<pubDate>Fri, 14 Oct 2011 12:37:01 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[form]]></category>
		<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=765</guid>
		<description><![CDATA[Examinando el <a title="The Twenty Eleven Theme -- WordPress.com" href="http://twentyelevendemo.wordpress.com/">tema Twentyeleven de WordPress</a> he encontrado una solución bien elegante para hacer formularios sin javascript pero con efectos equivalentes, que funcionan utilizando únicamente HTML y CSS. Con este código obtendrás un formulario del estilo del que puedes usar para comentar en esta página.]]></description>
			<content:encoded><![CDATA[<p>Examinando el <a title="The Twenty Eleven Theme -- WordPress.com" href="http://twentyelevendemo.wordpress.com/">tema Twentyeleven de WordPress</a> he encontrado una solución bien elegante para hacer formularios sin javascript pero con efectos equivalentes, que funcionan utilizando únicamente HTML y CSS. Con este código obtendrás un formulario del estilo del que puedes usar para comentar en esta página.</p>
<p>Construimos el DOM utilizando las etiquetas fieldset, label, input y textarea:</p>
<pre class="brush: xml; title: ; notranslate">
&lt;form id=&quot;form&quot; action=&quot;http://url.de/la-accion.php&quot; method=&quot;post&quot;&gt;

 &lt;fieldset&gt;
  &lt;label for=&quot;nombre&quot;&gt;Nombre&lt;/label&gt;
  &lt;input id=&quot;nombre&quot; tabindex=&quot;1&quot; type=&quot;text&quot; name=&quot;nombre&quot; value=&quot;&quot; size=&quot;22&quot; /&gt;
 &lt;/fieldset&gt;

 &lt;fieldset&gt;
  &lt;label for=&quot;mensaje&quot;&gt;Mensaje&lt;/label&gt;
  &lt;textarea id=&quot;mensaje&quot; tabindex=&quot;2&quot; name=&quot;mensaje&quot; rows=&quot;10&quot; cols=&quot;100%&quot;&gt;&lt;/textarea&gt;
 &lt;/fieldset&gt;

 &lt;fieldset&gt;
  &lt;input id=&quot;enviar&quot; tabindex=&quot;3&quot; type=&quot;submit&quot; name=&quot;enviar&quot; value=&quot;Enviar mensaje&quot; /&gt;
 &lt;/fieldset&gt;

&lt;/form&gt;
</pre>
<p>Y le aplicamos los siguientes estilos CSS:</p>
<pre class="brush: css; title: ; notranslate">
#form fieldset {
        position: relative;
        margin: 1em 0;
}
#form label {
        display: inline-block;
        left: 6px;
        min-width: 60px;
        padding: 4px 10px;
        position: relative;
        top: 28px;
        z-index: 1;
}
#form input[type=&quot;text&quot;],
#form textarea {
        background: #fff;
        position: relative;
        padding: 10px;
        text-indent: 80px;
        width: 478px;
        border: 1px solid #000;
}
#form input[type=&quot;text&quot;]:focus,
#form textarea:focus {
        text-indent: 0;
        z-index: 1;
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/formularios-con-efectos-onclick-y-onfocus-de-javascript-pero-que-utilizan-solo-html-y-css/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Las etiquetas article y section de HTML5</title>
		<link>http://voragine.net/weblogs/las-etiquetas-article-y-section-de-html5</link>
		<comments>http://voragine.net/weblogs/las-etiquetas-article-y-section-de-html5#comments</comments>
		<pubDate>Mon, 10 Oct 2011 17:28:12 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Breves]]></category>
		<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[article]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[section]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=759</guid>
		<description><![CDATA[En <em>Standardistas</em> he encontrado la mejor explicación sobre <strong><a title="HTML5: section v. article -- Standardistas" href="http://www.standardista.com/html5-section-v-article/">cómo usar las nuevas etiquetas <code>section</code> y <code>article</code></a></strong> de HTML5, <a title="HTML5 articles and sections: what’s the difference? -- brucelawson.co.uk" href="http://www.brucelawson.co.uk/2010/html5-articles-and-sections-whats-the-difference/">que tanto debate han traído</a>, haciendo una analogía con la estructura de un periódico: «The paper comes in sections. You have the sports section, real estate section, maybe home &#38; garden section, etc. Each of those sections, in turn, has articles in it. And, some of those articles are divided into sections themselves.» Obvio, pero aclara saber que se pueden meter los unos dentro de los otros y viceversa.]]></description>
			<content:encoded><![CDATA[<p>En <em>Standardistas</em> he encontrado la mejor explicación sobre <strong><a title="HTML5: section v. article -- Standardistas" href="http://www.standardista.com/html5-section-v-article/">cómo usar las nuevas etiquetas <code>section</code> y <code>article</code></a></strong> de HTML5, <a title="HTML5 articles and sections: what’s the difference? -- brucelawson.co.uk" href="http://www.brucelawson.co.uk/2010/html5-articles-and-sections-whats-the-difference/">que tanto debate han traído</a>, haciendo una analogía con la estructura de un periódico: «The paper comes in sections. You have the sports section, real estate section, maybe home &amp; garden section, etc. Each of those sections, in turn, has articles in it. And, some of those articles are divided into sections themselves.» Obvio, pero aclara saber que se pueden meter los unos dentro de los otros y viceversa.</p>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/las-etiquetas-article-y-section-de-html5/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cómo comprobar la compatibilidad de HTML5 en diferentes navegadores</title>
		<link>http://voragine.net/weblogs/como-comprobar-la-compatibilidad-de-html5-en-diferentes-navegadores</link>
		<comments>http://voragine.net/weblogs/como-comprobar-la-compatibilidad-de-html5-en-diferentes-navegadores#comments</comments>
		<pubDate>Fri, 07 Oct 2011 08:00:16 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Breves]]></category>
		<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML validator]]></category>
		<category><![CDATA[HTML5]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=751</guid>
		<description><![CDATA[La página html5test.com permite comprobar la <strong><a title="THE HTML5 TEST – HOW WELL DOES YOUR BROWSER SUPPORT HTML5?" href="http://html5test.com/index.html">compatibilidad de los navegadores más extendidos con HTML5</a></strong>, en sus versiones estable y en desarrollo. Según esta página <a title="THE HTML5 TEST – HOW WELL DOES YOUR BROWSER SUPPORT HTML5?" href="http://html5test.com/index.html">ningún navegador soporta por completo HTML5</a>. Para ver concretamente los trozos de código que no cumplen con el futuro estándar abierto de la web, se pude usar el <strong><a title="Markup Validation Service -- W3C" href="http://validator.w3.org/">validador del W3C</a></strong>.]]></description>
			<content:encoded><![CDATA[<p>La página html5test.com permite comprobar la <strong><a title="THE HTML5 TEST – HOW WELL DOES YOUR BROWSER SUPPORT HTML5?" href="http://html5test.com/index.html">compatibilidad de los navegadores más extendidos con HTML5</a></strong>, en sus versiones estable y en desarrollo. Según esta página <a title="THE HTML5 TEST – HOW WELL DOES YOUR BROWSER SUPPORT HTML5?" href="http://html5test.com/index.html">ningún navegador soporta por completo HTML5</a>. Para ver concretamente los trozos de código que no cumplen con el futuro estándar abierto de la web, se pude usar el <strong><a title="Markup Validation Service -- W3C" href="http://validator.w3.org/">validador del W3C</a></strong>.</p>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/como-comprobar-la-compatibilidad-de-html5-en-diferentes-navegadores/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Cabecera mínima en HTML5 para WordPress</title>
		<link>http://voragine.net/weblogs/cabecera-minima-en-html5-para-wordpress</link>
		<comments>http://voragine.net/weblogs/cabecera-minima-en-html5-para-wordpress#comments</comments>
		<pubDate>Thu, 06 Oct 2011 08:00:14 +0000</pubDate>
		<dc:creator>skotperez</dc:creator>
				<category><![CDATA[Desarrollo web]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[get_bloginfo]]></category>
		<category><![CDATA[head]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[wp_head]]></category>

		<guid isPermaLink="false">http://voragine.net/?p=747</guid>
		<description><![CDATA[Con la aparición de la nueva versión de HTML, HTML5, se impone actualizar el código de muchas páginas o programar las nuevas <strong><a title="Construyendo una cabecera mínima pero correcta en HTML5: diferencias entre HTML4.01 y HTML5 dentro de la etiqueta head -- voragine.net" href="http://voragine.net/weblogs/construyendo-una-cabecera-minima-pero-correcta-en-html5-diferencias-entre-html4-01-y-html5-dentro-de-la-etiqueta-head">teniendo en cuenta las nuevas etiquetas y atributos</a></strong>. En el caso de que estemos trabajando dentro del sistema <strong>WordPress</strong> además debemos integrar los comandos propios de este gestor de contenidos.]]></description>
			<content:encoded><![CDATA[<p>Con la aparición de la nueva versión de HTML, HTML5, se impone actualizar el código de muchas páginas o programar las nuevas <strong><a title="Construyendo una cabecera mínima pero correcta en HTML5: diferencias entre HTML4.01 y HTML5 dentro de la etiqueta head -- voragine.net" href="http://voragine.net/weblogs/construyendo-una-cabecera-minima-pero-correcta-en-html5-diferencias-entre-html4-01-y-html5-dentro-de-la-etiqueta-head">teniendo en cuenta las nuevas etiquetas y atributos</a></strong>. En el caso de que estemos trabajando dentro del sistema <strong>WordPress</strong> además debemos integrar los comandos propios de este gestor de contenidos.</p>
<p>A continuación una cabecera mínima para WordPress que integra HTML5, comentada:</p>
<pre class="brush: php; title: ; notranslate">
&lt;!DOCTYPE html&gt;

&lt;?php // discriminamos según el navegador para hacer funcionar HTML5 en todos ?&gt;
&lt;!--[if IE 6]&gt;
&lt;html id=&quot;ie6&quot; &lt;?php language_attributes(); ?&gt;&gt;
&lt;![endif]--&gt;
&lt;!--[if IE 7]&gt;
&lt;html id=&quot;ie7&quot; &lt;?php language_attributes(); ?&gt;&gt;
&lt;![endif]--&gt;
&lt;!--[if IE 8]&gt;
&lt;html id=&quot;ie8&quot; &lt;?php language_attributes(); ?&gt;&gt;
&lt;![endif]--&gt;
&lt;!--[if !(IE 6) | !(IE 7) | !(IE <img src='http://voragine.net/wp-includes/images/smilies/icon_cool.gif' alt='8)' class='wp-smiley' />  ]&gt;&lt;!--&gt;
&lt;html &lt;?php language_attributes(); ?&gt;&gt;
&lt;!--&lt;![endif]--&gt;

&lt;head&gt;
&lt;meta charset=&quot;&lt;?php bloginfo( 'charset' ); ?&gt;&quot; /&gt;

&lt;?php // almacenamos la información que vayamos a usar varias veces para no hacer varias consultas iguales a base de datos
$blogname = get_bloginfo('name');
$blogdesc = get_bloginfo('description');
$blogurl = get_bloginfo('url');
$blogtemplate = get_bloginfo('template_directory');
?&gt;

&lt;title&gt;
&lt;?php // el siguiente código devuelve el título de la página en función del contenido que se esté mostrando: home, archivos, single...
// hack del tema twentyeleven
        global $page, $paged;

        wp_title( '|', true, 'right' );

        // Add the blog name.
        bloginfo( 'name' );

        // Add the blog description for the home/front page.
        $site_description = get_bloginfo( 'description', 'display' );
        if ( $site_description &amp;&amp; ( is_home() || is_front_page() ) )
                echo &quot; | $site_description&quot;;

        // Add a page number if necessary:
        if ( $paged &gt;= 2 || $page &gt;= 2 )
                echo ' | ' . sprintf( __( 'Page %s', 'twentyeleven' ), max( $paged, $page ) );

        ?&gt;
&lt;/title&gt;

&lt;meta content=&quot;Nombre del autor&quot; name=&quot;author&quot; /&gt;
&lt;meta content=&quot;&lt;?php echo $blogdesc ?&gt;&quot; name=&quot;description&quot; /&gt;
&lt;meta content=&quot;etiqueta1, etiqueta2, etiqueta3&quot; name=&quot;keywords&quot; /&gt;

&lt;?php // el relationships meta data profile antes se incluía con un atributo de la etiqueta head que con HTML5 ha desaparecido; ahora hay que incluirlo con una etiqueta link ?&gt;
&lt;link rel=&quot;profile&quot; href=&quot;http://gmpg.org/xfn/11&quot; /&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;&lt;?php bloginfo('stylesheet_url'); ?&gt;&quot; type=&quot;text/css&quot; media=&quot;screen&quot; /&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;&lt;?php echo &quot;$blogtemplate/style.php&quot; ?&gt;&quot; type=&quot;text/css&quot; media=&quot;screen&quot; /&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;&lt;?php echo &quot;$blogtemplate/style-print.css&quot; ?&gt;&quot; type=&quot;text/css&quot; media=&quot;print&quot; /&gt;
&lt;link rel=&quot;alternate&quot; type=&quot;application/rss+xml&quot; title=&quot;&lt;?php echo $blogname; ?&gt; RSS Feed suscription&quot; href=&quot;&lt;?php bloginfo('rss2_url'); ?&gt;&quot; /&gt;
&lt;link rel=&quot;alternate&quot; type=&quot;application/atom+xml&quot; title=&quot;&lt;?php echo $blogname; ?&gt; Atom Feed suscription&quot; href=&quot;&lt;?php bloginfo('atom_url'); ?&gt;&quot; /&gt;
&lt;link rel=&quot;pingback&quot; href=&quot;&lt;?php bloginfo('pingback_url'); ?&gt;&quot; /&gt;

&lt;?php // este hook de WordPress es lo que devuelve las funciones complementarias necesarias para plugins y otros módulos, por ejemplo la hoja de estilos CSS de la barra que aparece cuando se ha iniciado sesión
wp_head(); ?&gt;

&lt;/head&gt;
</pre>
]]></content:encoded>
			<wfw:commentRss>http://voragine.net/weblogs/cabecera-minima-en-html5-para-wordpress/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

