Planeta WordPress

A todos nos gusta tener un sitio con un aspecto diferenciador pero son muchas las ocasiones en que puede ser interesante disponer de un diseño que imite a webs famosas. Imagina, por ejemplo, un blog de fans de Facebook, o un portal sobre mundo Apple ¿no te gustaría ofrecer un aspecto similar al servicio o web al que haces homenaje?.

Pues bien, aquí tienes un repaso por algunos temas que imitan webs bien conocidas. Seguro que alguno ya lo conocías, pero puede que alguno te sorprenda.

WPSN Theme – clon de ESPN

Información del tema Demo Ver sitio original

The New Yorker Theme – clon de NYTimes.com

Información del tema Demo Ver sitio original

One News Theme – clon de popurls.com

Información del tema Demo Ver sitio original

Facebook theme Theme – clon de Facebook

Información del tema Demo Ver sitio original

Cry Book Theme – clon de Facebook

Información del tema Demo Ver sitio original

iBlog Theme – clon de Apple.com

Información del tema Demo Ver sitio original

Coda Blue Theme – clon de Panic Coda

Información del tema Demo Ver sitio original

The Beeb Theme – clon de BBC News

Información del tema Demo Ver sitio original

tumblelog Theme – clon de tumblr.com

Información del tema Demo Ver sitio original

Digg-like Theme – clon de Digg

Informacion del tema Demo Ver sitio original

WP Max Theme – clon de Digg

Información del tema Demo Ver sitio original

Fresh Tweet Theme – clon de Twitter

Información del tema Demo Ver sitio original Otra buena opción es Tweet Molón

Sharp Theme – clon de Creattica Daily

Información del tema Demo Ver sitio original

Shade Pro Theme – clon de WordPress.org

Información del tema Demo Ver sitio original

Gmail Theme – clon de GMail

Información del tema Demo Ver sitio original

Seguro que hay muchos más, pero esta es una buena muestra de como se pueden imitar sitios famosos, en muchos casos con temas gratuitos.

Ahora bien, otra cosa es la originalidad, esa es otra discusión.

Si no tenemos un número excesivo de etiquetas y las quisiéramos desplegar en una lista, aquí tenemos el código para realizarlo.

Primero, iremos a functions.php o lo crearemos como simple archivo de texto y pegaremos en su interior el siguiente código:

<?php
function dropdown_tag_cloud( $args = '' ) {
$defaults = array(
'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,
'format' => 'flat', 'orderby' => 'name', 'order' => 'ASC',
'exclude' => '', 'include' => ''
);
$args = wp_parse_args( $args, $defaults );

$tags = get_tags( array_merge($args, array('orderby' => 'count', 'order' => 'DESC')) ); // Always query top tags

if ( empty($tags) )
return;

$return = dropdown_generate_tag_cloud( $tags, $args ); // Here's where those top tags get sorted according to $args
if ( is_wp_error( $return ) )
return false;
else
echo apply_filters( 'dropdown_tag_cloud', $return, $args );
}

function dropdown_generate_tag_cloud( $tags, $args = '' ) {
global $wp_rewrite;
$defaults = array(
'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,
'format' => 'flat', 'orderby' => 'name', 'order' => 'ASC'
);
$args = wp_parse_args( $args, $defaults );
extract($args);

if ( !$tags )
return;
$counts = $tag_links = array();
foreach ( (array) $tags as $tag ) {
$counts[$tag->name] = $tag->count;
$tag_links[$tag->name] = get_tag_link( $tag->term_id );
if ( is_wp_error( $tag_links[$tag->name] ) )
return $tag_links[$tag->name];
$tag_ids[$tag->name] = $tag->term_id;
}

$min_count = min($counts);
$spread = max($counts) - $min_count;
if ( $spread <= 0 )
$spread = 1;
$font_spread = $largest - $smallest;
if ( $font_spread <= 0 )
$font_spread = 1;
$font_step = $font_spread / $spread;

// SQL cannot save you; this is a second (potentially different) sort on a subset of data.
if ( 'name' == $orderby )
uksort($counts, 'strnatcasecmp');
else
asort($counts);

if ( 'DESC' == $order )
$counts = array_reverse( $counts, true );

$a = array();

$rel = ( is_object($wp_rewrite) && $wp_rewrite->using_permalinks() ) ? ' rel="tag"' : '';

foreach ( $counts as $tag => $count ) {
$tag_id = $tag_ids[$tag];
$tag_link = clean_url($tag_links[$tag]);
$tag = str_replace(' ', '&nbsp;', wp_specialchars( $tag ));
$a[] = "\t<option value='$tag_link'>$tag ($count)</option>";
}

switch ( $format ) :
case 'array' :
$return =& $a;
break;
case 'list' :
$return = "<ul class='wp-tag-cloud'>\n\t<li>";
$return .= join("</li>\n\t<li>", $a);
$return .= "</li>\n</ul>\n";
break;
default :
$return = join("\n", $a);
break;
endswitch;

return apply_filters( 'dropdown_generate_tag_cloud', $return, $tags, $args );
}
?>

Acto seguido, iremos al template en el que nos interese insertar la lista desplegable y, orientándonos entre el HTML, pegaremos el siguiente código:

<select name="tag-dropdown" onchange="document.location.href=this.options[this.selectedIndex].value;">
<option value="#">Tags</option>
<?php dropdown_tag_cloud('number=0&order=asc'); ?>
</select>

Nuestros tags seran ahora mostradis en un desplegable.

Al fin, con WordPress 2.9 se nos ha hecho mucho más fácil indicar, mientras escribimos, cuál será la miniatura (o thumbnail) que representará al artículo en cuestión.

