Castor Builder vs Divi 2022

Los editores de lo que ves es lo que obtienes (WYSIWYG) han sido un elemento básico en el software informático desde la década de 1970, pero en el mundo de WordPress, estamos viendo que cada vez más propietarios de sitios web cambian a creadores de páginas de arrastrar y soltar para ayudarlos a crear con estilo. publicaciones en blogs y páginas profesionales.

Esta adopción se ha intensificado desde que WordPress introdujo el nuevo editor de bloques llamado Gutenberg en WordPress 5.0 en 2018. Por supuesto, el Editor clásico todavía está disponible para aquellos que prefieren el antiguo editor visual.

El nuevo editor de bloques es de uso gratuito, cuenta con una interfaz fácil de usar y tiene muchos bloques de contenido útiles disponibles para su selección.

Me encanta la simplicidad del editor de bloques de WordPress, pero no se puede negar que es una solución básica. Sus bloques de contenido tienen pocas opciones de personalización y no hay un sistema de plantillas integrado. Esto restringe en gran medida lo que puede crear.

Si está buscando llevar su sitio web al siguiente nivel, le recomiendo usar una solución avanzada de creación de páginas de arrastrar y soltar, como Beaver Builder o Divi.

Estos complementos receptivos de WordPress le brindan un mayor control sobre cómo diseña las publicaciones de su blog, las páginas y los tipos de publicaciones personalizadas.

En este artículo, me gustaría mostrarle cómo se comparan estos complementos de creación de páginas para ayudarlo a ver cuál es el mejor para usted y sus proyectos.

Una versión liviana de Beaver Builder está disponible en WordPress.org, pero dado que a la versión gratuita le faltan muchas características, este artículo se centrará en la versión completa de Beaver Builder.

La interfaz del constructor de castores

Beaver Builder es un editor de interfaz que se puede iniciar desde algunas áreas diferentes en WordPress.

Cuando crea una nueva publicación de blog, página o tipo de publicación personalizada dentro del editor de bloques de WordPress, verá una opción para "Iniciar Beaver Builder" o "Usar el editor estándar".

El botón 'Iniciar Beaver Builder' no se muestra automáticamente en el editor de Gutenberg. Solo aparece cuando agrega un bloque Beaver Builder a su página.

Si el bloque Beaver Builder no está disponible, consulte la página de configuración de Beaver Builder para asegurarse de que el tipo de publicación correspondiente esté habilitado.

Beaver Builder también se puede iniciar desde el Editor clásico y la página de listado principal de publicaciones, páginas y tipos de publicaciones personalizadas.

Cuando inicie sesión, también verá una opción para modificar una página en la barra de administración de WordPress.

Cuando se carga Beaver Builder, verá un menú en el lado derecho que muestra los módulos disponibles. Aquí también se muestran las pestañas de filas, plantillas y diseños guardados.

Al hacer clic en el símbolo X de arriba, se cierra el menú, pero puede volver a cargar el menú haciendo clic en el símbolo + que ahora se muestra.

En la parte superior derecha de la página, verá un recordatorio de que su página ha sido editada y tiene cambios no publicados. Si hace clic en el botón Listo, se mostrarán opciones que le permitirán descartar su diseño, guardar el borrador o publicar su diseño.

El lado superior izquierdo de la página muestra la publicación, la página o el tipo de publicación personalizada que está editando. Al hacer clic en él, se cargará el menú de herramientas de Beaver Builder.

Hay muchas configuraciones y funciones escondidas en este menú.

Desde aquí, puede publicar su diseño, guardar el diseño como plantilla, duplicar el diseño, ver todas sus revisiones, consultar su historial de ediciones y más.

También se puede acceder a la configuración global y a la configuración de Javascript y CSS desde este menú, y la parte inferior del menú muestra accesos directos al área de administración de WordPress y las páginas de soporte.

A la derecha del menú de herramientas hay una campana de notificación que muestra actualizaciones de complementos y las últimas publicaciones del blog de Beaver Builder.

Para agregar un nuevo módulo o fila a su diseño, simplemente arrástrelo y suéltelo en el área del lienzo principal.

Varias configuraciones de columnas preconfiguradas están disponibles para filas junto con diseños de columnas guardados, filas guardadas y filas preconstruidas.

Una vez que haya agregado nuevas filas, se muestra un esquema de la estructura en su página. Puede arrastrar y soltar un módulo de contenido en cualquiera de estos cuadros.

En la parte superior izquierda de las filas y módulos, verá opciones para mover el elemento a otra parte de su diseño. La fila o módulo en cuestión también se puede duplicar o eliminar desde aquí.

