Me encantan estos errores (este es de Illustrator), están super pensados para el usuario…

Voy a darle un buen lavado de cara al blog y a todas las paginas que voy haciendo dentro de vier0n.com . Bajo la supervisión y ayuda de Keko he empezado ha hacer el portfolio, aquí podéis ver como va tirando. Los links del menú aun no están en funcionamiento porque aun no tengo muy clara la navegación entre los trabajos.

Aquí podéis ver un pantallazo de como quedaría el blog después de su reforma:

Lo mas probable es que en los proximos dias si te pasas por aqui  verás el blog hecho un desastre. Espero terminarlo pronto.

Hasta la próxima!

Muchas veces a la hora de hacer búsquedas concretas nos encontramos con resultados antiguos que en ocasiones no es lo que buscamos. Para solucionarlo bastará con añadir lo siguiente al final de la URL de la búsqueda y volver a cargar la página.

&as_qdr=d

Un pequeño menú de lista aparecerá ahora al lado del campo de búsqueda con varias opciones para el filtrado.

Por ejemplo, la URL normal:

http://www.google.es/search?hl=es&q=aceite+de+girasol&btnG=Buscar+con+Google&meta=

la URL con el filtro, quedaría así: http://www.google.es/search?hl=es&q=aceite+de+girasol&btnG=Buscar+con+Google&meta=&as_qdr=d

Y este sería el resultado:

via: lifehacker.

Al entrar en Phatfusion buscando algo nuevo para mootools, me encuentro con una grata sorpresa. Un divertidísimo mashup desarrollado en Flash y bajo la API de Google maps llamado Google Drive, que te permite recorrer las calles de la ciudad que te interese en un cochecito como si de un juego se tratase. No he podido evitar irme a Coruña y darme unas vueltas por mi ciudad. Cuidado que engancha!

Se me ocurren cantidad de aplicaciones, juegos y servicios para hacer con este mashup. Me temo que va a dar bastante juego. Y no quiero pensar en la implementación con Google Street View.

Samuel Birch, el desarrollador del proyecto, comenta en su blog que esta planeando hacer una versión en la que te permita competir en circuitos predeterminados a contrareloj y lo que es mejor, con vista de satélite!

Google Chart Api te permite crear una gran variedad de gráficas de datos de manera dinámica. Esta api nos devuelve una imagen en formato .png , cuya URL puedes incrustar directamente en las etiquetas <img>.

La URL de la imagen debe de tener el siguiente formato:

http://chart.apis.google.com/chart? parametro_1 &  parametro_2 &  parametro_n

Así con todos los parámetros que necesites, siempre separados por &. Recuerda que al poner la URL en la etiqueta <img> de tu HTML debes cambiar el & por &

Los parámetros obligatorios son: el tamaño de la gráfica (chs), el tipo de gráfica (cht), y los datos (chd). El resto de los parámetros son opcionales, puedes verlos todos en la Developer’s Guide.

¿Como especificamos cada parámetro?

El tamaño de la gráfica (chs) : chs=(ancho)x(alto) donde chs indica el tipo de información que mandamos en este caso tamaño (chart size) y las unidades en pixeles. Ejemplo: chs=300×200.

El área de la imagen debe ser menor a 300,000 pixeles. Esto es, la multiplicación del ancho por el alto no debe superar esta cifra. Las gráficas circulares son recortadas si son muy pequeñas, para solucionarlo debes de poner una anchura equivalente a dos veces su altura para las gráficas en 2D, y 2 veces y medio para las de 3D.

Para los mapas el tamaño máximo 440px de ancho y 220px de alto.

El tipo de gráfica(chd): cada estilo de gráfica tiene un parámetro para referirse a ella, la gráfica de arriba es la p3 y las de abajo la bhs y lxy respectivamente. Puedes ver todos los tipos aquí.

Los datos de la gráfica(chd): deben de ser codificados de tal forma que la API de Google los entienda. Se puede hacer de varias maneras pero me voy a centrar en la mas sencilla, codificación de texto:

