Page Builder en WordPress

Page builder es un plugin generador de páginas para WordPress gratuito el cual facilita crear el contenido de un sitio web mediante filas y columnas (Navarro, sf).

De esta manera, estas pueden ser maquetadas y posteriormente se pueden añadir widgets según sea necesario (Navarro, sf).

Por otro lado, este permite arrastrar bloques de contenido como lo son de texto, imágenes, vídeos, haciendo más sencilla la generación de contenido (Navarro, sf).

Cabe destacar que, se pueden utilizar todos los widgets que por defecto contiene WordPress, así como los propios de Page Builder (Navarro, sf).

Page Builder el constructor que no requiere conocimientos de programación

Continuando, Page Builder no requiere tener conocimientos en algún lenguaje de programación ya que este sustituye o complementa el editor estándar (Osman, 2022).

Además, contiene varios elementos de construcción personalizables que pueden ser añadidos mediante la función de arrastrar y soltar (Osman, 2022).

De esta manera, al utilizar este constructor se realiza una creación más rápida de “mockups” o maquetas para la fase de planeación de un sitio web (Osman, 2022).

Por lo tanto, este proceso acelera de forma significativa ya que incluso se pueden crear diferentes alternativas para mostrar sobre el sitio web (Osman, 2022).

Adicionalmente, permite la posibilidad de crear plantillas reutilizables, es decir, permite interactuar con plantillas ya prediseñadas.

De tal manera que, es posible crear y utilizar una plantilla con bloques diseñados de manera estratégica para mostrar diferentes tipos de contenido (Osman, 2022).

De esta forma, es más ágil editar el sitio web y permite realizar un cambios de manera escalable sin tener que codificar (Osman, 2022).

Tipos de Page Builder

A continuación, se presenta una breve lista de diferentes tipos de page builders que se encuentran disponibles y son compatibles con WordPress.

WPBakery Page Builder

Es un constructor de páginas para frontend y backend que permite crear diseños responsivos (Osman, 2022).

Adicionalmente ofrece múltiples plantillas flexibles y adaptables a las necesidades de diferentes tipos de sitios web.

Entre estas ofrece más de 250 integraciones con otros plugins relevantes como lo es WooCommerce (Osman, 2022).

Visual Composer Website Builder

Permite modificar no sólo el contenido sin ningún conocimiento de programación, sino también otras áreas de diseño del sitio WordPress como el pie de página o la cabecera (Osman, 2022). 

Cabe destacar que, está disponible bajo un modelo de suscripción a partir de 59 dólares anuales y soporta la edición de CSS y JavaScript (Osman, 2022).

Elementor

Es uno de los constructores de página web más populares del mercado el cual cuenta con más de 80 elementos de diseño personalizables, además, permite más de 100 Widgets, más de 300 plantillas listas para importar y  personalizar bajo el diseño responsive (Simões, 2021).

Beaver Builder

Ofrece un plugin page builder y un theme framework para que los desarrolladores puedan crear rápidamente sitios web y condensar su flujo de trabajo.

Además, se centra en el rendimiento y la estabilidad del sitio web ya que establece los diseños directamente a través de HTML y CSS (Osman, 2022). 

Por otro lado, cuenta con asistencia para shortcodes, widgets y WooCommerce, cuenta con 

soporte técnico completo, no crea shortcodes, sino código HTML y CSS claro (Osman, 2022). 

Themify Vuilder

Este constructor ofrece una descarga gratuita de su plugin utilizable en cualquier tema que se escoja para el sitio web así como cuenta con más de 40 diseños prediseñados, cuenta con asistencia para diseños de filas, columnas y cuadrículas, permite crear piezas de diseño así como cuenta con más de 60 efectos de animación (Osman, 2022). 

Divi Builder

Divi Builde permite construir sitios web enteros de forma visual y también se basa en la función de arrastrar y soltar elementos para facilitar la reorganización (Osman, 2022). 

Además, ofrece un módulo tipo esquema de página también llamado “wireframe” el cual es una vista especial en la que el posicionamiento del mismo funciona mucho más fácilmente (Osman, 2022). 

Continuando, cuenta con más de 40 módulos de diseño, 800 paquetes de diseño de sitios web prediseñados y contiene opciones de estilo CSS (Osman, 2022). 

SiteOrigin Page Builder

Prosiguiendo, SiteOrigin es otro editor famoso drag and drop famoso gratuito y receptivo el cual cuenta con una interfaz gráfica sencilla e intuitiva, tiene compatibilidad con la mayoría de temas de WordPress así como funciona de manera correcta con todos los widgets estándar de WordPress y permite la edición en vivo del frontend (Osman, 2022). 

WP Page Builder