Las filas y columnas tienen un botón de configuración y un botón de acciones que le permite restablecer el ancho de fila y columna.

Los anchos, colores, fondos, bordes y más se pueden ajustar en la pestaña de estilo del cuadro de configuración. Además de los márgenes y el relleno, la pestaña avanzada le permite restringir la visibilidad a los usuarios registrados y ajustar el punto de interrupción para los usuarios móviles.

Se necesita un poco de tiempo para familiarizarse con cualquier creador de páginas de WordPress, sin embargo, Beaver Builder es, sin duda, una de las soluciones más fáciles de aprender. También es uno de los más rápidos, con los cambios que haces cargando casi al instante.

Beaver Builder le permite diseñar cada aspecto de su diseño, pero como verá, Divi ofrece muchas más opciones de personalización al crear diseños.

La interfaz del constructor Divi

Elegant Themes usa la palabra Divi para describir tanto su popular tema de WordPress como su generador de páginas de arrastrar y soltar.

Esto causa un poco de confusión entre aquellos que son nuevos en Elegant Themes, razón por la cual a veces distinguen los productos llamando al diseño "Divi Theme" y al creador de páginas "Divi Builder".

Por ahora, me gustaría centrarme en Divi Builder. Este creador de páginas está incorporado en Divi Theme, pero también está disponible como un complemento de WordPress independiente para aquellos que quieran usarlo con otros temas de WordPress.

Una vez que Divi Builder esté activado, verá una opción para "Usar Divi Builder" cuando agregue una nueva publicación, página o tipo de publicación personalizada.

Esto iniciará el generador visual de frontend, pero también estará disponible un editor de backend llamado Legacy Builder.

Puede cambiar a Divi Builder en cualquier momento desde el editor de bloques predeterminado de WordPress.

Divi Builder también se puede iniciar desde las páginas principales de listado de publicaciones, páginas y tipos de publicaciones personalizadas.

Al igual que Beaver Builder, si ha iniciado sesión, verá una opción para habilitar Divi Builder desde la barra de administración de WordPress.

Los temas elegantes también tienen un bloque de diseño Divi.

Este bloque le permite insertar cualquier diseño Divi directamente en un diseño que haya creado con el editor de bloques predeterminado de WordPress.

Cuando inicie Divi Builder por primera vez, se le preguntará si desea crear un diseño desde cero, elegir un diseño prefabricado o clonar otra página que ya haya creado.

Si comienza desde cero, Divi Builder cargará su lienzo en blanco y mostrará un cuadro para insertar una nueva fila.

Hay 20 filas disponibles para seleccionar, y cada una tiene una estructura de columna diferente.

Una vez que haya insertado una fila, Divi Builder le pide que seleccione un módulo para agregar a su página.

Divi Builder luego carga el cuadro de configuración para el módulo que seleccionó.

Si eres nuevo en Divi Builder, te recomiendo que te familiarices con el funcionamiento del editor seleccionando un diseño prefabricado, ya que te da algo con lo que jugar.

Los usuarios experimentados pueden preferir comenzar con un lienzo en blanco, pero tenga en cuenta que el menú principal no se carga automáticamente cuando selecciona esta opción.

Para cargar el menú principal, haga clic en el botón con los tres puntos horizontales en la parte inferior de la página.

Las opciones del menú principal se dividen en tres columnas.

Puede cargar la configuración del constructor a través del ícono de tres puntos verticales en el lado izquierdo del menú.

Se pueden agregar tres modos de visualización diferentes a su menú desde aquí: modo de desplazamiento, modo de clic y modo de cuadrícula. Estos modos cambian la forma en que interactúa con su diseño y realiza cambios. Por ejemplo, en el modo de desplazamiento, simplemente pasar el cursor sobre una parte de su página resaltará módulos, columnas, filas y secciones, y luego podrá realizar modificaciones.

Otras configuraciones en el cuadro de configuración del constructor incluyen el modo de visualización predeterminado, el intervalo de estado del historial y el flujo de creación de páginas.

Si ha creado un diseño complejo, puede haber situaciones en las que se resalte la parte incorrecta de la página. Por ejemplo, es posible que desee mover una columna, pero accidentalmente selecciona la fila a la que pertenece.

Una forma de resolver esto es usar el modo de vista de estructura alámbrica. Esto elimina elementos de diseño innecesarios de su vista para ayudarlo a ver la estructura de su página más fácilmente. Es increíblemente útil cuando se mueven cosas dentro de un diseño complejo.

