dominio personalizado (cc) Foto por mistergwilson

En el anterior post sobre la instalación de WordPress en Windows Azure, veíamos como la URL que se generaba para nuestro sitio web era del estilo http://<mi-nombre>.azurewebsites.net. En este artículo vamos a ver cómo modificar la URL para que la web responda a un dominio personalizado propio como http://www.mi-nombre.com, por ejemplo.

Aclaración previa

Antes que nada, hay que hacer una aclaración sobre el funcionamiento de un sitio web en Azure:

Los sitios web gratuitos no permiten la personalización del nombre del dominio

En Azure existen 3 tipos de sitios web:

  1. Gratuito: con pocos recursos, ideal para hacer las pruebas de nuestra página sin coste, dispone de cuotas de uso que bloquean el acceso a la página si se superan..
  2. Compartido: recursos compartidos con otros sitios web, igualmente utiliza cuotas de uso, algo mayores que el modo Gratuito.
  3. Estándar: máquina virtual dedicada donde alojar tantos sitios web como queramos, o soporte el tamaño de la instancia.

Tan sólo los sitios web en modo Compartido o Estándar permiten la personalización del dominio.

Por ello, lo primero que tenemos que hacer es cambiar la web a uno de estos dos modos antes de configurar los dominios. Mi recomendación es hacerlo justo antes de lanzar la web al público final, o si el dominio real ya es necesario tenerlo para usarlo con otros servicios. De esta manera, ahorraremos costes hasta el momento del lanzamiento.

Para ello, accedemos al portal de gestión y entramos en la ficha del site que vamos a modificar. En este caso, he seleccionado el modo Compartido, más económico.

Azure-Shared

Configurando las DNS del dominio

Lo primero que necesitamos es configurar las DNS de nuestro dominio personalizado para que apunten a nuestro website en Azure. Para ello, tenemos que acceder al panel de administración de nuestro proveedor donde registramos el dominio y añadir el siguiente registro CNAME (o alias):

CNAME: <dominio-personalizado> -> http://<mi-nombre>.azurewebsites.net

En mi caso, y siguiendo con el ejemplo anterior, he creado un registro CNAME para mi-nuevo-wordpress.sergigisbert.com que apunta a mi-nuevo-wordpress.azurewebsites.net.

Dominio personalizado

Configurando el site con el nuevo dominio

Una vez tenemos redirigido el dominio y hemos cambiado el modo de proceso del site, accedemos al panel de administración y comprobamos cómo se ha habilitado la funcionalidad de “Administrar dominio”, que en el modo gratuito está deshabilitada. El botón se encuentra en la barra inferior:

Azure-AdminDomains

En la ventana que se nos abre, introducimos el dominio personalizar que previamente hemos redirigido con el alias DNS:

Azure-NewDomain

Es imprescindible realizar el paso del registro DNS antes que el alta del dominio, porque Azure realiza una consulta para verificar que el nuevo dominio apunta al dominio original de Azure.

Una vez que se aplican los cambios y, si todo ha ido correctamente, ya podemos acceder al site con el nuevo dominio:

Azure-CustomDomain

Podemos utilizar tanto un dominio de primer nivel (www.mi-dominio.com), como un subdominio (blog.mi-nombre.com). El único requisito es que el dominio resuelva con un alias al dominio original de azurewebsites.net.

Y con estos sencillos pasos, ya tenemos nuestro propio dominio funcionando con nuestra web en Azure.

Wordpress en Windows Azure

Hoy en día, la mayoría de proveedores de hosting ofrecen la instalación de aplicaciones web populares de manera sencilla. En este caso, un pequeño tutorial para realizar una instalación de WordPress en Windows Azure.

Primeros pasos

En primer lugar, necesitamos una suscripción activa de Azure. Si no disponemos de una, podemos crear una versión de evaluación gratuita de un mes, con un crédito de 150€.

De todas las opciones que nos ofrece Azure, vamos a utilizar el servicio de Websites, que nos proporciona un servidor web escalable sin tener que ocuparnos de administrar, configurar o actualizar la máquina o el sistema operativo que tiene por debajo.

Creación de la web

Una vez ya hemos entrado en el panel de administración, localizamos el botón Nuevo, en la parte inferior izquierda de la pantalla:

