|
Enlaces Útiles
|
|
Navegación
|
|
 |
|
21-ene-2009, 06:28
|
 |
Senior Member
|
|
Registrado: agosto-2008
Posts: 270
|
|
10 buenos hacks para WordPress
Antes de empezar, aclaro que estos hacks, trucos, o como quieras llamarlos, fueron publicados en Smashing Magazine; yo solamente los he traducido para que pueda llegar a más gente, sin que el idioma actúe como una barrera. Espero que os sea de provecho.
__________________________________________________ ________________
1. Muestra los anuncios de Google sólo a los visitantes que vengan del buscador.
El problema. Es sabido por todos que los visitantes regulares de nuestro blog no clican, normalmente, en los anuncios. Aquellos que lo hacen son, el 90% de las veces, visitantes que han llegado a nuestro blog por medio de los buscadores.
Otro problema es el “smart pricing” de Google. ¿Cómo explicar en qué consiste el “smart pricing”? Fácil, si tu promedio de clics (CTR) por visitante es bajo, el dinero que ganas se divide entre desde 2 a 10; es decir, si los clics que tienes en tus anuncios en base a los lectores que lo ven son pocos, Google aplicará el “smart pricing”.
Por ejemplo, si un clic, normalmente, te haría ganar $1.00, con el “smart pricing” podrías ganar sólo $0.10. Doloroso, ¿verdad?. Por suerte, esto tiene solución si sólo muestras los anuncios de Google a los visitantes que llegan desde el buscador, ya que esto se traduciría en más clics y un CTR más alto.
La solución.
1. Abre el archivo functions.php en tu plantilla.
2. Pega el siguiente código en él:
Citar:
function scratch99_fromasearchengine(){
$ref = $_SERVER['HTTP_REFERER'];
$SE = array('/search?', 'images.google.', 'web.info.com', 'search.', 'del.icio.us/search', 'soso.com', '/search/', '.yahoo.');
foreach ($SE as $source) {
if (strpos($ref,$source)!==false) return true;
}
return false;
}
|
3. Hecho esto, pega el siguiente código en el lugar de tu plantilla donde quieras que aparezca tu AdSense. Este se mostrará sólo a los visitantes que lleguen a tu página a través de los buscadores.
Citar:
if (function_exists('scratch99_fromasearchengine')) {
if (scratch99_fromasearchengine()) {
INSERTA AQUÍ TU CÓDIGO ADSENSE
}
}
|
Explicación del código. Este truco empieza con la creación de una función llamada scratch99_fromasearchengine(). Esta función contiene una variable, $SE, en la que podrás especificar los buscadores que quieras. De esta forma podrás añadir fácilmente nuevos buscadores añadiéndolos a esta variable.
Lo que hará la función scratch99_fromasearchengine() es comprobar si el buscador del que llega el visitante está incluido o no en la variable $SE permitiéndole así ver, o no, tus anuncios de AdSense.
2. Evita la duplicación de post en múltiples bucles
El problema. Debido a la reciente popularidad de las plantillas “estilo revista”, hay una gran demanda de usuarios de Wordpress que usan más de un bucle (o loop; que es el proceso que se encarga de mostrar los posts por pantalla) en la página de inicio de su blog como solución para evitar la duplicación de los posts en el segundo bucle.
La solución. La solución a este problema es simple; usaremos las ventajas que nos brinda el PHP.
1.Empieza por crear un archivo PHP y pon en él todas las IDs del primer bucle.
Citar:
<h2>Loop n°1</h2><?php$ids = array();while (have_posts()) : the_post();the_title();?><br /><?php $ids[]= $post->ID;endwhile; ?>
|
2.Ahora vamos con el segundo bucle: utilizamos la función PHP in_array () para comprobar si la ID de un post está contenida en la matriz $ids. Si la ID no está en esta función, podemos visualizar el post ya que este no se visualizaba en el primer bucle.
Citar:
<h2>Loop n°2</h2><?phpquery_posts("showposts=50");while (have_posts()) : the_post();if (!in_array($post->ID, $ids)) { the_title();?> <br /><?php }endwhile; ?>
|
Explicación del código. Cuando se está ejecutando el primer bucle, todas las IDs de los posts contenidos en él se ponen en una determinada variable. Cuando se ejecuta el segundo bucle, comprobamos que la ID de cada post no se encuentre ya expuesta en el primer bucle remitida por la matriz.
3.Sustituye “Siguiente” y “Anterior” por una Paginación
El problema. Por defecto, WordPress ha funcionado con los links de anterior y siguiente página. Claro está que esto es mejor que nada, pero no entiendo por qué la gente de WordPress no pone un paginador por defecto. Ya se que existen plug-ins que te permiten insertar una paginación en tu blog pero, ¿cómo insertarla directamente en tu plantilla?
La solución. Para conseguir este truco, utilizaremos el plug-in de Wordpress PageNavi y insértalo directamente en tu plantilla.
1. Lo primero que tienes que hacer es, obviamente, descargar el plug-in.
2. Descomprime el plug-in y sube el wp-pagenavi.php y el wp-pagenavi.css al directorio de tu plantilla.
3. Abre el archivo en el que quieras poner la paginación (por ejemplo: index.php, categories.php, search.php, etc.) y busca el siguiente código:
Citar:
<div class="navigation"><div class="alignleft"><?php next_posts_link('Previous entries') ?></div><div class="alignright"><?php previous_posts_link('Next entries') ?></div></div>
|
4. Reemplaza este código por el siguiente:
Citar:
<?phpinclude('wp-pagenavi.php');if(function_exists('wp_pagenavi')) { wp_pagenavi(); }?>
|
5.Ahora tenemos que modificar un poco el archivo del plug-in. Para ello, abre el archivo wp-pagenavi.php y encuentra la siguiente línea (línea #61):
Citar:
function wp_pagenavi($before = '', $after = '') { global $wpdb, $wp_query;
|
Tenemos que llamar la función pagenavi_init(); allá vamos:
Citar:
function wp_pagenavi($before = '', $after = '') { global $wpdb, $wp_query; pagenavi_init(); //Calling the pagenavi_init() function
|
6.Ya casi lo tenemos. Lo último que nos queda por hacer es añadir la hoja de estilos de wp-pagenavia nuestro blog. Para hacerlo, abre el header.php y añade la siguiente línea:
Citar:
<link rel="stylesheet" href="<?php echo TEMPLATEPATH.'/pagenavi.css';?>" type="text/css" media="screen" />
|
Explicación del código. Este truco consiste básicamente en añadir el plug-in directamente en los archivos de la plantilla. Tenemos que añadir también una llamada a la función pagenavi_init() para asegurarnos de que la paginación aparecerá correctamente.
|
21-ene-2009, 06:37
|
|
Senior Member
|
|
Registrado: agosto-2008
Posts: 270
|
|
4. Incluir imágenes en el contenido del post
El problema. Usar los campos personalizados para mostrar las imágenes vinculadas a tus posts es una gran idea, pero a muchos usuarios de WordPress les gustaría dar con una solución para conseguir incrustar las imágenes en el mismo contenido del post.
La solución. Hasta donde yo se, no hay ningún plug-in para conseguir esto. Por suerte, el siguiente bucle nos lo solucionará: buscará imágenes en el contenido de los posts y los mostrará en pantalla.
1.Pega el siguiente código en cualquier lugar de tu theme:
Citar:
<?php if (have_posts()) : ?><?php while (have_posts()) : the_post(); ?><?php$szPostContent = $post->post_content;$szSearchPattern = '~<img [^\>]*\ />~';// Run preg_match_all to grab all the images and save the results in $aPicspreg_match_all( $szSearchPattern, $szPostContent, $aPics );// Check to see if we have at least 1 image$iNumberOfPics = count($aPics[0]);if ( $iNumberOfPics > 0 ) { // Now here you would do whatever you need to do with the images // For this example the images are just displayed for ( $i=0; $i < $iNumberOfPics ; $i++ ) { echo $aPics[0][$i]; };};endwhile;endif;?>
|
Explicación del código. El código que acabas de utilizar consiste, básicamente, simplemente, en un bucle básico de WordPress. La única diferencia es que hemos utilizado PHP y expresiones normales para buscar imágenes dentro del contenido de los posts en lugar de mostrar los posts únicamente. De esta manera, si las imágenes se encuentran, se mostrarán.
5.Crea un botón de “Enviar a Twitter”
El problema. ¿Estás en Twitter? Si lo estás, ya sabrás lo bueno que es este servicio para compartir online con tus amigos todo lo que encuentres interesante. Así que, ¿por qué no darle a tus lectores la oportunidad de enviar directamente el link de tus posts a Twitter, trayéndote así más visitantes?
La solución. Este truco es muy fácil de conseguir. Lo único que tienes que hacer es crear un link a Twitter con el parámetro de status. Como estamos en un blog de WordPress, utilizaremos la función the_permalink() para obtener la URL:
Citar:
<a href="http://twitter.com/home?status=Currently reading <?php the_permalink();
|
Como ves, es muy fácil, pero al mismo tiempo muy útil.
6. Usar comillas normales en lugar de las comillas inglesas
El problema. Si eres un desarrollador que suele publicar pedazos de códigos en tu sitio web, probablemente te habrás encontrado con el siguiente problema: un usuario te dice que tu el código que has posteado no funciona. ¿Por qué? Simplemente porque, por defecto, WordPress transforma las comillas normales en las comillas inglesas, aquellas que se conocen como “smart quotes”, con las que no funcionan los códigos.
La solución. Para deshacerte de este tipo de comillas, haz lo siguiente:
1.Abre el archivo functions.php de tu plantilla. Si este archivo no existe, créalo.
2.Pega en él el siguiente código:
Citar:
|
<?php remove_filter('the_content', 'wptexturize'); ?>
|
3.Guarda el archivo y adiós al problema.
Explicación del código. La función wptexturize ()convierte automáticamente las comillas normales en comillas inglesas. Utilizando la función remove_filter() le estamos diciendo a WordPress que no queremos que esta función se aplique al contenido de nuestros posts.
7. No permitir las peticiones de comentarios sin referencia.
El problema. El spam es un problema para todos los bloggers. Está claro que Akismet ayuda, pero ¿qué hay de malo en prevenir más, si cabe, el spam? El siguiente código buscará la referencia (la URL desde donde se ha llamado a la página) cuando se esté accediendo al archivo wp-comments-posts.php. Si la referencia existe, o si es la URL de tu blog, se permitirá el comentario. Por el contrario, si la referencia no existe, la página dejará de cargarse y el comentario no se posteará.
La solución. Para aplicar este truco, simplemente pega el siguiente código en el archivo function.php de tu plantilla. Si la plantilla no incluye este archivo, créalo.
Citar:
|
function check_referrer() { if (!isset($_SERVER['HTTP_REFERER']) || $_SERVER['HTTP_REFERER'] == “”) { wp_die( __('Please enable referrers in your browser, or, if you\'re a spammer, bugger off!') );}}add_action('check_comment_flood', 'check_referrer');
|
8. Utilizar CSS Sliding Doors en la navegación de WordPress
Antes de empezar, aclaro que no he traducido el término “ Sliding Doors” porque no se cómo traducirlo literlamente (?). De todas formas, es fácil de explicar: un sliding door es un determinado efecto (modificable con el CSS) que tiene lugar al pasar el puntero por una determinada zona (normalmente, un menú de navegación. Desde aquí puedes ver un ejemplo, en el menú de navegación.
El problema. Las funciones wp_list_pages() y wp_list_categories() permiten un gran número de cosas, pero no permiten integrar un elemento <span> para que puedas utilizar la conocida técnica del CSS Sliding-Doors. Por suerte, con algo de PHP y algunas expresiones, podemos utilizar esta fantástica técnica en nuestro blog de WordPress.
Debido al gran número de tutoriales acerca de los CSS Sliding Doors, no explicaremos aquí como funciona; de todas formas, en este excelente artículo puedes leer más sobre esta técnica.
La solución. Crea las imágenes que necesites y, una vez hecho esto, edita el archivo style.css de tu plantilla de WordPress. Aquí tienes un ejemplo:
Citar:
|
#nav a, #nav a:visited { display:block;}#nav a:hover, #nav a:active { background:url(images/tab-right.jpg) no-repeat 100% 1px; float:left;}#nav a span { float:left; display:block;}#nav a:hover span { float:left; display:block; background: url(images/tab-left.jpg) no-repeat 0 1px;}
|
2.Ahora editaremos el header.php. Simplemente copia y pega uno de los siguientes códigos, de acuerdo con tus necesidades.
- Para tus páginas:
Citar:
|
<ul id="nav"><li><a href="<?php echo get_option('home'); ?>/"><span>Home</span></a></li><?php echo preg_replace('@\<li([^>]*)>\<a([^>]*)>(.*?)\<\/a>@i', '<li$1><a$2><span>$3</span></a>', wp_list_pages('echo=0&orderby=name&exlude=181&titl e_li=&depth=1')); ?></ul>
|
- Para tus categorías:
Citar:
|
<ul id="nav"><li><a href="<?php echo get_option('home'); ?>/"><span>Home</span></a></li><?php echo preg_replace('@\<li([^>]*)>\<a([^>]*)>(.*?)\<\/a>@i', '<li$1><a$2><span>$3</span></a>', wp_list_categories('echo=0&orderby=name&exlude=181 &title_li=&depth=1')); ?></ul>
|
Explicación del código. En este ejemplo, hemos hecho uso del parámetro echo=0 en las funciones wp_list_pages() y wp_list_categories(), que nos permite obtener el resultado de la función sin ponerlo directamente en pantalla. Entonces, el resultado de esta función es utilizado por la función PHP preg_replace() y finalmente se muestra con los tags <span> añadidos entre los tags <li> y <a>.
|
21-ene-2009, 06:37
|
|
Senior Member
|
|
Registrado: agosto-2008
Posts: 270
|
|
9. Muestra un header aleatorio en tu blog
El problema. Realmente no es un problema, sino que a muchos usuarios de WordPress les gustaría mostrar un header aleatorio a sus lectores.
La solución.
1. Primero selecciona las imágenes que quieras mostrar como header (llámalas 1.jpg, 2.jpg, 3.jpg y, así, sucesivamente). Puedes utilizar tantas imágenes como quieras.
2. Sube las imágenes a tu directorio wp-content/themes/yourtheme/images.
3. Abre el archivo header.php y pega el siguiente código en él:
Citar:
$num = rand(1,10); //Escribe un rango de números entre 1 y 10, asumiendo que 10 es el total de imágenes que tienes para utilizar como header
<div id="header" style="background:transparent url(images/.jpg) no-repeat top left;">
|
4. Hecho. Ahora cada página o post de tu blog mostrará un header aleatorio, de todos los que tu has dispuesto.
Explicación del código. Nada complicado. Simplemente hemos empezado una variable $num utilizando la función PHP rand() para obtener un número al azar entre 1 y 10, con el que obtendremos el header que tenga asignado ese número.
10. Haz una lista de tus posts programados
El problema. Como muchos bloggers, lógicamente, querrás que tus visitantes visiten tu blog con más frecuencia o que se suscriban a tu feed RSS. Una buena forma de hacer crecer la curiosidad de tus lectores acerca de tus futuros posts es hacer una lista de los títulos de tus posts programados.
La solución. Abre cualquier archivo de tu plantilla, y copia el siguiente código:
Citar:
|
<?php$my_query = new WP_Query('post_status=future&order=DESC&showposts= 5');if ($my_query->have_posts()) { while ($my_query->have_posts()) : $my_query->the_post(); ?> <li><?php the_title(); ?></li><?php endwhile;}?>
|
Explicación del código.
En este código hemos creado una pregunta personalizada utilizando WP_Query para enviar una base de datos y mostrar los 5 posts programados más recientes. Hecho esto, se utiliza un bucle para que aparezcan los títulos de los posts.
|
21-ene-2009, 08:06
|
 |
Senior Member
|
|
Registrado: agosto-2008
Posts: 1,111
|
|
Perfecto. Muchas gracias.
Estaria muy bien un ejemplo de cada, porque aunque hay algunas muy claras, otras no sé muy bie que son.
|
21-ene-2009, 09:50
|
 |
Senior Member
|
|
Registrado: noviembre-2008
Posts: 202
|
|
Gracias por la traducción, realmente la mayoría son unos buenos consejos/trucos.
|
22-ene-2009, 01:10
|
 |
Senior Member
|
|
Registrado: agosto-2008
Localización: http://www.vidablogger.com.ar
Posts: 1,164
|
|
Muy buenos consejos, gracias!
|
22-ene-2009, 01:45
|
 |
Super Moderator
|
|
Registrado: agosto-2007
Localización: http://twitter.com/KnxDT
Posts: 4,903
|
|
|
22-ene-2009, 10:41
|
|
Senior Member
|
|
Registrado: mayo-2008
Posts: 140
|
|
Estupendo, muchas gracias.
|
22-ene-2009, 10:45
|
 |
Senior Member
|
|
Registrado: mayo-2008
Posts: 1,582
|
|
Muy buen aporte, gracias .gif ")") |
22-ene-2009, 01:10
|
|
Senior Member
|
|
Registrado: agosto-2008
Posts: 270
|
|
Citar:
Originalmente publicado por allvipdomains
Perfecto. Muchas gracias.
Estaria muy bien un ejemplo de cada, porque aunque hay algunas muy claras, otras no sé muy bie que son.
|
Si. No se, di las que no entiendas y a ver si, entre todos, te ayudamos. Yo hay alguna que tampoco tengo muy claro (por eso me costó más traducirla :S), por ejemplo, la segunda: evitar la duplicación de posts en múltiples bucles.
Citar:
Originalmente publicado por chicho
Gracias por la traducción, realmente la mayoría son unos buenos consejos/trucos.
|
Citar:
Originalmente publicado por vicarlone
Muy buenos consejos, gracias!
|
Citar:
Originalmente publicado por siebel
Estupendo, muchas gracias.
|
Citar:
Originalmente publicado por todotuto
Muy buen aporte, gracias |
De nada!
Citar:
Originalmente publicado por KnxDT
|
Gracias por poner el enlace KnxDT. No lo puse porque no tenía claro si estaba permitido poner enlaces. (Aunque, ahora que lo pienso, si no es mi página no se podría considerar spam y, lógicamente, estaría permitido xD). Lo dicho, gracias. |
| Herramientas |
|
|
| Estilo |
 Modo lineal
|
Reglas del foro
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
El código [IMG] está activadoEl código HTML está desactivado
|
|
|
Todas las horas son GMT -3. La hora es 04:03 .
|