El lado izquierdo del menú también tiene opciones que le permiten ver su diseño en la vista de escritorio, tableta y dispositivo móvil.

Hay siete opciones en el menú central. El botón X en el medio cierra el menú.

A la izquierda, puede cargar un diseño de la biblioteca, guardar su diseño actual y borrar su diseño. A la derecha, puede ver la configuración de la página, el historial de edición y la portabilidad.

El cuadro de configuración de publicación/página le permite cambiar el título, el extracto, la imagen destacada y las categorías. Aquí también hay disponible una gran cantidad de configuraciones de diseño, como espaciado, paleta de colores, CSS personalizado y visibilidad.

El cuadro de historial de edición le permite deshacer y rehacer fácilmente los cambios recientes y ver un historial completo de todos los cambios que ha realizado.

Los diseños se pueden exportar e importar en formato JSON a través del cuadro de configuración de portabilidad. Esto es útil para transferir diseños a otros sitios web.

Su diseño se puede guardar y publicar en el lado derecho de la página.

Los tutoriales en video y los atajos de teclado también se pueden mostrar a través del cuadro Divi Helper en esta área. También hay una función de búsqueda que lo ayuda a encontrar funciones y documentación.

Las interfaces de usuario de Beaver Builder y Divi Builder funcionan de manera diferente, sin embargo, cuando se trata de ajustar filas y columnas, en realidad funcionan de manera similar.

Ambas soluciones muestran la configuración en la esquina superior izquierda y le permiten mover, duplicar y ajustar filas y columnas. Sin embargo, Divi tiene más opciones de personalización.

Divi Builder tiene un elemento encima de las filas, llamado secciones.

Las secciones pueden contener varias filas y cada fila puede contener varias columnas. Le da un poco de flexibilidad adicional con la forma en que construye las páginas.

En las versiones anteriores de Divi Builder, los diseños se creaban directamente desde el editor de WordPress; sin embargo, el generador visual de interfaz ahora es la forma estándar de crear diseños con Divi.

Afortunadamente, el antiguo editor todavía está disponible en Divi Builder.

Para activar Legacy Builder, primero debe ir a la sección avanzada del área de opciones del complemento Divi, deshabilitar la última experiencia de Divi Builder y habilitar el Editor clásico.

La interfaz de usuario de Legacy Builder se parece al modo de vista de estructura alámbrica que está disponible en el editor visual.

Si bien no le permite obtener una vista previa de los cambios que realiza en tiempo real, me encanta lo rápido y eficiente que es. Todo se carga un poco más rápido que en el editor frontend y es más fácil ver la estructura de tu página.

Beaver Builder carga todo un poco más rápido que Divi Builder, y su interfaz de usuario es más fácil de aprender, sin embargo, Divi Builder ofrece muchas más configuraciones de personalización y funciones adicionales que faltan en Beaver Builder.

Podría decirse que la inclusión del modo alámbrico y Legacy Builder hace que Divi Builder también sea una solución más flexible.

Para obtener una visión más completa de cómo funciona Divi Builder, consulte nuestra revisión completa de Divi Builder.

Diseños prefabricados de Beaver Builder

Soy un gran admirador de los diseños prefabricados, ya que reducen en gran medida el tiempo que lleva crear contenido elegante. También lo ayudan a comprender cómo crear diseños avanzados.

Beaver Builder no ofrece tantos diseños prefabricados como Divi, pero la calidad de cada plantilla es igual de alta.

Las plantillas de página de destino y las plantillas de página de contenido están disponibles en la pestaña de plantillas del menú de contenido principal junto con las plantillas guardadas que tenga.

Las plantillas de página de destino son plantillas completas de página completa. Hay un total de 15 plantillas de página de destino disponibles junto con una plantilla de página de lienzo en blanco.

Hay plantillas para pequeñas empresas, gimnasios, abogados, músicos, fotógrafos, restaurantes, libros electrónicos y más.

Cuando selecciona una plantilla de página de destino, se le pregunta si desea reemplazar su diseño existente o agregarlo al que ya tiene.

Los diseños prefabricados se insertan en su diseño en segundos.

Una vez que se hayan agregado, puede ajustarlos como mejor le parezca y guardarlos como plantillas personalizadas.

Las plantillas de página de contenido son plantillas universales para parte de una página que son adecuadas para cualquier tipo de sitio web.

Hay 25 plantillas de página de contenido disponibles. Hay diseños para ayudarlo a insertar un área, información del equipo, servicios, formulario de contacto, tablas de precios, formulario de registro y más.

Beaver Builder también ofrece docenas de filas preconstruidas. Estos diseños se pueden insertar fácilmente en cualquier parte de su página.

