Disculpen, estamos cambiando el mundo, de Ana Rey

¿Alguna vez has entrado en una web y te has encontrado con un mensaje tipo «Esta web está en mantenimiento. Vuelve más tarde»? Poner tu página web en modo mantenimiento es la mejor forma de proceder si:

  1. Tienes que actualizar uno o varios componentes de WordPress, especialmente cuando ya prevés que la actualización llevará cierto tiempo (no hay nada peor que entrar en una web y descubrir que no funciona correctamente).
  2. Estás creando una nueva web y quieres que los visitantes no puedan acceder a los contenidos, pero tú sí quieres poder acceder al Escritorio y quieres, además, poder darle acceso a, por ejemplo, tu cliente.

La semana pasada vimos aquellos plugins que, en mi opinión, son imprescindibles para el desarrollo en WordPress (si olvidé alguno, ¿por qué no estás añadiéndolo ya en la sección de comentarios?), entre los cuales había un par de ejemplos para conseguir precisamente esto: poner nuestra web en modo mantenimiento. Como es un tema sencillo que no todo el mundo conoce, he pensado que sería interesante compartir un paso a paso sobre cómo usar el plugin WP Maintenance Mode.

Captura de pantalla de WP Maintenance Mode
Captura de pantalla del plugin WP Maintenance Mode

Configuración del plugin WP Maintenance Mode

Lo primero que tendremos que hacer después de instalar y activar el plugin es configurarlo. Para ello, dirígete a Ajustes » Modo de Mantenimiento de WP. La configuración del plugin está organizada en tres pestañas diferentes:

  • General. Parámetros básicos sobre el comportamiento del plugin tales como, por ejemplo, (des)activar el modo mantenimiento, configurar qué roles tienen acceso a la web o configurar el comportamiento que deben seguir los robots de búsqueda.
  • Diseño. Contenido y apariencia de la página que avisa a nuestros visitantes de que la web está en modo mantenimiento.
  • Módulos. Extensiones varias para personalizar un poco más la pantalla de mantenimiento.

Ajustes Generales » Activar el modo mantenimiento

El primer parámetro de configuración que encontramos sirve para activar y desactivar el modo de mantenimiento. Por defecto, el Estado del plugin es Desactivado. Pásalo a Activado:

Activar WP Maintenance Mode
Opción para activar WP Maintenance Mode. Por cierto, parece que el logo se ve un poco mal en la versión 4.5 de WordPress :-O

y guarda los cambios para poner el modo mantenimiento en marcha. Si ahora intentas acceder a tu web, verás que… espera, ¡todo sigue normal! ¿Acaso hemos hecho algo mal?

En realidad, no hay ningún problema ;-P Cuando activas el modo mantenimiento, tú (como usuario administrador) seguirás teniendo acceso a toda tu web. En la pestaña General de la configuración puedes cambiar este comportamiento por defecto y dar acceso a otros roles (por ejemplo, si tu cliente tiene rol de Editor y quieres que también él pueda ver lo que estás haciendo, puedes cambiando las opciones Rol de administración y Rol de sitio a Editor).

Así pues, si quieres comprobar qué pinta tiene tu web ahora que tienes el modo de mantenimiento activo, bastará con que cierres tu sesión en WordPress o accedas a tu web desde una ventana de incógnito:

Apariencia del modo mantenimiento por defecto
Así se ve una web después de haber activado el plugin WP Maintenance Mode con la configuración por defecto. Un poco soso y con alguna falta de ortografía… Mejor si lo personalizamos un poco, ¿no?

Como ves, se trata de una pantalla bastante sosa. ¡Vamos a ver cómo personalizarla!

Diseño » Personalizar la apariencia del modo mantenimiento

El plugin te permite crear páginas mucho más atractivas que la que viene por defecto. Para personalizar la página de mantenimiento, pulsa en la pestaña Diseño:

Configuración de los textos en WP Maintenance Mode
Configuración de los textos que aparecen en la pantalla de mantenimiento de WP Maintenance Mode

Lo que me gusta de este plugin es que no se complican con mil y una opciones. En esta pestaña encontrarás los cuatro textos que acaban apareciendo en la página de mantenimiento y podrás escoger la imagen de fondo que quieras. De hecho, el plugin viene con algunas imágenes predefinidas muy chulas:

Colección de imágenes predefinidas de WP Maintenance Mode
Colección de imágenes predefinidas de WP Maintenance Mode

Después de aplicar los cambios que quieras, tu página de mantenimiento puede ser algo así:

Apariencia personalizada del modo mantenimiento
Así se ve la página de mantenimiento después de haberla personalizado a nuestro gusto

Módulos » Añadir un contador y/o la suscripción a nuestra lista de correo

Como te decía al principio, el plugin viene con unos cuantos módulos adicionales que extienden la funcionalidad básica. Por ejemplo, puedes poner un contador:

Configuración del contador en WP Maintenance Mode
Configuración del contador en WP Maintenance Mode

que indique a tus visitantes cuándo la web volverá a estar disponible.

O puedes añadir un pequeño formulario donde pidas la dirección de correo a tus visitantes para que se suscriban a tu web:

Añadir un pequeño formulario de contacto
Añadir un pequeño formulario de contacto

de tal forma que, aunque ésta no esté todavía disponible, tú ya empieces a tener información sobre tus futuros lectores/clientes.

Página de mantenimiento con un par de módulos activados
Página de mantenimiento con un par de módulos activados

Espero que te haya gustado este pequeño y sencillo tutorial. Si tienes un hosting sencillo que no permite tener un entorno de desarrollo/pruebas (donde realizar las actualizaciones) y otro de producción (el que ven tus visitantes), el modo mantenimiento es la mejor forma de trabajar con la tranquilidad de saber que no estás «perjudicando» a tus usuarios.

Imagen destacada de Ana Rey.

