Planeta WordPress

Es posible que hayas intentado incrustar un vídeo en tu blog de WordPress, copiando el código correspondiente en el editor, y al publicar aparezca en su lugar un hueco en blanco. Ni siquiera te aparece en la vista previa del post. La causa más probable de ese problema es un pequeño ajuste que hay que hacer en la configuración de tu editor. Te lo explico a continuación.

Supongamos que quieres incrustar este vídeo (la versión original del famoso meme Harlem Shake). Si no sabes lo que es todavía el Harlem Shake te sugiero que leas este fantástico post de Clara Ávila.

En WordPress, incrustar un vídeo se puede hacer, básicamente, de dos formas: haciendo uso de un plugin y pegando el código proporcionado por cada servicio directamente. Y es en este segundo caso (sin plugin) cuando te puedes encontrar con el problema en cuestión.

Existen muchos plugins para incrustar vídeos de distintas plataformas. Por ejemplo, yo utilizo Viper’s Video Quicktags para hacerlo mediante shortcode. La URL para compartir el vídeo de Harlem Shake es “http://youtu.be/8vJiSSAMNWw” así que solamente hay que entrar en el editor y añadir el siguiente código:

1

[youtube]http://youtu.be/8vJiSSAMNWw[/youtube]

El problema, como decía, viene cuando queremos emplear el código html directamente. Existen sitios que emplean sus propios servidores (no los de YouTube, ni Vimeo, etc.) para alojar los vídeos. Entonces no hay posibilidad de utilizar un plugin como Viper’s Video Quicktags. En ese caso, y para el vídeo del Harlem Shake, el código a insertar sería el que va a continuación:

1

<iframe width="560" height="315" src="http://www.youtube.com/embed/8vJiSSAMNWw" frameborder="0" allowfullscreen></iframe>

Para asegurar que el editor de WordPress resuelva bien el código y puedas visualizarlo correctamente en tu página, solamente hay que entrar en la configuración de tu usuario y desactivar la opción del editor visual, ese que te permite ver directamente el resultado mientras vas escribiendo. Ese tipo de editores también se conocen con el nombre de WYSIWYG (acrónimo de “What You See Is What You Get” o “lo que ves es lo que obtienes”).

En la imagen siguiente puedes observar dónde se encuentra la casilla para desactivar el editor visual o WYSIWYG (con la casilla activada el editor visual está inhabilitado).

Cuando hayas incrustado un vídeo correctamente puedes volver a activar el editor visual.

Y, off-topic, el vídeo del Harlem Shake original .

AVISO IMPORTANTE: Cambia la configuracion de tu suscripcion a Blogpocket en tu agregador poniendo el feed nativo http://www.blogpocket.com/feed, ya que el de FeedBurner lo usaremos, como maximo, hasta el proximo 1 de Julio de 2013.

Suscribete tambien a Blogpocket.com por e-mail.

Muchas veces es mejor retocar un poquito el código de un theme que instalar un plugin. Este sencillo hack es para extraer la imagen destacada (también denominada Post Thumbnail) y redimensionarla a gusto del consumidor.

Pocket, el theme minimalista y responsive que acabamos de implantar en Blogpocket, utiliza las imágenes featured como cabecera de cada post. Como sabes, en WordPress puedes asignar una imagen destacada a cada entrada a publicar. Los tamaños de dicha imagen se asignan por defecto en la página de configuración (Ajustes > Multimedia) del panel de administración. Pero esto supone un problema si se cambian dichos tamaños después de subir imágenes previamente o si se ha activado un theme que usa diferentes dimensiones.

Una solución, como se indica en la página de ayuda del Codex Function Reference/add image size, es aplicar un plugin para redimensionar imágenes ya subidas, como por ejemplo Regenerate Thumbnails, AJAX thumbnail rebuild o Simple Image Sizes.

Sin embargo, yo he preferido no cargar la instalación con más plugins y aplicar un pequeño hack al código del theme que consiste en extraer la url de la imagen destacada y mostrarla redimensionada utilizando el atributo width (ancho).

Más o menos, el código sería el siguiente:

1
2
3
4
5
6
7