Los encontrará debajo de las pestañas de las filas del menú de contenido principal.

Si utiliza el sistema de plantillas de Beaver Builder, puede reducir considerablemente el tiempo que lleva crear nuevos diseños.

Los diseños se pueden guardar en cualquier momento y reutilizar tantas veces como desee.

Todas las plantillas guardadas se pueden administrar desde el menú de administración principal de Beaver Builder y se pueden editar más tarde si es necesario.

Puede guardar plantillas, filas, columnas y módulos, y cada diseño guardado se puede asignar a categorías.

Beaver Builder hizo un trabajo fantástico al integrar diseños prefabricados en su interfaz de usuario. Los diseños se pueden insertar en segundos y las personalizaciones se pueden guardar y usar una y otra vez.

Diseños prefabricados de Divi

Al igual que Beaver Builder, Divi ofrece a los usuarios una amplia variedad de diseños prefabricados.

Hay más de 1100 paquetes de diseño disponibles para su selección.

150 de estos diseños son paquetes de diseño que incluyen diseños para varias áreas de su sitio web, como su página de información, blog, página de destino y galería.

Como se señaló anteriormente, cuando inicia Divi Builder en una página nueva, una de las opciones disponibles es elegir un diseño prefabricado.

La Biblioteca Divi también se puede cargar desde el menú principal.

Divi Library le permite insertar diseños prefabricados, diseños guardados y páginas completas.

Puede restringir su búsqueda de un diseño adecuado utilizando el cuadro de búsqueda o seleccionando una de las 13 categorías a las que se asignan los diseños.

Asegúrese de guardar su diseño actual antes de insertar un diseño prefabricado, ya que Divi Builder lo sobrescribirá.

Los paquetes de diseño resaltan todos los diseños que se incluyen en el paquete, sin embargo, recomiendo hacer clic en el botón "Ver demostración en vivo" para ver exactamente cómo se verá su sitio web si selecciona un diseño.

Para ayudar a ilustrar este punto, eche un vistazo al área de demostración del diseño Divi Web Freelancer que se muestra en la siguiente captura de pantalla.

Según la configuración de su alojamiento, Divi Builder puede tardar hasta un minuto en importar todos los diseños en un paquete de diseño.

Una vez que haya insertado un diseño en su página, puede personalizarlo y personalizarlo cambiando colores, agregando módulos y eliminando secciones que no son relevantes para usted.

Los diseños se pueden guardar en la Biblioteca Divi en cualquier momento desde el menú principal de Divi.

Puede nombrar cada diseño y agruparlos en categorías.

El menú de administración de Divi enlaza con la página principal de opciones de complementos, Divi Theme Builder, Divi Library y algunas otras páginas de configuración (que discutiremos más adelante).

Divi Theme Builder es una herramienta fantástica que te permite crear plantillas de página personalizadas. Luego puede asignar las plantillas a publicaciones, páginas y tipos de publicaciones personalizadas.

Para cada plantilla, puede asignar un diseño al encabezado, cuerpo y pie de página. A continuación, puede especificar exactamente en qué áreas de su sitio web se deben utilizar estas plantillas.

Por ejemplo, puede crear un diseño único para su blog, pero excluirlo de ciertas categorías de publicaciones. También puede crear plantillas únicas para su página de resultados de búsqueda, página 404, archivos, página de inicio y más.

Todos los diseños guardados se pueden ver desde la página "Biblioteca Divi" que está vinculada en el menú principal de administración de Divi.

Los diseños se pueden importar y exportar desde esta página. También puede administrar sus categorías de diseño desde aquí.

Cuando hace clic para editar un diseño desde la página principal de la Biblioteca Divi, accederá a una descripción general de su diseño en el modo de vista de estructura alámbrica.

Este modo es útil para ajustar la estructura de su diseño, pero si desea realizar cambios más específicos, puede cambiar a la vista de escritorio, vista de tableta o vista de teléfono. Hacer esto le permite modificar su diseño guardado usando el editor visual.

Si lo prefiere, puede iniciar el editor visual de interfaz regular y realizar personalizaciones en la página misma.

Lado a lado, no creo que la calidad de los diseños prefabricados de Divi Builder sea mejor que los diseños que están disponibles en Beaver Builder, sin embargo, toda la configuración en Divi Builder es significativamente mejor.

Los paquetes de diseño de Divi Builder le brindan hasta una docena de plantillas para ayudarlo a crear un sitio web completo, mientras que Beaver Builder solo ofrece diseños de una sola página y diseños para secciones específicas de su página.