Solo nos permite utilizar números positivos de punto flotante de cero a cien. Dependiendo del tipo de gráfico que elijas debes pasarle los datos de una manera o de otra pero la estructura general es algo así: chd=t: 10.0,58.0,95.0 | 30.0,8.0,63.0 | ... |... donde:

chd = indica el tipo de información que mandamos, en este caso mandamos los datos para la representación de la gráfica por tanto es chd (chart data).

t = indica el tipo de codificación, en este caso codificación de texto.

10.0,58.0,95.0 = los datos de la gráfica separados por comas.

|= para separar conjuntos de datos. Si solo tienes que utilizar un conjunto de datos no lo tienes que utilizar.

Unos ejemplos para que te queda claro serían:

Para las gráficas donde debes especificar la coordenada en un ÚNICO eje, tanto X como Y, sería asi:

chd=t: x1,x2,x3,x4

http://chart.apis.google.com/chart?chs=200×100&cht=bhs&chd=t:20,25,40,60

En este caso le decimos que el tamaño sea de 200×100 pixeles, el tipo de gráfica bhs, y los datos de la gráfica para el eje X.

Para las gráficas donde debes especificar la posición en ambas coordenadas, sería así:

chd=t: x1,x2,x3,x4 | y1,y2,y3,y4

Si quisieramos especificar mas de un conjunto de datos sería chd=t: x1,x2,x3,x4 | y1,y2,y3,y4 | xa1, xa2, xa3, xa4 |ya1, ya2, ya3, ya4 y así sucesivamente si necesitásemos mas.

http://chart.apis.google.com/chart?&chs=200×100&cht=lxy&chd=t:0,30,60,100|60,20,40,30|10,60,100|30,60,10|13,23,45,100|90,66,22,45

En este caso le decimos que el tamaño sea de 200×100 pixeles otra vez, el tipo de gráfica lxy, y los 3 conjuntos de datos para los ejes X e Y.

Para opciones y personalización mas avanzadas; colores, rangos, etiquetas de texto, degradados, leyenda, cuadriculas, etc. tienes toda la información en la Developer’s Guide.

Espero que haya servido de algo.

Acabo de actualizar ahora mismo a la tan esperada versión 2.5 de Wordpress. De momento no me ha dado ningún problema y los plugins me los ha cogido perfectamente.

Para actualizar debes seguir los siguientes pasos:

• Hacer una copia de la base de datos.
• Hacer una copia de la carpeta donde tienes instalado el wordpress en tu servidor.
• Desactiva todos los plugins que tengas instalados.
• Borra todos los archivos de tu actual wordpress menos wp-config.php y las carpetas wp-content, wp-includes/languages/ y wp-images (o la carpeta que tu has especificado para las imágenes). Si tienes el .htaccess o el robots.txt en la carpeta del wordpress tampoco los debes borrar.
• Descarga wordpress 2.5. de su web y sube los archivos al servidor.
• Una vez subidos entra en www.tublog.com/wp-admin y sigue los pasos.
• !Conseguido¡ Ya puedes entrar en el dashboard , activar los plugins y disfrutar de todas las mejoras de wordpress 2.5

Si quieres traducirlo al castellano te puedes bajar el archivo de idiomas desde aqui. Solo tienes que subir el archivo a la carpeta wp-includes/languages.

En unos días, si el tiempo me lo permite espero publicar una entrada sobre los cambios de esta nueva versión.

Como sabemos IE no es de lo mejorcito a la hora de traducir las hojas de estilo, por lo que a veces nos vemos obligados a realizar pequeñas chapuzas para que nuestra pagina se vea correctamente en el Explorer. Para ello utilizamos los comentarios condicionales para IE

Estos comentarios son solo para Internet Explorer, no sirven para ningún otro navegador. Todo lo que encierren dentro se ejecutará unicamente en IE. Hay diferentes opciones:

Para todas las versiones de IE

<!–[if IE]>> Código CSS <![endif]–>

El código anterior afecta a todas las versiones de Internet Explorer, en cambio con el siguiente podemos especificar la version (5.01, 5.5, 6.0…)

<!–[if lte IE 6]> Código CSS<![endif]–>

