7 Características de Beaver Builder que los desarrolladores deben conocer

Los creadores de páginas están diseñados para hacer sitios web fáciles para cualquier persona, incluso para principiantes de WordPress. Sin embargo, Beaver Builder también tiene algunas funciones para los desarrolladores, para aliviar su vida y sus clientes en este artículo, le presentaremos algunas funciones fuertes que puede no conocer, lo que hace que Beaver Builder sea una herramienta fantástica para los desarrolladores web. ¡Vamos a bucear! Por qué Beaver Builder es una poderosa herramienta de desarrollador, aunque Beaver Builder está diseñado para facilitar la creación de la página, todavía incluye muchas funciones para desarrolladores y otros usuarios avanzados.
Es lo mejor de ambos mundos, una interfaz de tipo de arrastre simple para crear modelos básicos, junto con la capacidad de usar un código personalizado para implementar funciones más complejas. Los desarrolladores pueden usar estas técnicas avanzadas para crear una página o sitio web, luego enseñarles a los clientes para ajustar y mantener el editor que ve es lo que obtiene (Wysiwyg). Al poner a Beaver Builder en manos de los propietarios del sitio, puede minimizar el tiempo que tiene que gastar ayudándoles a crear contenido. También es posible guardar plantillas y elementos personalizados que cree para usar en proyectos futuros. Esto ayuda a acelerar significativamente el desarrollo, para que pueda atraer más clientes y aumentar sus ingresos.
La flexibilidad de ser tan simple o tan compleja como lo necesite, hace que Beaver Builder sea una herramienta extremadamente poderosa incluso para los desarrolladores web más experimentados. Hay docenas de diferentes formas de incorporarlo en el flujo de trabajo y mejorar su negocio. Beaver Builder funciona que ayudan a los desarrolladores, ya sea que desee aumentar su productividad o si desea intentar implementar nuevos elementos en un proyecto futuro, Beaver Builder puede ayudarlo. Podemos clasificar estas características de la siguiente manera: Funciones para personalizar sus modelos en Beaver Builder
1. Vista previa y configuración de diseño receptivo
2. Códigos cortos para modelos, filas, columnas y módulos
3. Soporte para la inserción de JavaScript local y global.
Características para personalizar el complemento para el uso de sus clientes
4. Módulos personalizados
5. Ganchos para el código personalizado
6. Control de acceso de usuario
Características en Beaver Themer que guarda el trabajo de desarrollo
7. Aspectos personalizados “temas”, contenido dinámico, lógica condicional
Funciona para personalizar a su constructor de castores.
Beaver Builder está construido en el Bootstrap 3 y 4, lo que significa que está diseñado para responder de inmediato, y puede adaptarse al contenido de su corazón. El editor de Beaver Builder tiene una forma receptiva de edición, lo que significa que puede obtener una vista previa de la apariencia de un tamaño grande, medio y pequeño del dispositivo y editar directamente la apariencia para cada tamaño del dispositivo. Hay muchas formas en que puede personalizar su apariencia para verse bien en cada tamaño de pantalla. Configuración de estilo receptivo: muchas de las configuraciones promedio, columnas y constructor de castores, como bordes, relleno, tipografía y bordes, se pueden establecer de manera diferente para cada tamaño del dispositivo.
Puntos de interrupción: los puntos de interrupción definen el ancho de la pantalla para dispositivos grandes, medianos y pequeños, que juegan un papel en el comportamiento receptivo. Puede modificar estas configuraciones de los puntos de interrupción global en el complemento o tema de Beaver Builder.
Apilamiento: Beaver Builder sofoca automáticamente las columnas a medida que disminuye el tamaño de la pantalla, pero puede revertir o controlar el comportamiento de apilamiento de columnas predeterminadas.
Espaciado: Beaver Builder reduce automáticamente los bordes izquierdo y derecho y el relleno en dispositivos pequeños, pero puede cancelar o eliminar este espacio automático.
Visibilidad: puede elegir las dimensiones del dispositivo (grande, mediano o pequeño) en el que se ve una fila, columna o módulo. Por ejemplo, puede tener un módulo de visualización de fotos en dispositivos grandes y medianos y un segundo módulo fotográfico con una versión adaptada para dispositivos móviles para visualizar en dispositivos móviles.
Y recuerde que no es más fácil crear estos modelos, pero es aún más fácil para usted y sus clientes mantenerlos y actualizarlos. Esto elimina muchos trabajos de mantenimiento, donde volverá para revisar y revisar el código personalizado. El soporte de código corto de Beaver Builder incluye un soporte robusto para códigos cortos, que le permite realizar funciones en lugares donde normalmente no podría hacerlo. Un uso común de ellos es mostrar un módulo Beaver Builder en un widget estándar en la barra lateral. Puede crear códigos cortos para cualquier contenido de Beaver Builder que tenga un Slog o una ID, incluidas publicaciones, páginas, comercio electrónico y filas, columnas, módulos y tonos guardados. Dentro de un aspecto de Beaver Builder, puede insertarlos en cualquier módulo con un campo de texto o editor de texto. También puede usar códigos cortos para publicaciones o páginas creadas con el editor estándar de WordPress.
Los códigos cortos le permiten hacer algunas cosas únicas, como ingresar un módulo en otro módulo. Por ejemplo, puede insertar un módulo de galería en un módulo de archivo para mostrar una galería de imágenes en uno de los archivos. Aquí hay un ejemplo de modo fotográfico de Beaver Builder en un módulo de precios:
3. Javascript Beaver Builder facilita la inserción de JavaScript personalizado. Aquí hay algunos usos comunes de JavaScript:
Crear pantallas de carga personalizadas
Agregue animaciones para darle vida a una página o hacer que una sección en particular se destaque