También hay muchas más opciones en Divi Builder, con el complemento que ofrece 950 plantillas de página de destino frente a las 15 de Beaver Builder. También hay disponible una gran selección de diseños de terceros para Divi.

Sin embargo, es importante tener en cuenta que Beaver Builder tiende a insertar diseños en su página un poco más rápido que Divi Builder.

Consulte la página Diseños de Divi para ver qué diseños prefabricados están disponibles con Divi Builder.

Módulos de contenido de Beaver Builder

Hay un total de 29 módulos disponibles en Beaver Builder. Los módulos se dividen en seis categorías: Básico, Medios, Acciones, Diseño, Información y Publicaciones.

Hay una buena variedad de módulos para agregar contenido enriquecido, ajustar su diseño y extraer contenido de su blog.

Uno de los módulos en la categoría de diseño es el módulo de la barra lateral, que le permite insertar widgets de WordPress. Esto abre muchas posibilidades para integrar la funcionalidad en sus diseños desde otros complementos de WordPress.

Cuando un módulo se ha arrastrado y soltado en el área de su lienzo, aparecerá su cuadro de configuración.

Encontrará configuraciones comunes en todos los módulos para estilo, espaciado, visibilidad, animaciones y más, sin embargo, cada módulo tiene configuraciones únicas que le permiten cambiar lo que se muestra.

Por ejemplo, en el módulo de mapa, hay campos para ingresar la dirección del mapa, la altura del mapa y el atributo del título del mapa.

Beaver Builder no tiene la mayor colección de módulos de contenido y no ofrece tantas opciones de personalización como Divi.

Sin embargo, creo que Beaver Builder tiene todo lo que necesita para crear hermosos diseños, ya que la funcionalidad que falta se puede insertar en los diseños a través de los widgets de WordPress.

Módulos de contenido de Divi Builder

38 módulos de contenido están disponibles para su selección en Divi Builder.

Además de los módulos esenciales, como imagen, video, portafolio y testimonio, hay módulos útiles para agregar contadores de barras, anuncios publicitarios, controles deslizantes y llamados a la acción.

Divi Builder también agrega un nuevo tipo de publicación personalizada para proyectos.

Al igual que Beaver Builder, Divi tiene un módulo de barra lateral para que pueda integrar widgets de WordPress en sus diseños.

Divi Builder utiliza un sistema codificado por colores para ayudarlo a crear diseños elegantes.

Las secciones son azules, las filas son verdes y los módulos son gris oscuro (casi negro).

Puede agregar un nuevo módulo pasando el cursor sobre una columna y haciendo clic en el botón "Agregar nuevo módulo".

Como mostré anteriormente, cuando selecciona un módulo, el cuadro de configuración del módulo aparecerá automáticamente para que pueda ingresar valores y ajustar el estilo.

Cualquier personalización que realice se puede guardar en la Biblioteca Divi. Esto puede ahorrarle mucho tiempo al crear páginas.

Por ejemplo, podría modificar el módulo de mapa para que muestre un mapa de la dirección de su empresa. Luego puede guardar fácilmente el mapa e insertarlo en su página de información, formulario de contacto, publicaciones de blog y más.

Divi Builder ofrece más opciones de estilo y personalización que Beaver Builder y tiene nueve módulos de contenido adicionales, pero no creo que nadie se sienta restringido con lo que está disponible en cualquiera de los complementos de WordPress, particularmente porque los widgets de WordPress se pueden insertar en diseños usando el módulo de barra lateral.

Configuración de Beaver Builder

El cuadro de configuración global se puede cargar desde el menú de herramientas dentro de la interfaz de usuario de Beaver Builder.

Le permite habilitar y deshabilitar el encabezado de página y los márgenes y el relleno de filas, columnas y módulos. Los diseños receptivos también se pueden ajustar desde esta área, y hay cuadros para insertar código CSS y Javascript.

La página principal de configuración de Beaver Builder está dividida en varias secciones.

Para recibir actualizaciones automáticas de complementos, debe ingresar su clave de licencia en la sección de licencia. Los módulos y tipos de publicaciones se pueden habilitar y deshabilitar en la siguiente sección.

El acceso al sistema de plantillas se puede ajustar en la siguiente sección. Puede habilitar plantillas principales, plantillas de usuario o todas las plantillas. Las plantillas también se pueden desactivar.

El área de configuración de acceso de usuario le permite definir qué grupos de usuarios de WordPress pueden usar Beaver Builder. Los permisos se dividen en cinco áreas diferentes, como el acceso al constructor y al menú de administración de Beaver Builder.