22 respuestas a «El modo mantenimiento de WordPress»

  1. Avatar de Pedro
    Pedro

    Te pregunto… ¿tuviste problemas con el formulario de contacto que incluye dicho plugin? Te consulto esto porque lo configuré y no hay forma que pueda enviar un mail desde el formulario.

    Saludos y muchas gracias

    1. Avatar de Antonio Villegas

      Hola Pedro. En nuestro caso no activamos el formulario de contacto, por lo que no te puedo decir mucho más. Mira en el log de errores de tu servidor, quizás encuentres algo extraño ahí. Confirma también con tu proveedor de hosting que puedes enviar correos desde WordPress. A ver si hay suerte y consigues que te funcione.

  2. Avatar de Pilar
    Pilar

    Hola hago el procedimiento y me sigue saliendo la página, puedes ayudarme con eso? incluso puse el una ventana incógnita y nada…

    1. Avatar de David Aguilera

      Hola Pilar,

      A ver si estoy entendiendo bien tu problema: has instalado el plugin que menciona mi compañero Antonio en la entrada (WP Maintenance Mode) y lo has activado y configurado como explicamos. Luego, cuando intentas acceder a tu página desde una ventana de incógnito, en lugar de aparecer el mensaje de que te avisa de que tu web está en modo mantenimiento, lo que ves es la página de tu blog normal. ¿Es este el problema?

      Si es que sí, seguramente se deba a que tu blog está detrás de alguna cache o de un CDN. Las caches y CDN son sistemas que guardan la apariencia de tu página para que, cuando alguien entre en tu blog, se le pueda servir la página rapidísimamente, sin tener que esperar a que WordPress haga nada. Si este es tu caso, el problema está en que la cache o CDN devuelven la página a tu usuario (en este caso, a ti en tu ventana de incógnito), impidiendo que WP Maintenance Mode llegue a intervenir si quiera.

      Desactiva temporalmente cualquier sistema de cache o de CDN que tengas (si no estás segura, puedes hablar con tu proveedor de hosting y preguntarle al respecto) y vuélvelo a intentar.

      Un saludo,
      David

  3. Avatar de nico

    David como te va? Tenes idea como se puede hacer para la imagen de fondo sea adaptable dependiendo de la pantalla? Cuando abro la web desde el celu se ve cortada.

    Gracias

    1. Avatar de David Aguilera

      ¡Hola Nico!

      Pues depende de cómo se esté insertando la imagen. Si la imagen aparece como background de algún elemento (y creo recordar que así era), simplemente usa la propiedad CSS background-size:cover para que la imagen escale a lo ancho o alto de la mejor forma posible.

      Un saludo,
      David

  4. Avatar de Eliana

    Hola hola
    He instalado el Modo de Manetenimiento WP, para usarlo a manera de Landing Page, redireccionando las visitas a Facebook, Twitter e Instagram. Tengo 3 preguntas al respecto:
    1. En la configuración de Módulos / Redes Sociales, ¿hay forma de incluir Instagram?
    2. La imagen de fondo, sale cortada. Leí la respuesta al comentario anterior y no entiendo a qué se refieren, por si me pueden aclarar un poco más. Ya ven, nivel de este tipo de conocimientos… cero… 😉
    3. Quisiera saber si los íconos de las Redes Sociales se pueden reubicar y editar para cambiar el tamaño. Salen automáticamente en el centro de la imagen y me parecen muy pequeños.

    Gracias de antemano,
    Saludos

    1. Avatar de David Aguilera

      Hola Eliana,

      Veamos si puedo ayudarte.

      1. Me temo que no puedes añadir Instagram. Deberías ponerte en contacto con el autor del plugin para pedírselo.

      2. La última versión del plugin usa una propiedad CSS que garantiza que la imagen no se vea recortada. Si has metido la imagen desde la pestaña Diseño y estás con la última versión no deberías tener ningún problema.

      3. No de forma sencilla. Podrías intentar encolar una hoja de estilos para reposicionarlo, pero no es trivial. Lo mejor que puedes hacer es, de nuevo, ponerte en contacto con el desarrollador y pedirle ayuda.

      Un saludo,
      David

  5. Avatar de albert
    albert

    Hola David,

    Estoy instalando el plugin pero me da un error al cargar el fondo de imagen. Me dice lo siguiente:


    «»Forbidden

    You do not have permission to access this document.
    Web Server at midominio.com»»

    En modo de fondo de color no me ocurre.

    1. Avatar de David Aguilera

      Hola Albert,

      Las imágenes se suben a la biblioteca de medios; si no consigues subirla, es posible que tengas algún problema con el servidor. Contacta con tu proveedor de hosting y pídeles ayuda a ellos.

      Un saludo,
      David

  6. Avatar de Fernando
    Fernando

    Hola! Yo actualmente tengo una pagina funcionando, NO hecha con wordpress.
    Yo quisiera, mientras voy creando una con wordpress, que se siga viendo mi pagina actual…. no una
    página de mantenimiento. Es posible eso? Intenté empezar mi nueva página con wordpress pero automáticamente
    se me reemplaza la pagina actual por lo que estoy haciendo en WP.
    No tengo muchos conocimientos técnicos, me han hablado de «duplicar» la pagina, etc; pero me resulta muy confuso y no quiero hacer lio.
    ¿Me podrias dar algun consejo?
    Saludos y gracias!

    1. Avatar de David Aguilera

      Hola Fernando.

      Esto depende de cómo tengas configurado tu servidor. En principio, tú puedes tener montado un WordPress e ir tocándolo tranquilamente en paralelo, manteniendo tu antigua página web. Una vez tengas el WordPress listo, es cuestión de cambiar la configuración de tu servidor para que, a partir de ese momento, cuando alguien acceda a tu web se vea el contenido de WordPress y no el contenido antiguo. Lo mejor que puedes hacer para esto es ponerte en contacto con tu proveedor de hosting y pedirles ayuda a ellos; ellos sabrán exactamente qué pasos debes seguir en su plataforma para conseguirlo.

      Un saludo,
      David

  7. Avatar de Jhestudio.com

    «Coming soon plugin», es una buena alternativa.

    Slds!

      1. Avatar de sucely posadas

        hola como puedo desactivar el modo de mantenimiento de la pagina. Gracias!!

        1. Avatar de David Aguilera

          Si estás usando el plugin que comentamos en la entrada, basta con desactivar la opción y eliminar el plugin. Si es de otra forma, habla con tu proveedor de hosting; ellos sabrán cómo hacerlo en tu instalación.

  8. Avatar de Eze
    Eze

    Hola David!

    Estoy trabajando con la ultima versión, con una imagen mía pero la imagen es de fondo gris y los logos de las redes sociales son del mismo gris.

    ¿Hay alguna forma de cambiar el color? Gracias

    1. Avatar de David Aguilera

      Hola Eze. Edita la imagen y cambia el color 😉

  9. Avatar de Agencia Ruana
    Agencia Ruana

    Muy completo artículo. Felicitaciones

  10. Avatar de diseño web montevideo | Nibiru
    diseño web montevideo | Nibiru

    Excelente articulo, gracias por la info

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

He leído y acepto la política de privacidad de Nelio Software

Tus datos personales se almacenarán en SiteGround y serán usados por Nelio Software con el único objetivo de publicar tu comentario aquí. Con el envío de este comentario, nos das el consentimiento expreso para ello. Escríbenos para acceder, rectificar, limitar o eliminar tus datos personales.