Vuelva a llamar la atención sobre elementos importantes como el botón Action -to -Do (CTA).
Agregar código para Google Analytics
Independientemente de lo que desee hacer con JavaScript, Beaver Builder puede ayudarlo a hacer esto. Puede aplicar JavaScript a todo el sitio, una sola página o un cierto lugar en el aspecto de la página. No importa dónde lo desee, siempre que tenga el código, nuestro generador de páginas simplifica su aplicación. Para aplicar JavaScript personalizado en todo el sitio, abra el editor de Beaver Builder y haga clic en el menú desplegable en la esquina superior izquierda para exponer el menú de herramientas. Luego seleccione Configuración global:
Haga clic en la pestaña JavaScript, ingrese el código y haga clic en Guardar. Para agregar JavaScript personalizado a una sola página, abra la página en el editor de Beaver Builder y abra el mismo menú. Este tiempo seleccione CSS y JavaScript Apariencia:
Haga clic en la pestaña JavaScript, ingrese el código y haga clic en Guardar. Para aplicar JavaScript personalizado en cierto punto de la página, puede usar el módulo HTML Beaver Builder. Desde el constructor, haga clic en el botón Plus (+) en la esquina superior derecha, luego busque html:
Extraiga el módulo donde quiera en la página, luego ingrese el código en la pestaña General y haga clic en Guardar para actualizarlo:
Si está utilizando el tema Beaver Builder, el personalizador tiene una pestaña de código en la que puede ingresar JavaScript y otro código en la etiqueta , inmediatamente después de la etiqueta o inmediatamente antes de la etiqueta de cierre :

Características para personalizar el complemento 4. Módulos personalizados Beaver Builder Permite a los desarrolladores crear sus propios módulos personalizados que completen con los paneles de configuración detallados, así como módulos de stock proporcionados con el complemento. Esto abre posibilidades casi ilimitadas de personalizar el generador de página para que se ajuste tanto a sus necesidades como a sus clientes. Para crear un módulo personalizado en Beaver Builder, siga cinco pasos simples: cree un nuevo complemento. Esto evita sobrescribir sus módulos durante las actualizaciones de Beaver Builder.

Agregue el módulo al nuevo complemento. Debe guardar como un archivo PHP en el directorio de arado.

Defina la configuración de su módulo. Estas son las opciones personalizadas que desea aparecer en el editor de Beaver Builder.

Agregue el código HTML delantero. Esto determina cómo el módulo reproduce el código HTML para cada instancia del módulo en el frente.

Modele su módulo. Use CSS y JavaScript para agregar estilos.
Para obtener algunos ejemplos sorprendentes de lo que puede hacer con módulos personalizados, consulte a aquellos que vienen a Powerpack para Beaver Builder de IdeaBox Creations.
Algunos ejemplos incluyen menús deslizantes, galerías de video, un contenido y un recuento inverso. Si necesita más inspiración, consulte nuestra lista de recursos recomendados. Para obtener instrucciones completas sobre el proceso de desarrollo de los propios módulos, lea nuestra documentación personalizada con módulos. 5. Las acciones y filtros personalizados de Beaver Builder incluyen un apoyo robusto para ganchos personalizados. Aunque el complemento incluye una gran biblioteca de módulos, no se limita a elementos predeterminados y opciones de apariencia. Aquí hay una lista de usos comunes de los filtros de Beaver Builder, con enlaces a la lista completa de enchufes Algunos de los ganchos disponibles le permiten:
Agregue nuevas familias de fuentes a su sitio web
Crear nuevas zonas de widget
Editar los aspectos de contenido predeterminados
Incorporar campos personalizados