Azure-New

y seleccionamos las opciones Proceso / Sitio Web / De la galería:

Azure-New-From-Gallery

Se nos abrirá un asistente donde podemos observar que no sólo vamos a poder instalar WordPress, sino que existen muchas otras aplicaciones disponibles. Pero en este caso, localizamos WordPress al final de la lista y pinchamos en la flecha para ir al paso 2:

Azure-Wizard-1

En el siguiente paso, elegimos el nombre y la url que tendrá nuestro blog dentro del dominio de Azure. En este caso, la url del site para la prueba será http://mi-nuevo-wordpress.azurewebsites.net. Los detalles de implementación que se muestran a continuación los podemos obviar en este momento.

Azure-Wizard-2

En el último paso, se procede a la creación de la BD MySQL gratuita que nos proporciona Azure a través de ClearDB, de 20Mb, más que suficiente para realizar la configuración inicial del blog, aunque no tanto como para un sistema estable en producción. Más adelante es recomendable buscar otras opciones de BD más escalables:

Azure-Wizard-3

Finalizamos el asistente y, en unos segundos, nos aparecerá la nueva web en el listado de servicios:

Azure-Created

Configuración de WordPress

Una vez se han instalado correctamente los archivos en el servidor y se ha creado la base de datos, el siguiente paso consiste en entrar al nuevo site y realizar la instalación propia de WordPress. Para ello, abrimos en el navegador la dirección web que hemos configurado en el paso 2, en mi caso, http://mi-nuevo-wordpress.azurewebsites.net:

Wordpress-Install

En esta pantalla, rellenamos los datos de “Título del blog”, “usuario”, “password” y “email” y WordPress se encarga del resto:

Wordpress-Success

Si volvemos a navegar a la url de nuestro nuevo blog, lo veremos en funcionamiento:

Wordpress-Hello-World

Con estos sencillos pasos, ya tenemos una instalación de WordPress disponible en menos de 5 minutos para empezar a trabajar con ella.

Plugins imprescindibles para WordPress(cc) Foto por Steve Maxwell

Casi todos los bloggers que utilizan WordPress como plataforma de publicación tienen su lista de plugins recomendados. Yo no quería ser menos, así que aquí va la mía, con los que, a fecha de hoy, estoy utilizando para este blog, y son mis plugins imprescindibles para WordPress. De paso, contesto a la pregunta que lanzaba en el anterior post “Plugins de WordPress. ¿Cuántos son demasiados?“. En mi caso, son 11 12, de momento.

Esenciales

Listado de plugins que hay que instalar por defecto.

1. Jetpack por WordPress.com

Este plugin, desarrollado por los propios autores de WordPress, nos proporciona funcionalidades que sólo están disponibles para blogs alojados en wordpress.com. El listado es amplio, algunas incluidas directamente, y otras se pueden activar o desactivar, según nos interese, por lo que destacaré las que estoy utilizando actualmente. Para utilizarlo, es necesario tener una cuenta de usuario en WordPress.com, que es gratuita.

Estadísticas de WordPress.com

Incluidas por defecto, no se pueden deshabilitar. Aunque estoy utilizando Google Analytics para medir el acceso global a toda la página, no está de más disponer de otra visión de las estadísticas de acceso específico al Blog.

Estadísticas

Publicación en Redes Sociales

Posiblemente la funcionalidad más interesante que nos brinda JetPack es la automatización de la publicación del post en nuestras redes sociales, como Twitter, Facebook, LinkedIn, Google+, Tumblr o Path. De esta manera, integramos en un mismo sitio la publicación del post y su divulgación en redes sociales. Una vez vinculadas las cuentas que queremos utilizar, el plugin añade una sección más en la edición del post que nos permite editar el contenido del mensaje a enviar, genera la URL corta correspondiente e incluso podemos decidir si publicamos o no en todas las redes.

Publicación en redes sociales

También incluye en cada post los enlaces para que los visitante compartan la página con sus redes sociales, de manera que nos ahorramos un plugin adicional de iconos sociales. Los iconos que aparecen son configurables, pudiendo elegir entre varios redes y formatos. Yo he elegido los iconos oficiales:

Iconos sociales

Enlaces cortos WP.me