La página de configuración general también le permite habilitar y deshabilitar conjuntos de iconos, marcas de complementos, marcas de temas y configuraciones de ayuda. El almacenamiento en caché y la depuración están disponibles en la sección de herramientas.

Recomiendo consultar la página de configuración de Beaver Builder después de instalar Beaver Builder, pero la mayor parte de la personalización que realizará tendrá lugar dentro de la interfaz principal de Beaver Builder.

Configuración de Divi Builder

Al igual que Beaver Builder, dedicará la mayor parte de su tiempo a personalizar diseños dentro del propio editor de Divi Builder, pero hay algunas configuraciones importantes que se pueden encontrar en el menú principal de administración de Divi.

La página principal de opciones del complemento tiene una pestaña para ingresar su nombre de usuario y clave API de Elegant Themes. Debe completar esto para recibir actualizaciones automáticas de complementos.

En la siguiente pestaña, puede ingresar su clave API de Google. Esto es necesario si desea utilizar el módulo de mapas. Las fuentes de Google también se pueden deshabilitar desde esta página.

La siguiente pestaña le permite habilitar y deshabilitar Divi Builder para tipos específicos de publicaciones de WordPress. Esto es útil si desea restringir el acceso a Divi Builder para ciertos tipos de publicaciones, como su galería.

En la pestaña avanzada, puede habilitar y deshabilitar la minificación de CSS y Javascript. Aquí también es donde puede habilitar el editor Legacy Builder.

Divi Builder le brinda control total sobre lo que cada grupo de usuarios en su sitio web puede y no puede hacer.

Mientras que Beaver Builder le permite restringir el acceso a algunas áreas clave, Divi Builder le permite definir exactamente a qué funciones pueden acceder los usuarios.

Por ejemplo, puede evitar que los usuarios carguen diseños o deshabiliten funciones dentro de Divi Builder.

El centro de soporte de Divi proporciona un informe sobre su sistema. Esto puede ayudarlo a diagnosticar cualquier problema con la configuración de su alojamiento.

Por ejemplo, para mi sitio web de prueba de WordPress, el informe mostró que mi instalación de WordPress tenía una cantidad limitada de recursos.

El acceso remoto también está disponible en esta página. Esto puede ayudar al equipo de soporte de Elegant Themes a resolver cualquier problema que tenga con Divi Builder.

El centro de soporte también tiene enlaces a tutoriales en video útiles, y hay un modo seguro que desactiva funciones que podrían causar problemas con otros complementos y temas de WordPress.

Los errores también se muestran en esta página si WP_DEBUG_LOG está habilitado.

Divi Builder es un complemento de WordPress simple de configurar, con solo unas pocas configuraciones para verificar después de la instalación.

La característica destacada en el área de configuración es el Editor de roles Divi. Es algo que los propietarios de grandes sitios web de WordPress con varios empleados apreciarán.

El tema del constructor de castores

Beaver Builder Theme es un marco HTML5 y Bootstrap WordPress que se incluye en los planes Beaver Builder Pro y Agency.

Es un diseño mínimo de WordPress que actúa como un lienzo en blanco para crear diseños con Beaver Builder. Hay ganchos y filtros disponibles dentro del tema para ayudar a los desarrolladores a modificar el diseño del sitio web, y tiene un gran soporte para WooCommerce.

Todas las configuraciones para Beaver Builder Theme están contenidas dentro del Personalizador de WordPress.

El estilo y la posición se pueden ajustar para docenas de áreas de su página. También hay diseños para su encabezado, menú de navegación, blog, archivos, publicaciones de blog, páginas de WooCommerce y pie de página.

Si bien en esencia, Beaver Builder sigue siendo un tema mínimo de WordPress, los desarrolladores han hecho un esfuerzo adicional para agregar muchas opciones de personalización adicionales.

Tome el logotipo de su sitio web, por ejemplo. Puede cargar una imagen de logotipo normal, una para dispositivos retina, logotipos de aparición gradual para dispositivos normales y dispositivos retina, y otro logotipo para dispositivos móviles.

En muchos otros temas de WordPress, diferentes partes del diseño, como el encabezado, la barra lateral y el pie de página, pueden impedir que Beaver Builder muestre los diseños correctamente. Esta es la razón por la que muchos usuarios de Beaver Builder se han cambiado al tema de Beaver Builder.

Es una excelente opción si desea utilizar los diseños de Beaver Builder en su sitio web.

El tema Divi

Beaver Builder comercializa su diseño como un tema marco para Beaver Builder, mientras que Elegant Themes comercializa Divi Theme como un tema versátil todo en uno de WordPress.

