Tabla de contenidos
A veces cuando tienes cuando creamos un nuevo proyecto o hacemos modificaciones nos interesa poner una página con un mensaje de “página en construcción” de esta forma podemos darle información a tus visitantes. A continuación voy a enseñarte la forma de hacer tu página en construcción de una forma fácil y rápida.
Como poner pagina en construcción en WordPress
Si estas haciendo una web en en WordPress o una tienda online en Woocomerce, hay plugins de pagina en construcción para WordPress que te facilitaran mucho la vida. Entre los mejores plugins de WordPress de sitio en construcción y en mantenimiento he elegido es WP Maintenance Mode & Coming Soon a continuación vamos a ver como instalarlo y configurarlo.
Instalar WP Maintenance Mode & Coming Soon
Nos vamos a plugins > añadir nuevo y buscamos WP Maintenance Mode & Coming Soon y elegimos el que es de Themeisle y le damos a Instalar ahora y después a Activar
Configurar el contenido, diseño y las opciones del plugin WP Maintenance Mode & Coming Soon
A continuación nos vamos a Ajustes > WP Maintenance Mode y nos aparecerá el panel principal del plugin. Ahora para activarlo vamos a dejarlo de la siguiente forma y a continuación te digo los motivos.
Para activar el modo de página en construcción o mantenimiento le damos a activar, le damos a ‘Sí’ a Evitar para los robots de búsqueda, esto es mejor para el SEO ya que los motores de búsqueda no verán la página en mantenimiento, de todas formas si la página tiene contenido indexado y posicionado los mejor es que esté en construcción o mantenimiento el menor tiempo posible.
En la pestañan Diseño ponemos el titulo, el encabezado y el contenido del mensaje. Yo para el diseño le vamos a poner todas las letras en blanco de esta forma:
En fondo elegimos Fondo Predeterminado y elegimos el fondo que mas nos guste de los fondos que aparecen, yo en este caso voy a elegir uno oscuro para que las letras blancas se vean bien y le damos a Guardar ajustes.
Y para terminar en la pestaña módulos podemos activar la cuenta a tras, redes sociales y formulario de contacto. Con esto ya tendremos hecho la página en construcción o mantenimientos, para ver el resultado tienes que poner tu web en modo incognito del navegador, ahora puedes ver el resultado:
Bueno ya puedes ver lo fácil que es hacer una página en construcción con WordPress, la personalización queda a tu cuenta. Para desactivarlo solo lo tienes que darle a desactivar en el estado del panel principal del plugin.
Crear una pagina en construcción HTML
Si aun no tienes nada en tu web o estas haciendo un desarrollo a medida lo mas sencillo es poner una simple pagina en construcción con HTML en tu web. Para ello nos vamos a basar un una plantilla básica y te voy a decir como configurarla. Los pasos son los siguientes:
Descargar plantilla página en construcción básica
- Nos vamos aquí y entraremos en GitHub en el proyecto que he creado de una plantilla básica
- A continuación vamos al boton code y a download zip
Esto nos descargará un archivo zip el cual tenemos que descomprimir en una carpeta
Editar la plantilla de página en construcción
- Ahora vamos a editar la plantilla para ello solo tienes que abrir en el archivo index.html
- Editamos el porcentaje de progreso que quieras para esto hay que editarlo en 3 sitio y puedes verlo en las siguientes imágenes:
- Ahora editamos el titulo con el nombre de tu empresa o sitio web y la descripción si queremos, si nos apetece en la descripción podemos poner un email de contacto un teléfono o la fecha de apertura del sitio web
- Para terminar vamos a cambiar el logo.png por el de nuestra empresa/web por defecto trae una imagen de “sitio en construcción” con lo cual si no quieres poner el logo no tiene por que ponerlo la imagen es de dimensiones 1250px X 938px pero si tu logo tiene otras dimensiones cambia la linea del index.html donde poner aspect-ratio: 1250 / 938; por el de las dimensiones de tu logo.
Sube el contenido a tu página web
Para terminar sube los archivos a la raíz de tu proyecto por FTP, si no sabes como lo puedes ver el el artículo como configurar el cliente de Filezilla
Para terminar te voy a poner un video muy interesante de como hacer una página de construcción con html5 fácilmente el método es parecido al que hemos visto anteriormente pero con otro enfoque
Ahora que sabes como editar o crear una plantilla de en construcción te recomiendo que el eches un vistazo a el artículo de las mejores plantillas de páginas en construcción
Poner página en construcción en Prestashop
Si estás montando una tienda online en Prestashop y necesitas ponerla en modo mantenimiento o en construcción, te recomiendo que le eches un vistazo al artículo de activar modo mantenimiento en Prestashop 1.7