Permite utilizar el acortador de URLs propio de WordPress, para facilitar compartirlas. Se utiliza también para generar las URLs que se comparten en las redes sociales con la función anterior de divulgación.

Photon

Esta funcionalidad, incluida por defecto y que no se puede desactivar, se encarga de subir todas nuestras imágenes al CDN (Content Delivery Network) propio de WordPress, de forma transparente y gratuita. De esta manera, se reducen las peticiones a nuestro servidor y aprovechamos la distribución geográfica del CDN de WordPress para servir el contenido más cercano al usuario.

El código HTML de una imagen tendrá el siguiente aspecto:

Como se puede observar en la url de la imagen, el servidor que la sirve es i1.wp.com.

Monitor

También incluida directamente, Monitor se encarga de monitorizar la disponibilidad del blog, y nos enviará un correo cuando esté caído. Muy útil para corregir periodos de inactividad.

2. UK Cookie Consent

Para cumplir con la normativa europea sobre el uso de cookies en las páginas web, este plugin muestra un pequeño popup a nuestros visitantes para informales de su uso en el blog. A pesar de ser la versión inglesa, es totalmente configurable, tanto los textos, colores como los contenidos de la página de información, que se crea automáticamente. También podemos decidir si se muestra en la parte superior o inferior de nuestra página. Podéis ver la mía en Cookie Policy.

Cookies

SEO. Optimización para buscadores

Como todos sabemos, es importante cuidar el apartado de optimización en buscadores de nuestra página si queremos aparecer en los resultados de búsqueda de nuestros potenciales visitantes. Para ello utilizo los siguientes plugins:

3. WordPress SEO

Probablemente el plugin de SEO por excelencia. Las funcionalidades que ofrece son diversas y merecen un post completo, pero por destacar algunas:

  • Generación automática de meta-tags en el código
  • Generación automática de los sitemaps para los buscadores
  • Añade los meta-tags propios de Facebook, Twitter y Google+
  • Análisis del SEO de cada POST antes de su publicación, con recomendaciones sobre contenido, palabras clave, etc.

4. Simple 301 Redirects

En mi caso, ya tenía otro blog hace tiempo (al que tampoco le dedicaba demasiado tiempo), pero que recibía algunas visitas. Para no perderlas y seguir recibiendo el tráfico que aquel blog recibía a través de buscadores, con este plugin podemos definir las redirecciones que necesitemos, indicando la nueva página que deberá servir la página.

En mi caso, tenía pocas URLs que migrar, así que lo hice a mano. Existen otros plugins que realizan la importación de los posts desde otros gestores de Blogs (Blogger en mi caso) y automatizan las redirecciones, pero tuve algunos problemas con ellos, así que finalmente este plugin me resultó el más sencillo y funciona correctamente.

Simplemente hay que indicar los pares “URL anterior” – “URL nueva” y él se encarga de enrutar la peticiones:

301 redirects

Sólo queda un problema de infraestructura que resolver, consistente en redirigir el tráfico desde el dominio anterior, http://blog.interbuilders.es, al nuevo http://www.sergigisbert.com/blog, y que además envíe la URL completa para que el plugin sepa a qué página concreta debe dirigirse. Existen varias maneras de hacerlo: algunos plugins te proporcionan un código HTML a colocar en tu sitio anterior, que realiza la redirección. En mi caso, y con el fin de no depender de que Blogger siga existiendo, utilizo una funcionalidad de CloudFlare, que me permite realizar la redirección a nivel de DNS y transmitir además la URL completa al nuevo host.

Como ejemplo, el siguiente enlace http://blog.interbuilders.es/2011/04/nuget-o-como-simplificar-la-gestion-de.html nos llevará al mismo artículo, pero alojado en sergigisbert.com.

[Actualización: Plugin de Backup, aportación de Gonzalo Cao]

5. BackWPup

Para realizar las copias de seguridad de nuestro Blog, imprescindible un plugin como BackWPup, que nos permite hacer copias de seguridad programadas de la BD y el contenido, y almacenarlas tanto en el propio servidor, como en la nube, en una cuenta de Dropbox, por ejemplo.

Optimización y rendimiento

