¿Tu WordPress no te deja incrustar vídeos?: un tip para arreglarlo

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).

editorvisual

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

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

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.

Y tú, ¿cómo mantienes tus músculos blogueros?

Entrena tus músculos blogueros con los interesantes ejercicios de Lorelle VanFossen Lorelle on WordPress

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

El hack para arreglar el problema de las imágenes en el theme Pocket

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.

Dí hola al archivo functions.php de WordPress

El archivo functions.php

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.

Añadiendo opciones a la barra de administración del blog

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.

WordPress Hub, la revista sobre WordPress para iPad

WordPress está adquiriendo tal popularidad que ya hasta tenemos una revista interactiva para iPad, y si no fuera por la debacle del mundo editorial seguro que también estaría ya disponible en papel en los quioscos.

Me refiero a WordPress Hub magazine, una revista para iPad en la que mes a mes (van por el número 3) se publican trucos, tutoriales paso a paso, noticias y recomendaciones de webs hechas con WordPress, plugins, temas, un poco de todo.

Lo mejor del formato interactivo es que ofrece manuales en vídeo e incluso enlaces de descarga, ventajas del hub digital.

Si te animas aquí tienes el enlace directo a iTunes. Puedes descargar gratis el número 0 y la suscripción a la revista mensual es de 4,49€.

Personaliza a tope WordPress con WP Helpers

Hace tiempo que buscaba algo así, una herramienta que unificara un buen montón de personalizaciones a la hora de entregar instalaciones de WordPress a clientes o proyectos.

Y es que hay muchos plugins (quizás demasiados) para personalizar ajustes y opciones de WordPress pero por fin he encontrado uno que aglutina lo mejor de lo mejor.

Estoy hablando de WP Helpers, una auténtica maravilla de plugin, obligado en cualquier instalación de WordPress en la que haya más de un usuario, incluso para un solo usuario, que viene a ser la madre del tweaking de WordPress.

Los ajustes de personalización que ofrece son casi infinitos, incluyendo muchos trucos que ya hemos visto aquí en Ayuda WordPress, a saber:

wp helpers 6 wp helpers 5 wp helpers 4 wp helpers 3 wp helpers 2 wp helpers 1

General

  • Control total de la barra de admin de WordPress, incluído el texto “Hola“.
  • Mostrar los IDs en las páginas de entradas, páginas, categorías, etiquetas, usuarios, medios, tipos de entrada personalizadas y taxonomías personalizadas.
  • Desactivar el cambio de tema.
  • Quitar la pestaña de “Opciones de pantalla”
  • Desactivar los avisos de actualización de WordPress, temas y plugins (individualmente).
  • Poner el sitio en modo de mantenimiento.
  • Ocultar widgets del Escritorio.
  • Definir las columnas de Escritorio por defecto.
  • Mostrar un aviso a los usuarios, ya sea en la zona de admin o en el mismo sitio.

Escritura

  • Establecer el editor de entradas por defecto (Visual o HTML)
  • Desactivar completamente el editor visual.
  • Aumentar la altura de la caja de Extracto cuando escribes una entrada.
  • Desactivar el autoguardado.
  • Cantidad de entradas en la página del editor.

Lectura

  • Establecer la longitud de extractos por caracteres o palabras.
  • Quitar los prefijos “Privado” y “Protegido” en los títulos.
  • Desactivar los feeds RSS.
  • Añadir imágenes destacadas al feed RSS.
  • Incluir o excluir tipos de entrada en el buscador.
  • Desactivar XML-RPC (en WordPress 3.5 o superior)

Comentarios

  • No permitir comentarios en páginas.
  • Quitar el auto-enlazado en los comentarios.
  • Desactivar el auto-ping.

Apariencia

  • Mejoras en las clases “Body/post”: detección de navegador, taxonomías (incluidos niveles jerárquicos), fecha de entrada, miniatura de entrada, información de autor, usuarios registrados, multisitio, extractos, etc.
  • Quitar alguno o todos los widgets por defecto de WordPress.
  • Ejecutar shortcodes en los widgets.
  • Quitar de la cabecera del tema la versión de WordPress, enlaces al feed, enlace RSD, enlaces relacionales y “wlwmanifest” para entradas relacionadas con la actual.

Perfiles de usuario

  • Quitar la opción de esquemas de color del escritorio de los perfiles de usuario.
  • Quitar las cajas para perfiles de AIM, Yahoo IM, Jabber/Google Talk

El plugin es gratuito, y su único requisito es la instalación previa de otro plugin, piklist, que tampoco pide pan, por lo demás es una gozada.

El nuevo perfil de Twitter y otras entradas de Septiembre en WM

Foto de @marioffpsilva

[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:

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

[Vídeo tutorial] Cómo saber si existe una versión pendiente de instalar en WordPress y llevarla a cabo automáticamente

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.

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

[vídeo tutorial] Cómo crear y publicar un post en #WordPress

Labios WP

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.

10 lecciones para aprender a instalar WordPress en tu propio servidor

Logo de WP

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