<!-- grab the featured image -->
<?php if ( has_post_thumbnail() ) { ?>
   <?php $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large-image'); ?>
   <div style="text-align: center;">
   <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><img src="<?php echo $large_image_url[0]; ?>" alt="image large" width="600" /></a>
   </div>
<?php } ?>

La función has_post_thumnail detecta si existe una imagen featured, formalmente conocida como “Post Thumbnail”, asociada al post.

La función get_post_thumbnail_id extrae el ID de la imagen destacada.

La función wp_get_attachment_image_src devuelve un array con los atributos “url”, “width” y “height”, de una imagen anexada a un post. El primer elemento del array es la URL de la imagen, que es el que luego se redimensiona con “width=600″ en la etiqueta “img src”.

Te recomiendo que eches un vistazo a la información sobre imágenes featured en el Codex.

AVISO IMPORTANTE: Cambia la configuracion de tu suscripcion a Blogpocket en tu agregador poniendo el feed nativo http://www.blogpocket.com/feed, ya que el de FeedBurner lo usaremos, como maximo, hasta el proximo 1 de Julio de 2013.

Suscribete tambien a Blogpocket.com por e-mail.

El archivo “functions.php” sirve para añadir funcionalidades a WordPress y debe alojarse en la carpeta del theme activo. Otra forma de extender el funcionamiento de tu instalación de WordPress es instalando plugins pero es muy recomendable utilizar el archivo “functions.php” para realizar pequeños cambios.

Por ejemplo, yo utilizo la página del WordPress Trac que simplifica la tarea de actualizar la plataforma cuando los cambios de versión son mínimos (para saber cómo hacerlo: Cómo simplificar los cambios de versión de WordPress), y me gusta tener el enlace a dicha página en la barra de administración de WordPress (la que aparece en la parte superior). Con ello puedo comparar los cambios entre una versión y otra, rápidamente y sin tener que buscar el enlace.

Como se puede observar en la figura, he añadido una nueva opción denominada “Prepare Diff”, entre “Mis sitios” y “blogpocket”. Esa opción es la que lleva a la página del WordPress Trac.

Tú también puedes añadir cualquier opción que se te ocurra a la barra de administración de tu blog. Lo que debes hacer es añadir el código que se muestra a continuación dentro del archivo functions.php. No te olvides de realizar previamente una copia de dicho archivo por si acaso.

function incluir_enlace_admin_bar() {
global $wp_admin_bar;
$wp_admin_bar->add_menu( array(
‘id’ => ‘diff’,
‘title’ => __(‘Prepare Diff’),
‘href’ => ‘http://core.trac.wordpress.org/diff’
));
}
add_action( ‘admin_bar_menu’, ‘incluir_enlace_admin_bar’ , 30);

Personaliza el código con tu propio enlace, cambiando “diff” por cualquier etiqueta identificativa, “Prepare Diff” por cualquier literal y ““http://core.trac.wordpress.org/diff”” por la URL de la página de destino.

AVISO IMPORTANTE: Cambia la configuracion de tu suscripcion a Blogpocket en tu agregador poniendo el feed nativo http://www.blogpocket.com/feed, ya que el de FeedBurner lo usaremos, como maximo, hasta el proximo 1 de Julio de 2013.

Suscribete tambien a Blogpocket.com por e-mail.

[Foto realizada por marioffpsilva en la presentación del Manual imprescindible de Twitter en Madrid el 25-9-2012]

WordPress, Twitter, Facebook y Dropbox fueron los temas que traté en Weblog Magazine durante el mes de Septiembre.

A continuación, la recopilación habitual de las entradas que publiqué durante el mes de septiembre de 2012 en mi blog de ABC.es Weblog Magazine:

• Las opciones básicas del editor de entradas de WordPress
• El método simplificado para actualizar la versión de WordPress
• Cómo activar la nueva cabecera del perfil de Twitter
• Facebook: Cuáles son las diferencias entre perfiles de usuario y páginas corporativas
• La semana de Twitter en Madrid
• El Museo de ABC acogió la presentación del Manual

Suscríbete también a la newsletter y recibirás en tu e-mail contenido extra que no está en el blog.

Pinche aquí para ver el vídeo

En este vídeo (de menos de cuatro minutos), de elaboración propia, se explica:

• Qué es el gestor de bases de datos MyPHPAdmin
• Cómo se accede a la base de datos de un blog de WordPress y qué tablas contiene
• Cómo se optimiza la base de datos de un blog de WordPress; es decir, cómo se recupera espacio de almacenamiento perdido

WordPress está desarrollado en lenguaje PHP. Los datos (entradas, comentarios, usuarios, configuración, etc.) se guardan en una base de datos (conjunto de tablas estructuradas) denominada MySQL. Para gestionar directamente las tablas de una base de datos MySQL se utiliza la herramienta MyPHPAdmin.

La mayoría de los proveedores de hosting proporcionan el acceso a MyPHPAdmin pero la manipulación errónea de una base de datos puede arruinar tu blog. Así que lo mejor, antes de nada, es realizar una copia de respaldo (backup) de la base de datos.

Suscríbete también a la newsletter y recibirás en tu e-mail contenido extra que no está en el blog.

Pinche aquí para ver el vídeo

En este vídeo tutorial, de elaboración propia, se explica la forma automática de actualizar la versión de WordPress. También aprenderás a averiguar cuándo hay una actualización pendiente de llevar a cabo.

• Dificultad: Media
• Duración: menos de 3 minutos
• Lo que se explica en este vídeo: Dónde se sitúa el aviso de WordPress, con el mensaje de que existe una actualización de versión pendiente, y cómo se realiza de forma automática.

Esta es la forma más rápida y la indicada para aquellos usuarios sin tiempo o ganas de complicarse la vida. No se requiere tampoco ningún conocimiento técnico especial. Solamente necesitas conocer los parámetros de conexión a tu hosting por FTP, que te tiene que proporcionar tu proveedor (nombre del host, usuario y contraseña).

Existen tres formas de actualizar la versión de WordPress:

• Manual completa: Se descarga el software y se sustituyen algunos de los archivos del servidor por los nuevos, empleando un cliente de FTP.
• Manual simplificada: Se descargan solo las diferencias y se sustituyen solo los archivos modificados, utilizando el FTP (para conocer cuáles son dichas diferencias ver el artículo de Weblog Magazine: El método simplificado para actualizar la versión de WordPress).
• Automático: el explicado en el video tutorial de esta entrada: el sistema lo hace todo y solo se requiere facilitar los datos de conexión al servidor por FTP.

• Ver también en Weblog Magazine: Cómo instalar una nueva versión en WordPress y Las opciones básicas del editor de entradas de WordPress.
• Ver también en Blogpocket: 10 lecciones para aprender a instalar WordPress en tu propio servidor.

Vídeo tutoriales anteriores: Cómo crear y publicar un post en #WordPress

Suscríbete también a la newsletter y recibirás en tu e-mail contenido extra que no está en el blog.

Aprende el funcionamiento basico del editor de entradas de WordPress con este video tutorial

Pinche aquí para ver el vídeo

• Nivel: Iniciación
• Duración: menos de 5 minutos
• Lo que se explica en este vídeo: El funcionamiento básico del editor de entradas de WordPress. Cómo se escribe el título, el texto y el extracto de un post. Cómo se puede reconfigurar el código HTML formado automáticamente y cómo añadir tu propio código HTML para modificar el aspecto visual de la entrda. Cómo se añade una imagen. Cómo se asignan categorías y etiquetas.

• Ver también en Weblog Magazine: Las opciones básicas del editor de entradas de WordPress.
• Ver también en Blogpocket: 10 lecciones para aprender a instalar WordPress en tu propio servidor.

En esta entrada se recopilan algunos de los más recientes artículos que he publicado tanto en Blogpocket como en Weblog Magazine acerca de la instalación de WordPress.org. De esta forma, tendrás de un vistazo, y a mano, la mejor guía para instalar WordPress en tu propio servidor (incluida la parte de registrar el dominio).

• Lección 1: En qué se diferencian WordPress.com y WordPress.org

  Es lo primero que debes conocer. Ambas plataformas gratuitas se basan en el mismo software pero una está lista para usar online (WordPress.com) y la otra la tendrás que instalar y mantener tú (WordPress.org).

  Las diferencias entre WordPress.com y WordPress.org

• Lección 2: Lo que debes de saber para poner en marcha un blog en WordPress

  Con esta revisión adquirirás un conocimiento general de lo que significa poseer un blog en WordPress.

  10 pasos para poner en marcha un blog con WordPress

