Nuthost

Diseñar un Sitio Web con WordPress y Elementor

¿Por qué diseñar un Sitio Web con WordPress y Elementor?

Sabemos que WordPress es la opción más elegida a la hora de crear un Sitio Web. Lo dificil es crear una Web perfecta para cualquier proyecto.

Muchos usuarios no tienen conocimientos de programación, por ello existen muchísimos plugins llamados «maquetadores visuales» que permiten realizar modificaciones importantes sin conocimientos de código.

Una vez que se instala WordPress en el Hosting contratado (Ver planes de Hosting para WordPress) se procede con la instalación del theme elegido pero luego de instalado hay que modificarlo.

Los usuarios que no tienen conocimientos de código pueden recurrir a los «maquetadores visuales» que permiten realizar el diseño de un Sitio Web arrastrando elementos desde un menú a la misma página.

Los maquetadores visuales para WordPress son plugins y, si bien existen varios, nos enfocaremos en uno llamado Elementor Page Builder.

¿Qué es Elementor?

Elementor es un plugin gratuito que permite ir construyendo un Sitio Web en tiempo real arrastrando y soltando bloques o widgets en una página en blanco. Este tipo de plugins permiten que usuarios inexpertos puedan crear cualquier tipo de página.

Ventajas de Elementor

  • Es gratuito: Existe una versión de pago pero la básica cuenta con la mayoría de las funcionalidades.
  • Rápido: Su código es muy limpio, con lo cual los tiempos de carga de las páginas son muy cortos.
  • Drag & Drop: Cuenta con una interfaz tan simple que permite tomar los elementos deseados, arrastrarlos al editor y listo!
  • Muchísimos widgets: Cuenta con todos los elementos fundamentales que se utilizan en el diseño web: botones, iconos, divisores, videos, etc.
  • Editor en tiempo real: Todos los cambios que se realizan se observan sobre la marcha.
  • Multidiomas: Se encuentra traducido a más de 10 idiomas.

¿Cómo diseñar un Sitio Web con WordPress y Elementor?

Elementor trabaja directamente en el editor de WordPress. Al trabajar con este plugin veremos una interfaz muy simple: los elementos de diseño a la izquierda junto con los ajustes y a la derecha la vista de los cambios en tiempo real.

Al abrir el constructor del plugin se verá la pantalla de edición del sitio con 2 opciones: Añadir nueva sección o Añadir plantilla. Seleccionando la opción 1 se creará una página web desde cero, mientras que la opción Añadir plantilla subirá un tema prediseñado que luego se podrá personalizar.

Las páginas creadas con Elementor se componen de secciones, columnas y widgets. Las secciones dividirán las páginas en filas horizontales, las columnas en las verticales y los widgets se utilizan dentro de las columnas.

Haciendo clic en una sección visualizaremos las opciones de configuración «Columna y Sección«. Al configurar el aspecto general de una sección, haciendo clic sobre la opción correspondiente visualizaremos las opciones «Disposición, Estilo y Avanzado» que cumplen las siguientes funciones:

  • Disposición: Establece el ancho del contenido, espacio entre columnas, posición del contenido, etc.
  • Estilo: Incluye las opciones de fondo, borde y tipografía de cada sección.
  • Avanzado: Configura el «padding» (relleno) de cada sección y el margen fuera de ella, además de permitir añadir una animación de entrada a cada sección de la página.

Los campos de «Columna y Sección» contienen una pestaña Responsive para administrar de forma rápida el contenido que aparecerá en pantallas de diferente tamaño.

El constructor web, también permitirá deshacer cambios aplicados o volver a versiones guardadas anteriormente desde la pestaña «Historial».

En conclusión, Elementor permite crear un Sitio Web de manera sencilla, con una interfaz visual muy intuitiva y sin conocimientos de programación.

Acerca de 
Web
Diego Medrano es el Coordinador General de Soporte Técnico en Nuthost. Trabaja en la empresa desde 2014. Comenzó su carrera en la empresa como soporte técnico de primer nivel, dedicándose a brindar asistencia experta y personalizada a los clientes. Su responsabilidad principal era resolver problemas técnicos de manera eficiente, asegurando una experiencia de usuario excepcional. Manejó consultas y problemas relacionados con el alojamiento web, garantizando la disponibilidad y el rendimiento óptimo de los servicios. Su compromiso y habilidades lo llevaron a asumir roles de mayor responsabilidad, y hoy lidera el equipo de soporte técnico