En los anteriores ejemplos el código CSS va entre los comentarios, pero es recomendable para una mayor organizacioón llamar a una hoja de estilos externo que solo contendría el codigo CSS necesario para cargar correctamente la web en el Explorer tambien podemos llamar a una hoja de estilos externa. Para ello sustituiriamos “Código CSS” por <link rel="stylesheet" type="text/css" href="URL_del_archivo.css" />.

Aqui un resumen de todas las posibilidades que tenemos con los condicionales, donde la palabra versión debe ser sustituida por el número de versión de IE sobre el que quieres trabajar:

IE (Cualquier versión de IE)
lt IE version (Versiones inferiores a la versión especificada)
lte IE version(Versiones inferiores o iguales que la versión especificada )
IE version (Solo la versión especificada)
gte IE version (Versiones superiores o igual que la versión especificada)
gt IE version (Versión superiores a la versión especificada)

Los comentarios condicionales no funcionan en la versión de IE para Mac y si tienes instaladas varias versiones de Internet Explorer en tu equipo, no funcionarán ya que la versión que se toma es la que esta registrada en el sistema. Para solucionar este problema podemos descargarnos IETester en versión alpha, un navegador que nos permite trabajar sobre los motores de las versiones 8 beta 1, 7, 6 y 5.5 de IE en una sola aplicación.

Al estar en versión alpha puedes encontrarte con algunos errores, los conocidos son:

Cuando redimensionas la ventana el contenido puede desaparecer.
El focus y los botones de Atrás y Siguiente no funcionan correctamente.

Si quieres ayudar a acabar con este problema no te pierdas esta entrada sobre la iniciativa Save the Developers en el blog de keko.

Con la API Google AJAX Feed, podemos descargar cualquier feed público en RSS o Atom usando solo Javascript. Antes de empezar necesitas generar la key para usar la API, para ello solo tienes que facilitar la URL del site donde la vas a utilizar.

Una vez que tenemos la key ya podemos empezar a usar la API. Tienes muchas opciones para usarla, las puedes ver todas en la documentación, pero yo me centraré en lo que ellos llaman The FeedControl. Mas adelante en otro post hablaré sobre Discovering Feeds.

The FeedControl funciona usando la clase google.feeds.FeedControl de Google, puedes mandarle una lista de feeds y te devolverá sus últimas entradas. Vamos a ver el código que necesitamos:

El código que se muestra a continuación debe de ir dentro del <HEAD>

<script  type="text/javascript" src="http://www.google.com/jsapi?key="AQUI-DEBES-DE-PONER-TU-KEY"></script>

<script type="text/javascript">

google.load("feeds", "1");

function initialize() {

var feedControl = new google.feeds.FeedControl();

feedControl.addFeed("http://www.vier0n.com/blog/feed/", "vier0n blog");

feedControl.addFeed("http://www.kekoponte.com/?feed=rss2", "Khaducsti");

feedControl.draw(document.getElementById("feedControl"));

}

google.setOnLoadCallback(initialize);

</script>

Donde dice AQUI-DEBES-DE-PONER-TU-KEY , como es obvío debes de poner la key que acabas de generar.

Para indicarle los feeds que quieres descargar a la API, debes de modificar la siguiente linea.

feedControl.addFeed(”http://www.vier0n.com/blog/feed/”, “vier0n blog”);

Las primeras comillas encierran la URL del feed y las segundas el título que quieres que se muestre para dicho feed. En el código anterior aparece dos veces esta línea pero la puedes duplicar tantas veces como quieras para múltiples feeds.

El código que se muestra a continuación debe de ir dentro del <BODY>

<div id=”feedControl”>Cargando feeds…</div>

El código que genera esta API es totalmente personalizable con CSS. Puedes verla funcionando en vier0n Shares, en la columna central de la web.

Enlace: Google AJAX Feed API

WebAppers es una web que nacio con la idea de ahorrarnos el trabajo a la hora de desarrollar nuestro proyecto web. Día a día actualizan con recursos de codigo abierto que circulan por la web listos para ser usados por cualquier desarollador web que los necesite. Estan divididos en componentes, diseño, extras y licencias. Puedes encontrar desde calendarios, formularios, galerias y sistemas de votación hasta iconos, botones, motivos…

Vía: woork
Enlace: WebAppers