• Lección 3: Lo que necesitas saber para registrar un dominio con WordPress

  Pero antes de nada, debes registrar un dominio. Afortunadamente, hoy en día es muy fácil llevar a cabo esta tarea y existen muchos proveedores de servicios de Internet que te proporcionan el registro a precios muy asequibles. Sin embargo, dependiendo de la versión elegida de WordPress (.com o .org) tienes distintas alternativas. En este artículo te aclaro las distintas posibilidades.

  WordPress: cómo saber si necesitas registrar un dominio

• Lección 4: Cómo registrar un dominio

  A la hora de registrar un dominio debes conocer alguna cuestiones. En la siguiente entrada te lo explico.

  Cómo registrar un dominio

• Lección 5: Instalando WordPress

  Y llega la hora de ir al grano. Instalar WordPress en tu propio servidor no es tan difícil como parece. Compruébalo tú mismo siguiendo los pasos que se indican en el siguiente post que publiqué en mi blog de ABC.es.

  ¡Atrévete con WordPress! (pasos para instalar WordPress)

• Lección 6: Configurando lo esencial tras la instalación

  Y una vez instalado WordPress, lo primero es realizar algunas configuraciones básicas. Aprende cuáles son leyendo este artículo publicado en Weblog Magazine.

  Primeros pasos a seguir tras la instalación de WordPress

  Si quieres traducir el escritorio de WordPress, lee también el post Cómo traducir WordPress

Una vez instalado el software de WordPress en tu servidor y realizada una configuración básica, elige tu theme y… ¡ponte a publicar!

• Lección 7: Qué es un theme y cómo se personaliza en el orden correcto

  Con todo lo anterior ya puedes empezar a publicar tus contenidos. Si el aspecto visual del blog (el que WordPress asigna por defecto) no te gusta, puedes cambiarlo eligiendo e instalando una de las muchísimas plantillas que existen. Aquí aprenderás qué es un theme y cómo se personaliza correctamente.

  Cómo personalizar un theme de WordPress en el orden correcto

• Lección 8: Eligiendo un theme

  Para elegir un theme puedes consultar mi cuenta de Delicious, en la que voy almacenando los enlaces más interesantes que contienen revisiones de plantillas para WordPress.

  Etiqueta themes de mi cuenta de Delicious

• Lección 9: Qué es un plugin

  Los plugins son la parte más interesante de WordPress porque te permite ampliar las funcionalidades de tu blog hasta el infinito. En esta entrada aprenderás cuáles son los plugins esenciales en tu instalación de WordPress.

  Otros 7 plugins útiles de WordPress

• Lección 10: Los plugins esenciales en tu instalación de WordPress

  Y para encontrar información acerca de plugins y enlaces con listas de ellos, sigue también la etiqueta “plugins” de mi cuenta de Delicious.

  Etiqueta plugins de mi cuenta de Delicious

Hac clic en la imagen para agrandarla

A la hora de ofrecer tu blog a los lectores se recomienda que poseas tu propio dominio. Es muy fácil registrar un dominio y, en la actualidad, son muy baratos (por ejemplo, puedes consultar los planes de registro de dominios de Piensasolutions.com). Estamos hablando de que tu blog tenga una URL del tipo tudominio.com (o tudominio.es, tudominio.org, etc.) en lugar de las que ofrecen los servicios gratuitos (en el caso de WordPress.com, la URL que se asigna es tudominio.wordpress.com; y en el caso de Blogger, tudominio.blogspot.com).

Poseer tu propio dominio para la URL de tu blog es altamente recomendable, por ejemplo a la hora de construir tu marca personal.

WordPress.com

Sin embargo, si eliges la plataforma WordPress debes conocer las distintas posibilidades que existen. Con el diagrama que acompaña a este post puedes ayudarte a elegir la opción que más se acerque a tus intereses.