Esto destaca cuán influyente puede ser el marketing, ya que hay más similitudes entre Beaver Builder Theme y Divi Theme de lo que la gente piensa.

Al principio, Divi era un tema de WordPress todo en uno, sin embargo, la mayor parte de la versatilidad que todos asociaron con Divi Theme se migró más tarde a Divi Builder. Sin duda, esto era lo correcto.

Entonces, con la mayoría de las funciones incorporadas en Divi Builder, Divi Theme puede considerarse un marco como Beaver Builder Theme. Por lo tanto, si posee ambos productos, puede usar Divi Theme con Beaver Builder o Beaver Builder Theme con Divi Builder.

Una vez que Divi Theme se haya activado, verá algunos cambios sutiles en el menú de administración de Divi.

Esto incluye que la página de opciones del complemento se reemplace con una página de opciones de tema y un enlace al Personalizador de WordPress.

Aparte de la expansión del área de configuración, todo lo demás permanece igual.

Curiosamente, si Divi Theme está activado, el complemento Divi Builder se desactivará automáticamente. Esto es necesario ya que la funcionalidad de Divi Builder está integrada directamente en Divi Theme (y en el tema adicional de WordPress de Elegant Themes).

Encontrará cientos de opciones útiles dentro del Personalizador de WordPress, repartidas en una docena de secciones. Estos se pueden usar para controlar áreas como el encabezado, el pie de página y las barras laterales.

El área de contenido principal para publicaciones, páginas y tipos de publicaciones personalizadas todavía está controlada por Divi Builder.

Cuando se trata de personalizar el diseño de su sitio web, no creo que Divi Theme sea mejor o peor que Beaver Builder Theme. Hay algunas áreas en las que Divi Theme le brinda más opciones y algunas áreas en las que Beaver Builder Theme brinda más.

Todas las opciones de complementos de Divi Builder se han integrado en el área de opciones más extensa de Divi Theme.

Por ejemplo, la configuración del tipo de publicación ahora está disponible en la pestaña del creador y las opciones de la página de configuración avanzada ahora se encuentran en la página de opciones generales.

La página de configuración general también tiene campos para íconos de redes sociales, desplazamiento, código CSS personalizado y más.

También hay opciones adicionales disponibles para los usuarios de Divi Theme.

Hay un área de opciones dedicada para el menú de navegación de su sitio web y una página de diseño donde puede indicar qué funciones deben habilitarse en publicaciones y páginas.

También hay páginas para agregar un banner de 468 × 60 píxeles y detalles generales de SEO sobre su sitio web.

Al igual que Beaver Builder Theme, Divi Theme es un tema mínimo de WordPress que ha sido optimizado para su uso con Divi Builder.

Recomiendo encarecidamente usar este diseño si desea aprovechar la amplia gama de diseños prefabricados de Divi.

El costo de Beaver Builder

Las características y la funcionalidad son dos factores que debe considerar al revisar Beaver Builder y Divi, sin embargo, también debe considerar el costo de estos productos y el presupuesto que tiene disponible para sus proyectos.

Muchas empresas premium de WordPress cobran más por usar sus productos en sitios web adicionales. Por ejemplo, el plan básico puede admitir un sitio web, el plan intermedio puede admitir tres sitios web y el plan avanzado puede admitir diez sitios web.

Beaver Builder y Elegant Themes son más generosos y ofrecen soporte y actualizaciones para una cantidad ilimitada de sitios web.

Si bien este artículo se ha centrado principalmente en la versión premium de Beaver Builder, aún recomendaría consultar Beaver Builder Lite.

Es una buena solución para sitios web simples y también te ayuda a ver cómo funciona la interfaz de Beaver Builder.

Tenga en cuenta, sin embargo, que la versión gratuita de Beaver Builder carece de módulos útiles como el formulario de contacto, la tabla de precios y el mapa. There is no access to the Beaver Builder templating system or pre-made layouts either.

For the vast majority of projects, the full version of Beaver Builder is a better fit than the lite version.

Three different premium plans are available: Standard, Pro, and Agency. All plans come with one year of premium support and access to premium modules and templates.

The standard plan retails at $99 per year. To get WordPress multisite support and access to the Beaver Builder Theme, you need to upgrade to the $199 per year Pro plan.

The $399 per year Agency plan adds white labeling. Web design companies may be interested in this plan as it allows you to rebrand the plugin as your own and change all references to Beaver Builder in templates and the admin area.

Beaver Builder ofrece una garantía de devolución de dinero de 30 días.

