1. Nos dirigimos a la opción Plugins en nuestro panel de control de WordPress.
   
2. Clic en la opción editar del plugin Simple Tags.
    
3. En el recuadro de edición del código del plugin buscamos la siguiente línea:

   if ( strpos($wp_version, '2.7') !== false || strpos($wp_version, '2.8') !== false) {

   La reemplazamos por:

   if ( strpos($wp_version, '2.7') !== false || strpos($wp_version, '2.8') !== false || strpos($wp_version, '2.9') !== false ) {

4. Guardamos y listo, el plugin funcionará perfectamente en la versión 2.9 de WordPress.

Sitio | Simple Tags
Fuente | Foros WordPress

Entradas relacionadas:

• Page Link Manager, administrar lista de páginas de WordPress
• Moderator, modera comentarios de WordPress desde AIR
• WordPress 2.6 mejorará la seguridad
• Windows Vista WordPress Theme
• Web 2.0, lo que hay lo que se viene…

Entradas relacionadas:

• WordPress 2.6 mejorará la seguridad
• Windows Vista WordPress Theme
• Web 2.0, lo que hay lo que se viene…
• SwitchAbit un punto de intercambio
• Solucionar conflicto entre Filezilla y Adobe Air

Una recomendación antes de actualizar es realizar una copia de seguridad de nuestro blog, tanto de la base de datos como de los archivos (plug-ins, imágenes, etc.).

Enlace | WordPress
Descarga | WordPress 2.7 Final

Entradas relacionadas:

• Liberado WordPress 2.6
• Page Link Manager, administrar lista de páginas de WordPress
• Google Chrome deja de ser beta y ahora es estable
• Resultados de el concurso 20 Blogs Peruanos
• Publica en tu blog desde WriteToMyBlog

El botón del menú inicio, realmente funciona:

Al posar el cursor sobre el texto de cualquiera de las opciones del menú inferior se muestra una pequeña ventana con el contenido del botón del menú:

Posibilidad de cambiar la combinación de colores que usa la plantilla, múltiples opciones:

El nombre exacto del tema es Inanis Glass WordPress Theme y es compatible con WordPress 2.6 a superior.

Enlace | Inanis Glass WordPress Theme
Descarga | Inanis Glass WordPress Theme

Entradas relacionadas:

• Nuevo diseño del blog
• Liberado “X-Blue” Theme para WordPress por xploit29
• 101 Diseños para Joomla
• Twitter cambia su interfaz
• Transforma Ubuntu Hardy Heron en Mac OS X

Moderator

• Muestra el número de comentarios por moderar
• El cliente AIR se puede alojar entre los íconos del sistema evitando la recarga de la barra de tareas.
• Muestra el Gravatar del usuario que ha enviado el comentario (en caso se trate de un avatar poco apropiado)

Moderator es un plug-in muy preciso y enfocado a lo que debe hacer: “moderar comentarios” sin embargo, le falta que muestre la IP de las personas que comentan para así comparar las IP entre comentarios y revisar si se trata de un “spammer”. Sin embargo, el plug-in aún se encuentra en una fase de pruebas (beta) de la cual saldrá pronto.

Luego de activar el plug-in es necesario dirigirse a la opciones del mismo, estas se encuentran dentro de “Opciones” > “Moderator” desde allí podremos instalar el cliente AIR.

Una vez instalado simplemente iniciamos sesión con nuestros datos de WordPress y listo.

Enlace | Moderator
Descargar | Plug-in Moderator
Vía | Ayuda WordPress

Entradas relacionadas:

• Simple Tags en WordPress 2.9
• Page Link Manager, administrar lista de páginas de WordPress
• ¿Es posible evitar la publicidad en celulares?
• WordPress 2.6 mejorará la seguridad
• Windows Vista WordPress Theme

Aquí se muestra la lista de página que se desean más no las ocultas:

En nuestro panel de administración de WordPress escogemos cuáles son las páginas que deseemos que se muestren:

Sin embargo, también podemos escoger que páginas deseemos sin la necesidad de éste plug-in editando la plantilla del blog:

1. Buscamos la función correspondiente: wp_list_pages
2. Por defecto, la función se mostrará de la siguiente manera:

   wp_list_pages();

3. Lo siguiente será agregar el comando y las ID de las páginas a excluir:

   wp_list_pages(exclude=3,4);

4. Guardamos los cambios y listo.

Es por ello que Page Link Manager nos facilita el trabajo de excluir ciertas páginas que no deseamos que se muestren de la función principal que muestra las páginas de WordPress.

Enlace | Page Link Manager
Descarga | Page Link Manager
Vía | Il Maistro

Entradas relacionadas:

• Disponible WordPress 2.7 versión Final
• Simple Tags en WordPress 2.9
• Problemas en los enlaces entrantes de WordPress
• Nuevo diseño del blog
• Nueva mudanza, disculpas por la demora

“X-Blue” es el nombre que le he dado a la plantilla que he diseñado y maqueteado para WordPress. Es una plantilla de 1 columna, pero ésta columna es lo suficientemente ancha para poder soportar widgets con pestañas las cuáles son muy llamativas y por lo tanto se realizará un ahorro de la rueda de desplazamiento para poder visualizar todo el contenido de la barra lateral.

La plantilla cumple con todo los estándares web tanto de XHTML & CSS. En caso realices éstas comprobaciones en mi sitio verás que los errores de XHTML & CSS son generados por plug-ins de terceros más no por parte de la plantilla.

Principales características:

• 100% Fácil de leer
• Fácil integración con banners de publicidad, la que posee una posición no intrusiva
• Incluye botones para compartir el contenido (gracias a KNXDT Bookmarks)
• Compatible con Windows Live Writer
• Separación de forma automática de Pingbacks o Trackbacks de los Comentarios
• Ancho total de 990px, con 640px de contenido y 310px en el sidebar
• Plantilla 100% en español
• Cumple estándares web.

Descarga:

Descargar X-Blue Theme para WordPress (con plug-in para pestañas)
Descargar X-Blue Theme para WordPress (sin plug-in para pestañas)

Instalación:

El archivo de descarga incluye el plug-in para los tabs, lo importante de este plug-in es que se deben mantener el archivo uitabs.css (es muy importante usar el archivo CSS modificado para esta plantilla)

• Debes subir la carpeta del theme dentro de la carpeta /wp-content/themes/
• Una vez subido el theme recuerda activarlo en tu Panel de Administración de WordPress en “Diseño” > “Temas”
• Si también has descargado el archivo que contiene el plug-in recuerda que tienes que activarlo para que funcione correctamente.

Preguntas y comentarios:

Si tienes cualquier tipo de pregunta o comentario, déjalo en la parte inferior del blog o también puedes contactarme.

Permisos y legalidad:

Esta obra se encuentra bajo licencia Creative Commons y puede ser modificada y distribuida sin fines comerciales siempre que se mantenga el crédito al autor original. Cualquier modificación al plug-in editando el crédito de su reconocimiento (línea 156 del código) editando la URL destino no está permitida.

X-Blue WordPress Theme by xploit29 is licensed under a Creative Commons Reconocimiento-Compartir bajo la misma licencia 2.5 Perú License.
Based on a work at www.xploit29.com.

Donaciones:

Si deseas apoyar al desarrollo y evolución de X-Blue quizás desees considerar realizar una donación voluntaria a través de PayPal.

Entradas relacionadas:

• Nuevo diseño del blog
• Windows Vista WordPress Theme
• 101 Diseños para Joomla
• Transforma Ubuntu Hardy Heron en Mac OS X
• Nueva mudanza, disculpas por la demora

Este recuadro solía mostrar los backlinks provenientes de los post de otros blogs, sin embargo, en los últimos días ya no funciona de esa manera.

Los enlaces entrantes que se muestran en esa lista son recopilados por Google a través de Google Blog Search, a través del cual tenemos la opción de recopilar los resultados a través de RSS.

¿De donde provienen estos misteriosos backlinks?

Pues éstos backlinks provienen del blogroll (lista de enlaces), si alguien tiene tu blog en su blogroll, entonces este enlace será tomado como un backlink.

De momento, no sabría si existe algún tipo de solución a esto pues ello era una buena forma de saber quien tomaba información de nuestros posts para escribir el suyo, supongo que se trata de un error por parte de Google Blog Search más no de un error en WordPress.

Entradas relacionadas:

• Page Link Manager, administrar lista de páginas de WordPress
• Nuevo diseño del blog
• Nueva mudanza, disculpas por la demora
• Multan a vehículo de Google Maps
• La Web de Radio Moda puede dañar nuestra PC

Para incorporarlos a nuestra plantilla debemos seguir lo siguientes pasos,

• Nos dirigimos a nuestro panel de administración en WordPress, luego al editor de temas y editamos el archivo header.php (Encabezado)

Dentro de la edición de este archivo añadimos las siguientes líneas entre las etiquetas <head> y </head>

  <script src="http://code.jquery.com/jquery-latest.js">
  	 <!--mce:0-->
  </script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js" type="text/javascript">
     <!--mce:1-->
  </script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.tabs.js" type="text/javascript">
     <!--mce:2-->
  </script>
  <script type="text/javascript">
     <!--mce:3-->
  </script>

• A continuación nos dirigimos a editar el archivo style.css (Hoja de estilos) para definir el estilo de nuestro widget.

A este archivo le tenemos que añadir las líneas de código de CSS del tutorial anterior, lo mejor es que ingresen su hoja de estilos propias, verán que no es muy difícil editarla. Pero en caso deseen practicar, aquí tienen el ejemplo que tienen que añadir al final del archivo style.css

.estilo {
			margin:0 0 15px 0;
			padding:0;
			width:310px;
		}
		.ui-tabs-nav{
			margin:0;
			padding:0;
			list-style:none;
		}
		.ui-tabs-nav li {
			margin:0 2px 0 0;
			padding:0 5px 0 5px;
			float:left;
			height:30px;
			border-top:1px #3399FF solid;
			border-right:1px #3399FF solid;
			border-left:1px #3399FF solid;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			line-height:30px;
			text-transform:uppercase;
		}
		.ui-tabs-nav li:hover {
			background:#EBEBEB;
			color:#333333;
		}
			.ui-tabs-nav li:hover a {
				color:#333333;
			}
		.ui-tabs-nav li {
			background:#FFFFFF;
		}
			.ui-tabs-nav li a {
				color:#336699;
				text-decoration:none;
			}
		.ui-tabs-panel {
			margin:0;
			padding:5px;
			float:none;
			clear:both;
			border:#3399FF solid 1px;
			width:298px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#333333;
		}
			.ui-tabs-panel ul {
				margin:0;
				padding:0 0 0 15px;
			}
			.ui-tabs-panel ul li {
				margin:0 0 5px 0;
			}
		.ui-tabs-panel a {
			color:#336699;
			text-decoration:none;
		}
			.ui-tabs-panel a:hover {
				color:#3399FF;
				text-decoration:underline;
			}
		.ui-tabs-hide {
			margin:0;
			padding:5px;
			float:none;
			clear:both;
			display:none;
			border:#3399FF solid 1px;
			width:298px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#333333;
		}
			.ui-tabs-hide ul {
				margin:0;
				padding:0 0 0 15px;
			}
			.ui-tabs-hide ul li {
				margin:0 0 5px 0;
			}
		.ui-tabs-hide a {
			color:#336699;
			text-decoration:none;
		}
			.ui-tabs-hide a:hover {
				color:#3399FF;
				text-decoration:underline;
			}

• Lo siguiente, es editar el archivo sidebar.php (Barra lateral) para poder añadir nuestros “widgets” en código bruto PHP (que más adelante verán) ya que al usar esta sidebar con pestañas no pueden usar el sistema de WordPress para añadir “widgets” a sus recuadros con pestañas.

Dentro de la edición de este archivo, tenemos que añadir las siguientes líneas de código, si lo deseamos visualizar en la parte superior de nuestra plantilla lo tenemos que añadir antes de la siguiente línea de código:

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>

Pero si lo desea visualizar en la parte inferior, lo tenemos que poner antes del final del sidebar, es decir, antes de la última etiqueta </div>. La líneas de código a añadir son las siguientes:

    <div id="EJEMPLO" class="estilo">
    <ul>
        <li><a href="#tab-1">Título 1</a></li>
        <li><a href="#tab-2">Título 2</a></li>
    </ul>
    <div id="tab-1">
            Aquí el contenido</div>
    <div id="tab-2">
            Aquí el contenido</div>
    </div>

Debemos recordar mantener la estructura que se mencionó en el tutorial anterior para así evitar que nuestro código no funcione.

• Finalmente, nuevamente nos dirigimos al archivo header.php para una última adición. Tenemos que añadir lo siguiente tantas veces se hallan añadido recuadros en la edición del archivo sidebar.php manteniendo los nombres de los respectivos id. La línea de código a añadir es la siguiente:

  <script type="text/javascript">
  $(document).ready(function(){
    $("#EJEMPLO > ul").tabs();
  });
  </script>

Repito, debemos repetir, tantas veces sea necesario.

Luego de realizar todas esas modificaciones, nuestro widget con pestañas se mostrará en nuestra barra lateral de WordPress. A continuación, les daré una lista de funciones en PHP que llamarán algunos widgets sin la necesidad de llamarlos a través de nuestro panel de administración de WordPress:

<?php
//Mostrar cateogrías
wp_list_categories('orderby=name&title_li=');
?>
<?php 
//Mostrar archivo
wp_get_archives('type=monthly'); 
?>
<?php
//Ultimos 10 posts
get_archives('postbypost', 10); 
?>
<?php
//Blogroll
wp_list_bookmarks('title_before=<span style="display:none;">&title_after=</span>&title_li=&category_before=&category_after=');
?>

En caso, tengas alguna duda acerca de este tutorial, déjanos un comentario y recuerda que respecto a la edición de la barra lateral, cada barra lateral es distinta en cada plantilla así que ten cuidado.

Entradas relacionadas:

• Crear tabs para cualquier sitio con jQuery (Parte I)
• Windows Vista WordPress Theme
• Nuevo diseño del blog
• Liberado “X-Blue” Theme para WordPress por xploit29
• 101 Diseños para Joomla

Para iniciar el proceso, entre las etiquetas <head> y </head> debemos añadir las siguientes líneas:

  <script src="http://code.jquery.com/jquery-latest.js">
  	 <!--mce:0-->
  </script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js" type="text/javascript">
     <!--mce:1-->
  </script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.tabs.js" type="text/javascript">
     <!--mce:2-->
  </script>
  <script type="text/javascript">
     <!--mce:3-->
  </script>

A continuación, insertaremos entre las etiquetas <body> y </body> el contenido del recuadro, más adelante, veremos como agregar más recuadros también.

    <div id="EJEMPLO" class="estilo">
    <ul>
        <li><a href="#tab-1">Título 1</a></li>
        <li><a href="#tab-2">Título 2</a></li>
    </ul>
    <div id="tab-1">
            Aquí el contenido</div>
    <div id="tab-2">
            Aquí el contenido</div>
    </div>

Podemos agregar tantas pestañas como deseemos sin ningún problema, pero hay que intentar mantener el órden así que es mejor no recargar de pestañas un recuadro. El siguiente paso será la hoja de estilos (el mismo al que uso para esta plantilla) para poder asignarle un diseño al recuadro que contiene la pestañas:

.estilo{
			margin:0 0 15px 0;
			padding:0;
			width:310px;
		}
		.ui-tabs-nav{
			margin:0;
			padding:0;
			list-style:none;
		}
		.ui-tabs-nav li {
			margin:0 2px 0 0;
			padding:0 5px 0 5px;
			float:left;
			height:30px;
			border-top:1px #3399FF solid;
			border-right:1px #3399FF solid;
			border-left:1px #3399FF solid;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			line-height:30px;
			text-transform:uppercase;
		}
		.ui-tabs-nav li:hover {
			background:#EBEBEB;
			color:#333333;
		}
			.ui-tabs-nav li:hover a {
				color:#333333;
			}
		.ui-tabs-nav li {
			background:#FFFFFF;
		}
			.ui-tabs-nav li a {
				color:#336699;
				text-decoration:none;
			}
		.ui-tabs-panel {
			margin:0;
			padding:5px;
			float:none;
			clear:both;
			border:#3399FF solid 1px;
			width:298px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#333333;
		}
			.ui-tabs-panel ul {
				margin:0;
				padding:0 0 0 15px;
			}
			.ui-tabs-panel ul li {
				margin:0 0 5px 0;
			}
		.ui-tabs-panel a {
			color:#336699;
			text-decoration:none;
		}
			.ui-tabs-panel a:hover {
				color:#3399FF;
				text-decoration:underline;
			}
		.ui-tabs-hide {
			margin:0;
			padding:5px;
			float:none;
			clear:both;
			display:none;
			border:#3399FF solid 1px;
			width:298px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#333333;
		}
			.ui-tabs-hide ul {
				margin:0;
				padding:0 0 0 15px;
			}
			.ui-tabs-hide ul li {
				margin:0 0 5px 0;
			}
		.ui-tabs-hide a {
			color:#336699;
			text-decoration:none;
		}
			.ui-tabs-hide a:hover {
				color:#3399FF;
				text-decoration:underline;
			}

El significado de cada una de las etiquetas de estilo CSS:

• estilo: Es el estilo de todo el recuadro con el cual trabajaremos
• ui-tabs-nav: Es la lista que alojará a los títulos de las pestañas
• ui-tabs-panel: Es el recuadro que aloja el contenido de un recuadro. Este es el estilo del recuadro visible
• ui-tabs-hide: Es el recuadro que aloja el contenido de un recuadro. Este es el estilo del recuadro oculto que más adelante al pulsar sobre el título del recuadro se verá y convertirá en ui-tabs-panel

El agregar otro recuadro con contenido no es difícil, simplemente duplicamos el anterior recuadro y realizamos lo siguiente:

• id: modificamos este atributo del primer div para asignarle un identificador al recuadro
• href: modificamos este atributo por otro que identifique a otro título (manteniendo el símbolo de numeral)
• Añadimos entre las etiquetas <script> y </script> que usamos en el primer paso lo siguiente:

  	$(document).ready(function(){
      $("#EJEMPLO2 > ul").tabs();
    });

  En donde editamos la palabra EJEMPLO por el nombre que le asignamos al segundo recuadro (el atributo id)

Definitivamente, este es un uso básico de esta herramienta y existen uso m´ñas complejos que se le pueden asignar, tal y como se puede observar en el sitio de jQuery.

Actualización: Si tienes un blog en WordPress, puede seguir el siguiente manual para integrarlo.

Entradas relacionadas:

• Crear tabs para cualquier sitio con jQuery (Parte II)
• Refrescar un container <div> con JQuery
• Solucionar problema con Google Analytics
• Solucionar conflicto entre Filezilla y Adobe Air
• Solución a problema al instalar aplicaciones de Adobe CS3 en Windows Vista