Lo primero que debes plantearte es si posees los suficientes conocimientos técnicos (en programación PHP y bases de datos MySQL, servidores, etc.) y, en caso contrario, optar por la versión lista para usar de WordPress.com. Aunque la configuración de tu blog en esa plataforma no es tan inmediata como en Blogger o, claro está, en Tumblr, es ideal para aquellos que no quieren complicarse la vida con detalles técnicos (cambios de versión, modificación de plantillas, instalación de plugins, etc.: nada de esto se puede hacer en WordPress.com). En WordPress.com puedes disponer de tu propio dominio contratándolo como función extra (de pago) y el servicio incluye el redireccionamiento desde tu dominio del estilo tudominio.com al nativo de WordPress.com (tudominio.wordpress.com).

WordPress.com (listo para usar pero poco flexible) y WordPress.org (más flexible y potente pero más difícil de aprender) son dos sabores del mismo dulce: WordPress.

WordPress.org

La versión instalable de WordPress (WordPress.org) ofrece muchas más posibilidades de personalización (tanto visual como funcionalmente) pero requiere de ciertos conocimientos técnicos. El software no incluye ningún servicio de gestión de dominios por lo que debes registrarlo en alguno de los proveedores que se dedican a ello (por ejemplo, piensaolutions.com, como dijimos al principio). Y también debes contratar el hosting (que lleva asociado el espacio de almacenamiento, la transmisión de archivos por FTP, cuentas de e-mail, gestión de las bases de datos MySQL, etc.).

Te recomiendo que los proveedores de los servicios de registro de dominio y hosting sean distintos. Eso te dará más flexibilidad a la hora de traslados y te evitará problemas.

El último paso sería redirigir tu dominio hacia el lugar donde reside tu blog (el hosting). Eso se realiza mediante el panel de administración que te tiene que proporcionar el proveedor en el que resitraste el dominio. Tu hosting tiene una localización basada en direcciones IP (las denominadas DNS) y lo único que debes hacer es asignar dichas DNS a tu dominio.

Con WordPress.org siempre tendrás un blog con tu propio dominio, del estilo tudominio.com.

Imagen encontrada en Multiblog
Llevo mucho tiempo descargando themes de WordPress y te aseguro que es muy tentadora la idea de modificar los archivos para personalizarlos a tu gusto (y si eres programador o te gusta cacharrear más aún). A esas modificaciones se las conoce por “hacks” y, por experiencia, te recomiendo reducir a cero esa práctica. Entre otras razones porque ningún cambio te servirá si actualizas el theme (porque los nuevos archivos sustituirán a los antiguos; es decir, los que has modificado). Otra razón de peso, sobre todo si no eres un experto desarrollador, es que cualquier cambio aparentemente inocente puede provocar problemas en el funcionamiento de tu blog.

Por lo general, no conviene que modifiques directamente los archivos de un theme de WordPress. Afortunadamente, existen métodos para personalizar el aspecto visual de tu blog sin hacerlo.

¿Cómo personalizar entonces un theme?.

Como regla general, sigue el siguiente orden y recuerda que nunca, bajo ningún concepto, debes modificar directamente los archivos de tu plantilla.

• 1. Es muy probable que ese pequeño cambio que quieres hacer se pueda realizar mediante una opción del propio theme. Revisa todas las opciones de la plantilla activa antes de ponerte a cambiar nada.
• 2. Si utilizas un “framework” como Genesis o Thesis, revisa el archivo style.css del theme hijo (child theme) si se trata de un cambio de apariencia. Si eres de los que no se conforma con el aspecto visual que ofrecen los themes que vas a utilizar, te recomiendo que instales un “framework” ya que te proporcionará mucha más flexibilidad no solo en el aspecto visual sino también en el funcional. Aquí, en Blogpocket, ya te explicamos qué es un “framework“. Sin “framework” también puedes crear tú un child theme de la plantilla que quieres modificar e incluir las modificaciones en un archivo css. En Child Themes (Codex de WordPress) se explica claramente cómo llevarlo a cabo.
• 3. Si se trata de un cambio funcional, aprende a utilizar el archivo functions.php
• 4. Prueba a añadir nuevos archivos a la plantilla del theme hijo.
• 5. Y, por último, utiliza un plugin siempre y cuando te asegures de que no sea incompatible ni con el propio theme ni con otros plugins ya funcionando. Realmente, el uso de un plugin sería solo en el caso de que el cambio sea muy amplio.

Puedes consultar más errores típicos en el uso de los themes de WordPress en Rookie mistakes.