En este apartado aparecen aquellos plugins que nos ayudan a mejorar el rendimiento global de WordPress. Como ya comenté en en el post “Detalles técnicos de implantación de la web“, para este blog utilizo CloudFlare y Varnish para acelerar el contenido y, entre ambos, reciben y gestionan la mayor parte del tráfico y las peticiones que llegan a la web. Aún así, es necesario optimizar la página para que la carga en el cliente sea lo más rápida posible.

6. W3 Total Caché

Un plugin básico para aumentar el rendimiento del blog, igualmente requiere un post dedicada por su vasta extensión de funcionalidades. Como ejemplo, nombraremos algunas de las funcionalidades que utilizo para este blog.

  • Caché de páginas, objetos y Base de datos.
  • Combinación y minimización de archivos y código inline (HTML, JS y CSS).
  • Gestión adecuada de las cabeceras de caché de los recursos estáticos.

En el caso concreto de este blog, probablemente por su alojamiento en un WebSite de Azure, tiene problemas para la creación de los archivos JS y CSS que combinan los diferentes archivos que se utilizan en el blog, por lo que la solución adoptada ha sido la siguiente:

  • Archivo JS: Utilizo una funcionalidad de CloudFlare para cargar los archivos JS juntos al finalizar la carga de la página principal.
  • Archivo CSS: El plugin de CleanerPress descrito a continuación.

7. CleanerPress Professional

Este plugin ofrece diversas funcionalidades, pero la que nos interesa especialmente es la posibilidad que ofrece de combinar todos los archivos CSS que use utilizan en el tema de WordPress en uno sólo, de manera que se reducen las peticiones del navegador al servidor.

8. WP Smush.it

Este plugin hace uso del servicio gratuito de Yahoo Smush It, para optimizar las imágenes de nuestro blog y reducir su tamaño. Cada vez que subimos una nueva imagen a la librería multimedia, este plugin optimizará las diferentes versiones de la imagen y almacenará la versión optimizada de las mismas. Es especialmente eficaz con los archivos PNG.

Smush.It

Si ya teníamos imágenes subidas a la web con anterioridad a la instalación del plugin, también nos permite realizar una optimización general de todas las imágenes de la librería.

9. WordPress Varnish

Cuando trabajas con Varnish, es muy importante disponer de la funcionalidad de invalidar su caché cada vez que publiquemos, actualicemos o eliminemos contenido del blog, porque si no, Varnish devolverá la página antigua que tiene en caché y el usuario no vería el contenido actualizado.

Después de probar varios plugins, y de modificar y optimizar el archivo VCL de configuración de Varnish, este ha sido el único que me ha funcionado de todos. Se encarga él solo de invalidar la caché de Varnish con cada nuevo post o actualización, y además permite invalidarla por completo o una URL en concreto

Miscelánea

Los cuatro plugins que faltan aportan funcionalidades interesantes que WordPress por sí mismo no dispone.

10. Crayon Syntax Highlighter

Por la orientación tecnológica de este blog, de vez en cuando incluyo código fuente en el contenido de los posts. Este plugin es un increíble formateador de código, con innumerables opciones, lenguajes soportados y funcionalidades, que lo haen adaptable a cualquier estilo visual.

11. Disqus Comment System

Este plugin permite sustituir el sistema de comentarios nativo de WordPress por el servicio de comentarios de Disqus, cuya principal ventaja reside en que ya incorpora Akismet y otros sistemas anti-spam, por lo que no necesitamos instalarlo en nuestro blog ni disponer de una licencia propia.

Otra ventaja es que los usuarios se pueden autenticar con sus cuentas de Twitter, Facebook o Google y una vez han accedido, pueden comentar con su mismo usuario en todas las webs que utilicen Disqus como sistema de comentarios.

12. Ultimate TinyMCE

El editor que incorpora WordPress para el contenido de los posts y página es algo limitado en cuanto a funcionalidades. Para solucionarlo, existen varios plugins que añaden nuevos botones y funciones al editor por defecto, permitiendo una experiencia de edición más útil. En mi caso, utilizo este.

Resumen

De momento son 11 12 los plugins que necesito para hacer funcionar el blog según mis necesidades actuales, aunque no es descartable que en un futuro aumenten. Y tú, ¿cuántos plugins de WordPress necesitas?