Para ello, colaremos este código en functions.php (al final de todo):

<?php
add_theme_support( 'post-thumbnails' );
?>

Ahora podremos, desde la Administración, subir y asignar una imagen cuya función exclusiva será la de ‘representar’ al post, e “imprimirse” por tanto en nuestros templates, al lado del texto del artículo (pero independientemente de éste).

Iremos ahora a escoger en qué lugar concreto queremos que aparezca con respecto al contenido normal de nuestro artículo. Abriremos index.php, archive.php o incluso single.php, y allí donde creamos conveniente (normalmente al lado del extracto), pondremos lo siguiente :

<?php the_post_thumbnail( 'medium' ); ?>

Podremos utilizar la siguiente “jerga” para decidir qué tamaño queremos:

- thumbnail
- medium
- large

Habrá que orientarse entre los tags de HTML del template para poner la imagen allí donde creamos correcto.

Para saber más detalles acerca de esta novedad, podemos dirigirnos a la web de Justin Tadlock.

Son muchas veces las que hablamos del “loop“, ese bloque misterioso en todo tema para WordPress que se encarga de mostrar la información creada por nosotros en nuestro sitio.

Además, son múltiples las modificaciones y personalizaciones que podemos aplicar modificando el “loop”, pero hay una pega, y es que hay que modificar los archivos del tema.

Pues bien, si quieres personalizar tu tema y no te atreves a tocar ficheros PHP ahora tienes una posibilidad de hacerlo sin salir del Escritorio de WordPress, y todo mediante “shortcodes”.

El plugin WordPress Loop usa la clase WP_Query para generar el widget “loop”. puedes ver la lista completa de argumentos posibles ($args) en la página del Codex de query_posts(). El widget de WordPress Loop tambien aprovecha los filtros y hooks de acciones para personalizaciones avanzadas.

El widget tiene más de 35 opciones entre las que elegir. Puedes personalizar tu loop de WordPress en uno o más tipos de entrada, categorías, etiqeutas, taxonomías personalizadas, autores, fechas, campos personlizados y mucho más.

Además, tiene soporte para miniaturas de entrada, entradas fijas, paginación, longitud de contenido personalizable (por número de palabras), y puedes cambiar incluso el orden de cantidad de opciones.

En la FAQ del plugin tienes la lista completa de shortcodes, filtros y hooks aplicables. Es completísimo.

Contenido exclusivo para suscriptores al Feed

¡Gracias por seguirnos a diario!. Premiamos tu fidelidad ofreciéndote habitualmente contenidos exclusivos. Hoy puedes descargar:

Guía Domina tu Blog

En nuestras pequeñas píldoras de Programación les explicaré algunos conceptos básicos. Si alguna vez se han preguntado qué hay detrás de WordPress o cualquier otra aplicación, no se pierdan esta serie de posts con la categoría Programacion.

Éste es uno de los ejercicios básicos de programación de ordenadores y sirve para entender el concepto de variable. Una variable es la estructura más sencilla que nos podemos encontrar para almacenar datos. Con un poco de imaginación, una variable es una caja en la que podemos guardar números, textos o cualquier otra cosa; es decir, valores. El valor de una variable se puede manipular, simplemente con la operación de asignación. Esa es de las primeras instrucciones que se enseñan en programación y suele escribirse utilizando el signo ‘=’, aunque sería más intuitivo el símbolo ‘<-’. La instrucción ‘A=5′ asignaría el valor ‘5′ a la variable que se denomina ‘A’.

Nos detenemos un momento en la primera figura, donde vemos dos cajas (dos variables) recibiendo cada una un valor numérico. La caja de nombre ‘A’ recibe el valor ‘5′ y la caja de nombre ‘B’, el valor ‘2′. Eso se puede hacer con las instrucciones: ‘A=5′ y ‘B=2′. Las variables funcionan de la siguiente forma: si después de asignar un valor concreto a una variable le damos otro diferente, el primero se pierde y el que permanece es el último asignado.

El problema consiste en intercambiar los valores de ambas variables. Que B tenga el valor de A y ésta el de B, cualesquiera que sean dichos valores.

Lo más lógico sería pensar en escribir las dos intrucciones siguientes: “A=B’ y ‘B=A’. Siempre con la idea de que lo que queremos hacer es: ‘A<-B’ y ‘B<-A’. Pero con eso solo lograríamos que A y B tuvieran el valor ‘2′. Entender eso es la primera parte del ejercicio. Con ‘A=B’ se consigue que A valga 2, ya que B valía 2. Y, a continuación, si A vale ahora 2, con ‘B=A’ terminamos asignando 2 a B, con lo que A y B tendrán el mismo valor que tenía B al principio.

La forma de resolver el problema es utilizar una tercera variable auxiliar. En primer lugar, guardamos en C (la variable auxiliar) el valor de A. Después, introducimos en A el valor de B. Ahora no importa que hayamos perdido el valor de A porque lo habíamos guardado en C. Y por último, almacenamos en B el valor de C.

En PHP podemos escribirlo así (en php las variables se identifican poniéndoles delante el símbolo ‘$’, para escribir el código HTML se utiliza la instrucción ‘echo’ y todas las sentencias terminan en ‘;’):

<?php
$A=5;
$B=2;
echo “variables antes del intercambio:<br />”;
echo “A= “.$A.”<br />”;
echo “B= “.$B.”<br />”;
$C=$A;
$A=$B;
$B=$C;
echo “variables después del intercambio:<br />”;
echo “A= “.$A.”<br />”;
echo “B= “.$B.”<br />”;
?>