El tema Beaver Builder también incluye ganchos y filtros si desea usarlo con el generador de páginas para crear soluciones únicas para sus clientes. De temas. 6. Control de acceso de usuario ¿Alguna vez ha trabajado con un proyecto completo en un proyecto para un cliente y lo ha enseñado, solo para que rompan algo casi de inmediato? Beaver Builder puede ayudarlo a prevenir tales problemas. La configuración de acceso al usuario le permite limitar a qué pueden acceder y modificar otros usuarios. Al hacer algunos ajustes de permisos, no tendrá que preocuparse de que alguien esté jugando detrás de escena y cambie accidentalmente la configuración clave o elimine el contenido importante. Para editar la configuración de acceso al usuario, explore la configuración> Beaver Builder> Acceso de usuario en la placa de WordPress: desde aquí, puede especificar qué roles de usuario de WordPress puede realizar ciertas acciones. Esto incluye quién puede acceder al editor Beaver Builder, quién puede hacer ediciones sin restricciones y quién tiene acceso al menú Beaver Builder con plantillas, columnas, columnas y módulos. Cada opción se puede verificar o descargar para cada rol de usuario de WordPress (administrador, editor, colaborador, autor):
Para obtener más información, consulte la documentación de acceso oficial para los usuarios. Si desea ajustar aún más el acceso de los usuarios, consulte el complemento extendido de acceso de la tercera parte del usuario. 7. Desarrollador de trabajo de trabajo: Beaver Themer Aunque WordPress requiere un tema, los desarrolladores a menudo quieren un marco, para que puedan crear sus propias personalizaciones fuera del área de contenido y publicar contenido. Beaver Themer es un intercambiador de juegos para la personalización, por varias razones. Tipos de apariencia Puede crear modelos de constructor de castores para partes de la página normalmente tema: encabezados, sótanos, páginas de archivo, publicaciones únicas, 404 páginas y páginas de búsqueda. Debido a que los diseños se crean en Beaver Builder, se benefician de todas las ventajas descritas en otras Secciones, como la receptividad y la capacidad de sus clientes para realizar fácilmente cambios en los diseños. Un tipo de aspecto realmente útil es la parte. Puede crear una o más líneas de contenido como parte y puede insertarlo en cualquier ubicación de la página ofrecida por una ubicación de WordPress: cierre de la página o cierre de la página, antes o después del encabezado, antes o después del área de contenido y así sucesivamente . Los aspectos de las partes temáticas son perfectos para pancartas que desea insertar en un subconjunto de páginas en su sitio y eliminarlas con un solo clic cuando ya no son relevantes. Aquí hay un ejemplo de la parte temática utilizada como pancarta antes del encabezado, que también es un aspecto del tema:
Cuando termine el evento, simplemente cancele la publicación de la parte de los problemas de los temas y volverá al estado de boceto. Como puede ver en esta captura de pantalla, es una operación de un solo clic para cancelar la apariencia de la apariencia: Contenido dinámico: consulta y las conexiones de campo de Beaver Themer tienen dos mecanismos para un cambio dinámico en apariencia dependiendo de dónde aparezca: Consulta de campo y consulta de campo y conexiones. Para los archivos, puede especificar si un módulo de publicación utiliza una consulta principal o consulta personalizada. Para la consulta principal, WordPress utiliza el bucle estándar para generar las listas de publicación correctas de acuerdo con la ubicación del archivo. Aquí hay un ejemplo de una captura de pantalla para una publicación personalizada llamada casas con una serie de campos personalizados creados con campos personalizados avanzados de complementos. La ubicación del aspecto del archivo del tema se establece en la página del archivo de la casa, y la consulta principal muestra los resultados correctos.
Por otro lado, una consulta personalizada le permite filtrar las publicaciones que se muestran de diferentes maneras. Los resultados no cambiarán dependiendo de dónde los muestre en el sitio. El otro mecanismo que inserta contenido de acuerdo con su ubicación son las conexiones de los campos, que son conexiones a los campos en la base de datos de su sitio. Por ejemplo, si crea un aspecto de encabezado, puede especificar una conexión de campo al título, que se conecta al sitio de título de campo de WordPress desde Configuración> General. Si el valor de ese campo alguna vez cambia, su sitio actualiza automáticamente el contenido donde sea que se use. Otro ejemplo: si crea un aspecto de tema único para mostrar publicaciones únicas, use la conexión de campo post -tito, de modo que aparezca el título de publicación correcto donde se aplique el aspecto respectivo. Aquí hay un ejemplo de apariencia de Themer para publicaciones con una conexión con el campo de título de publicación. Independientemente de la página en la vista previa en este aspecto, el título de la página cambia para que coincida con la publicación.
Las conexiones de campo funcionan para cualquier tipo de publicación personalizada. Puede usar conexiones de campo como códigos cortos o puede crear códigos cortos acondicionados, que proporcionan la posibilidad de verificar ciertos valores en la base de datos antes de mostrar el contenido. En el ejemplo anterior del tipo de publicación personalizado, el módulo de publicación tiene una apariencia personalizada que utiliza códigos de conexión de campo cortos para hacerse cargo de los valores de campo personalizados correctos para cada publicación. Mientras Beaver Themer esté instalado, todas estas funciones se pueden usar en los planes habituales de Beaver Builder, así como en los planes de Themer, para que también obtenga más versatilidad con los aspectos estándar de Beaver Builder. La lógica condicional Beaver Themer le permite aplicar la lógica condicional para brindarle un control adicional sobre los lugares donde aparecen los aspectos, líneas, columnas o módulos. Por ejemplo, puede mostrar una apariencia de Themer cuando un visitante ha conectado otro aspecto de lo contrario. Hay muchas condiciones para elegir y, como las conexiones de campo, puede usar la lógica condicional en los aspectos habituales de Beaver Builder. Si necesita ayuda adicional, también tenemos una colección de Video Beaver Themer que puede consultar. Conclusión Beaver Builder ofrece una variedad de herramientas flexibles y potentes para facilitar la construcción de sitios web.