WP Page Builder está enfocado para desarrolladores aunque sin embargo no hace falta tener amplios conocimientos en un lenguaje de programación, este permite crear páginas web mucho más optimizadas para móviles y con una amplia capacidad de respuesta, cuenta con diferentes plantillas y bloques predefinidos, permite la asistencia por widgets y es cuenta con personalización de fuentes, estilos, colores y diseños (Osman, 2022). 

Funcionamiento Page Builder en WordPress

Continuando, como se mencionó anteriormente existen diferentes tipos de Page Builder compatibles con WordPress, para el caso práctico que se va a presentar a continuación se realizará la explicación sobre el Page Builder llamado SiteOrigin Page Builder (Smith, 2022).

Cabe destacar que SiteOrigin es gratuito, aunque también ofrece su versión Premium, así como cuenta con un editor en vivo, que permite observar las modificaciones realizadas en tiempo real así como permite editar o incorporar páginas mediante el backend de WordPress (Smith, 2022).

Por otro lado, SiteOrigin cuenta con más de 20 plantillas prediseñadas que se pueden importar y editar fácilmente.

De esta manera se brinda una idea mucho más amplia si no se tienen conocimientos previos en construcción de sitios web.

Continuando, para obtener las plantillas, se debe ingresar a la sección de configuración de plantillas de páginas que se encuentra en la sección de “Apariencia”

Posteriormente en la configuración de plantillas de páginas facilita la forma de modificar la configuración de diversas páginas.

Edición Sitio Web

También, para realizar la edición de la página seleccionada, se debe navegar hasta la página en el personalizador usando el menú en el apartado de apariencia o los enlaces visibles y al entrar, aparecerá la sección de configuración de la página correspondiente (Smith, 2022).

Prosiguiendo, SiteOrigin cuenta con una colección de Widgets enfocados en hacer creaciones útiles y agilizar la creación del sitio web, entre los cuales se encuentran:

• Pestañas: Muestra información en pestañas horizontales que se pueden personalizar títulos, paneles y colores.
• Botón: Incorpora botones en páginas o barras laterales y enlaces en cualquier página de forma sencilla.
• Masonry: Permite la elaboración de mosaicos de imágenes distribuidas en una cuadrícula.
• Editor: Permite editar contenidos usando el predeterminado de WordPress, editor TinyMCE.
• Reproductor de vídeo: Muestra vídeos que se encuentran en tu web y vídeos externos.
• Imagen: Incluir una imagen en WordPress es totalmente fácil y se puede personalizar.

Finalmente, para incorporar los widgets al sitio web realmente se estarán incorporando bloques de contenido que se usan para incorporar elementos a la página y se debe hacer de la siguiente manera (Smith, 2022).

Primeramente se debe seleccionar una celda de fila o columna, posteriormente se presiona el botón “Agregar Widget” para seleccionar con cuál elemento se realizará el diseño (Smith, 2022).

Posteriormente cuando se incluya el widget, este se deberá seleccionar y de ese modo se puede comenzar con la personalización y ver cómo funciona (Smith, 2022).

Autor: Andrés Felipe Murcia Naranjo

Editor: Carlos Iván Pinzón Romero

Código: UCCG-10-2

Universidad: Universidad Central

Fuentes

Navarro, G (s.f). Crear páginas a medida sin saber código con Page Builder. Gonzalonavarro.es.

https://gonzalonavarro.es/blog/page-builder/

Osman, M (2022). Comparación de los 16 page builders WordPress más populares. Raidboxes.

https://raidboxes.io/es/blog/wordpress/wordpress-page-builder/

Simões, C. (2021). WordPress: ¿Cuáles son los 3 mejores ‘page builders’? Itdo.

https://www.itdo.com/blog/wordpress-cuales-son-los-3-mejores-page-builders/

Smith, G. (2022). SiteOrigin Website Builder: Especificaciones, Precios y Opiniones. Hosting Victory.

https://hostingvictory.com/es/opiniones/siteorigin-website-builder/

SiteOrigin. (11 de mayo de 2016). Introducción a Page Builder [Video]. Youtube.

https://youtu.be/VxFerlEEx7U

Herbert, C. (2021). Best WordPress Page Builder? 85 WP Pros Have Their Say [Imágen]. What Say The Experts.

https://whatsaytheexperts.com/best-wordpress-page-builder/

Smith, G. (2022). SiteOrigin Website Builder: Especificaciones, Precios y Opiniones [Imágen]. Hosting Victory.

https://hostingvictory.com/es/opiniones/siteorigin-website-builder/

SiteOrigin. (2022). Page Templates [Imágen]. SiteOrigin.

https://siteorigin.com/pitch-documentation/page-templates/

SiteOrigin. (2022). Creador de páginas de SiteOrigin [Imágen]. SiteOrigin.

https://siteorigin.com/page-builder/