Todos los miembros de Beaver Builder también reciben un 40 % de descuento después de un año. Esto reduce el precio de los planes de Beaver Builder en los años siguientes a $59,40 por año, $119,40 por año y $239,40 por año.

Si no está seguro acerca de algún aspecto del uso de Beaver Builder, le recomiendo consultar su base de conocimiento detallada. También puede solicitar ayuda a través del soporte de tickets y en el foro de la comunidad de Beaver Builder, el grupo de Facebook de Beaver Builder y la sala de Slack de Beaver Builder.

El costo de Divi

La política de precios de una membresía de Elegant Themes es más sencilla.

Hay dos planes disponibles, y ambos te dan acceso completo a todos los productos de Elegant Themes.

La membresía anual de Elegant Themes cuesta $ 89 por año.

Al igual que Beaver Builder, puede continuar usando productos como Divi Builder una vez que su membresía haya expirado; sin embargo, no recibirá soporte ni actualizaciones si no renueva.

Si cree que renovará su membresía por algunos años, puede considerar obtener el plan de acceso de por vida. Por una tarifa única de $ 249, recibirá acceso, soporte y actualizaciones de por vida para todos los productos de Elegant Themes.

Elegant Themes también ofrece una garantía de devolución de dinero de 30 días a todos los nuevos clientes.

Para ayudarlo a comprender mejor sus productos, Elegant Themes ha creado una de las áreas de documentación más extensas que he visto. Hay cientos de tutoriales escritos y tutoriales en video que explican cómo funcionan los temas y complementos de Elegant Themes WordPress.

Los miembros también pueden solicitar ayuda a través del soporte de tickets, y también hay un gran foro comunitario, una red Meetup y un popular grupo de Facebook.

Comparar el costo de Beaver Builder y Divi es difícil ya que tienen modelos de precios ligeramente diferentes.

A pesar de ser más limitado, agradezco el hecho de que esté disponible una versión gratuita de Beaver Builder, ya que Beaver Builder Lite es suficiente para blogs básicos y proyectos de sitios web simples.

Sin embargo, creo que la versión completa de Beaver Builder es la mejor opción para la mayoría de los usuarios de WordPress.

A $ 99, una licencia estándar para Beaver Builder cuesta $ 10 más que Elegant Themes, sin embargo, las renovaciones posteriores cuestan solo $ 59.40 por año.

Este es un descuento generoso para los miembros leales, sin embargo, un plan de por vida de Elegant Themes puede terminar siendo más barato para muchos propietarios de sitios web.

Una membresía de Elegant Themes también incluye Divi Theme, mientras que deberá pagar $ 199 para obtener acceso a Beaver Builder Theme.

Más importante aún, una membresía de Elegant Themes incluye cinco productos de alta calidad: Divi Theme, Divi Builder, el tema de la revista de WordPress Extra, el complemento de WordPress con opción de correo electrónico Bloom y el complemento de WordPress para redes sociales Monarch.

Debido a esto, creo que una membresía de Elegant Themes ofrece una mejor relación calidad-precio para la mayoría de los usuarios de WordPress.

Pensamientos finales

Los creadores de páginas de arrastrar y soltar pueden ayudar a los usuarios de WordPress a crear hermosos diseños de sitios web en minutos a través de una interfaz fácil de usar.

En un artículo de comparación como este, es mi responsabilidad mostrar las fortalezas y debilidades tanto de Beaver Builder como de Divi; sin embargo, es importante recordar que ambas soluciones son productos refinados y que existen muchas similitudes entre ellas.

El proceso de creación de nuevas filas y columnas es similar en ambos productos, pero creo que la interfaz de Beaver Builder es más fácil de aprender y un poco más rápida también.

Divi ofrece muchas más opciones de personalización y más diseños prefabricados. Con cinco productos incluidos en una membresía de Elegant Themes, diría que también ofrece una mejor relación calidad-precio.

Espero que hayas disfrutado de nuestra mirada en profundidad a Beaver Builder y Divi.

Para obtener más información sobre Beaver Builder, consulte la página de ventas oficial o lea nuestra reseña completa de Beaver Builder. También puede comprender mejor cómo funciona Beaver Builder visitando la página de demostración de Beaver Builder o probando la versión gratuita del complemento.

Puede obtener información sobre cómo funciona Divi en el sitio web de Elegant Themes y en nuestra revisión completa de Divi Builder. Si bien no hay disponible una versión gratuita de Divi Builder, puede probar el complemento en la página de demostración de Divi Builder. Esto te ayudará a ver lo que Divi Builder puede hacer.

Gracias por leer.
Kevin