Último wpbakery drag & amp;Guía de constructor de páginas

WPBakery Page Builder (anteriormente Visual Composer) se ha convertido en una de las mejores páginas de ventas para WordPress. Desde que se lanzó en mayo de 2011, el complemento ha explotado con más de 150,000 clientes (y esto no importa los cientos de miles de usuarios que han recibido una copia de un tema), más de 200 suplementos y extensiones y cientos de revisiones positivas. en Internet. Si aún no tiene su propia copia del complemento, probablemente la haya visto en el pasado con un tema premium de WordPress. O tal vez te encuentras con una antigua guía de compositor visual (porque este era el nombre original del complemento, un poco confundido, lo sabemos) en algún lugar de la web. Mucho ha cambiado desde la primera vez que Visual Composer ahora se ha lanzado ahora llamado WPBAKERY PIGE, por lo que queríamos guiarlo a través de todas las maravillosas características que componen este poderoso complemento.
Conoce a WPBakery Page Builder

Si no está familiarizado, WPBakery Page Builder es un complemento para generar páginas de arrastrar y soltar para WordPress. Este práctico complemento elimina la parte difícil de crear publicaciones y páginas de WordPress con un aspecto personalizado. No se requiere conocimiento de codificación. Simplemente instale el complemento y puede comenzar a crear sus publicaciones y páginas. También es compatible con la mayoría de los temas gratuitos y de premio, además es completamente compatible con complementos populares como el formulario de contacto 7, la revolución del control deslizante y muchos más (que llegaremos luego).
Instalación de WPBakery Page Builder antes de que pueda crear sus propias páginas, deberá descargar e instalar WPBakery Pege. Hay dos formas de garantizar una copia del complemento: compre su propia copia o compre un tema premium con el complemento incluido. El complemento funciona exactamente igual, independientemente de la ruta que elija, la única diferencia entre estos dos métodos es cómo lo instala. Opción 1: Compre su propia copia en su sitio de WordPress. Su primera forma de poner su mano en una copia del WPBakery Puilder es comprar el complemento para usted. Simplemente vaya a CodeCanyon, agregue una copia de Wpbakery Puilder en el carro que agrega soporte adicional para tener un año completo de asistencia del autor del complemento) y complete la compra. Luego explore la página de descarga. Haga clic en el botón de descarga verde junto al complemento de la página WPBakery que acaba de comprar y seleccione solo el archivo instalado de WordPress.

Ahora inicie sesión en el tablero de WordPress y explore los complementos> Agregar un nuevo. Haga clic en el botón de carga del complemento en la parte superior de la pantalla.

Seleccione el archivo zip de WPBakery Page Builder que ha descargado desde CodeCanyon. Luego haga clic para instalar y activar el complemento. Debido a que ha comprado el complemento, también deberá agregar el código de licencia para completar el proceso de activación. Simplemente haga clic en el enlace en la parte superior de la pantalla y luego en el botón Azul gigante para activar su constructor de páginas WPBakery.

Esto abrirá un portal para permitir que WPBakery revise su compra. Haga clic en el botón de aprobación Green Big Green. No se preocupe, solo le dé permiso a WPBakery para confirmar que su nombre de usuario / correo electrónico realmente ha comprado una copia de Wpbakery Puilder. Siga las instrucciones para completar la activación y regresar al tablero de WordPress. ¡Ahora estás listo para comenzar a construir! Opción 2: WPBakery Page Builder (anteriormente Visual Composer) se ha incluido con su tema de WordPress si ha comprado un tema con Wpbakery Page Builder o el compositor visual anterior incluido es diferente y también puede variar según el autor. Le mostraremos cómo instalar el complemento si usa un tema WPEXProrer como Total (y debería ser bastante similar a la mayoría de los otros temas premium).

Primero deberá descargar e instalar el tema de WordPress. Si ha comprado un tema de ThemeForest, es el mismo proceso que el WPBakery Page Builder. Inicie sesión en su cuenta ThemeForest y vaya a su página de descarga. Luego localice el tema, haga clic en el botón Descargar y seleccione solo el archivo instalado de WordPress.

Luego, inicie sesión en la instalación de WordPress y haga clic en el aspecto> Temas> Agregar nuevo. Luego haga clic en la opción de carga en la parte superior de la página. Deberá abrir el archivo ZIP descargado para localizar el archivo de WordPress instalado. Esto se debe a que el tema total se incluye con funciones adicionales, como complementos premium, datos de muestra y archivos PSD.
Después de haber localizado el archivo, puede cargar, instalar y activar el tema. Después de la activación, Total le pedirá que instale complementos recomendados, incluido WPBakery Page Builder. Haga clic en el enlace para comenzar a instalar complementos. Seleccione la instalación en el menú de caída del bloque, marque todos los complementos que desea instalar y luego haga clic en.

¡Eso es todo lo que tienes que hacer! No necesita activar WPBakery Page Builder a través de Envato. Debido a que ha comprado un tema en lugar de su propia copia del complemento, no tiene un código de licencia para verificar y no tendrá acceso a las actualizaciones del complemento hasta que el autor las proporcione.

Por supuesto, si desea comprar su propia copia para recibir actualizaciones más rápido, es posible, pero no es necesario usar el constructor de páginas WPBakery con su tema, puede ir al uso real del complemento. Las nociones introductorias sobre WPBakery Page Builder ahora que tiene WPBakery Page Builder, es hora de comenzar con la configuración del complemento. En el tablero de WordPress ahora debe ver una opción de compositor visual. Haga clic para abrir su página de configuración.

La pestaña Configuración general contiene opciones simples para activar / desactivar elementos receptivos del apilamiento en pantallas pequeñas (por lo que puede tener una fila estándar de tres columnas para convertirse en tres filas de columna únicas en comparación con las tres columnas en el móvil), seleccionando un subconjunto de Google Fuente y un botón de descanso para activar los recorridos de WPBakery Page Builder nuevamente.

Si su sitio web utiliza múltiples roles de usuario, entonces WPBakery Peuber Role Manager definitivamente será útil. Esta página de configuración le permite restringir el acceso del usuario a diferentes funciones visuales de constructor de páginas wpbakery. De esta manera, puede permitir que los administradores accedan a todas las funciones, al tiempo que limita a los editores solo a las páginas de blog y a los contribuyentes a nada. Mencioné esto anteriormente durante la instalación, pero la pestaña Licencia de producto es donde puede verificar su código de licencia si ha comprado su propia copia del complemento. Si su copia de constructor de páginas wpbakery vino con un tema, puede ignorar esta sección. Elementos para el generador de páginas

WPBakery Page Builder viene con más de 34 elementos de generación de páginas estándar para muchas funciones que desea agregar a sus páginas (la captura de pantalla anterior los muestra a todos, además del formulario de contacto 7 del que hablaremos tarde). Muchos de los elementos incluyen opciones adicionales para colores, bordes, llenado, bordes, CSS personalizados, animaciones y más. Aquí hay una breve presentación de lo que se incluye:

Las filas son la página de sus páginas, utilizará el elemento de fila para crear columnas e insertar todos los demás elementos de la página.

Los bloques de texto son exactamente como parece: bloques de texto. Usando el editor estándar de WordPress Wysiwyg, puede agregar texto con este módulo.
Los íconos incluyen iconos de fuentes de las siguientes bibliotecas de iconos: Fontaweam, Open Iconic, Typicons, Entypo, Linecons y Mono Social.

Separador y separador con texto son formas de crear descansos de línea (y texto) entre las secciones que crea en sus páginas.
Facebook, Tweet, Google+ y Pinterest son todos los botones simples de intercambio social que puede agregar para que los usuarios compartan la página que cree.
Las preguntas frecuentes son interruptores que se pueden usar para agregar contenido oculto que los usuarios pueden revelar mientras leen su página.
La única imagen es solo una imagen simple con opciones adicionales para dimensionar, animación, enlace y más.
Las pestañas, los recorridos y los acordeones son similares a las preguntas frecuentes, ya que contienen contenido oculto o plegable, pero con la primera sección abierta.
Un contenedor amatible es una diapositiva de contenido básico (pero puede insertar casi cualquier elemento generador de página en cada “página” del contenedor).
Los títulos personalizados facilitan la adición de sus propios títulos a las secciones que utilizan fuentes personalizadas, dimensiones, colores y más.
Los botones le permiten agregar enlaces a otras páginas o sitios externos.
Un impulso a la acción es un cuadro de notificación con un botón adicional que atrae la atención de los usuarios y le permite agregar contenido convincente.
La barra lateral widgetizada le permite insertar su propia barra lateral personalizada en cualquier lugar de la página.
El reproductor de video facilita la inserción de diferentes formatos de video aceptados por WordPress.
Google Maps es otra opción simple: simplemente pegue el mapa de Google para insertar un mapa en su página.
Las barras de progreso, los diagramas, los diagramas redondos y los diagramas lineales son todas formas de gráficos o mostrar datos o habilidades. El espacio vacío simplifica una ruptura vertical entre elementos.
Las GID de publicación, medios de comunicación, mampostería y mampostería de medios son cuadrículas personalizadas que puede agregar a las páginas (con la opción de combinar y combinar los tipos de publicación o medios).
El complemento también incluye 8 elementos de widget que se pueden usar para construir su propia barra lateral si elige hacerlo. Se vuelven útiles al crear páginas de destino personalizadas en las que la barra lateral podría no estar en una ubicación de página típica o si todo su sitio web es una gran red de páginas de destino, con dos que no usan la misma barra. WPBakery Page Builder Extensions Visual Compose Basics son excelentes para comenzar, pero al final querrá o necesitará más para crear sus aspectos de página personalizados. Esto es posible a través de extensiones. Hay algunas fuentes diferentes para las extensiones de constructor de páginas de WPBakery.
La primera forma de expandir su constructor de páginas WPBakery es a través de su base. Un excelente ejemplo es nuestro tema total de WordPress, que incluye 39 elementos agregados al generador de páginas. Estos se incluyen exclusivamente con Total para trabajar con sus funciones, por lo que debe tener el tema instalado y activo para usarlas. El total incluye extensiones para tipos de puestos personalizados (testimonios, personal, carteras), galerías deslizantes simples y personalizadas y más. Esto le hace más fácil agregar el contenido deseado donde desee.
Si su tema no incluye extensiones, puede instalar WPBakery Page Builder Extensions. Estos pueden variar desde gratuitos hasta $ 55 y están disponibles en una variedad de autores en CodeCanyon y Web. Si desea agregar algunas características adicionales, como tablas de precios y redes sociales, entonces está libre de códigos cortos Symple gratuitos (lo creé aquí en WPEXPLORER). Si desea agregar más opciones, entonces un complemento premium, como Ultimate Add -on, podría ser adecuado para usted. Hay literalmente cientos de opciones: puede ver una lista completa de programas de finalización compatibles en WPBakery. Sin embargo, elija expandir WPBakery Page Builder, le recomendamos que no use todas las extensiones y complementos del tema al mismo tiempo. Más no siempre es mejor, especialmente en este caso. Esto no solo creará muchas opciones de superposición y duplicación, sino que ralentizará su sitio (una tonelada de código ingresa a cada elemento de generación de páginas). Así que elija la extensión que funcione mejor para usted y quédese con ella. Editar backend y frantend con WPBakery Page Builder no se limitan a cómo puede construir y editar las páginas. Con este poderoso complemento, tiene la opción de hacer cambios desde el fondo modular o desde el frente visual.
Si elige usar el editor de backend, cada elemento se muestra como un elemento modular que puede insertar, tirar y arreglar en su lugar. Este método es excelente si desea tener una estructura de alambre rápidamente con lo que desea mostrar su página y también puede ser más rápido que el frente si tiene un servidor más lento o una conexión a Internet. El editor de backend es bastante fácil de usar. Simplemente haga clic en el botón Azul para el editor de backend para activar el generador de página para la página o publique que edite. Luego haga clic en el botón Turquoise para agregar elementos.
¡Desde aquí puede comenzar a insertar todos los elementos de página deseados!
Editor delantero

El editor de Frontend ofrece una imagen mucho mejor del aspecto de su página final, ya que es esencialmente un editor visual de tiempo real. Le permite insertar los mismos elementos del generador de páginas que el editor de backend, con la ventaja adicional de poder verlos en lugar de un módulo. Puede ver qué tan grande se ve una imagen de 300 px o si un botón morado con un valor hexagonal # 6E2F93. Para activar la edición de Frontand, haga clic en cualquiera de las dos opciones del editor frontend para su página o publicación.

Esto refrescará su pantalla y lo llevará a una publicación en vivo en vivo o una vista previa de página con el mismo edificio de la página que el editor de backend.

Simplemente haga clic para comenzar a agregar elementos. La principal diferencia aquí es que ahora puede ver elementos mientras los inserta y puede usar las opciones de vista previa en la barra superior para tener una idea de cómo se verá su página en computadoras de escritorio, computadoras portátiles, tabletas y teléfonos. Agregando y editando los elementos de la página Si usa el editor trasero o delantero, tendrá las mismas opciones para personalizar los diferentes elementos del constructor de páginas. Aunque las opciones varían entre los elementos, hay algunas características clave que debe saber después de insertar el elemento.

Lo que quiera agregar a su página, primero debe ingresar una fila. Una vez insertado, puede pasar el elemento frontend para revelar las opciones de la fila azul (en el backynd siempre son visibles en la parte superior de cada fila).
El icono de la primera fila es el lugar donde puede hacer clic para deslizarse y establecer el giro en una nueva posición en su página.

El icono de lápiz abre opciones para configuraciones ordinarias. Pueden variar según su tema con el tema total, verá opciones para la identificación de desplazamiento local, fila (para filas de ancho completo), altura total, altura mínima, visibilidad móvil, contenido centrado, columnas con alturas iguales, animación, tipografía, máximo Ancho, espaciado de columnas, video de fondo o opciones de paralaje y diseño (borde, borde, forro, imagen de color / fondo).


Las columnas deben definir el número de columnas en su turno. Hay opciones predeterminadas para hasta 6 columnas, pero también puede definir su propio aspecto personalizado de la columna, si lo desea. Además, agrega una nueva línea debajo de la que edita.

El icono duplicado clonará su giro actual y todo su contenido (es decir, todos los elementos que ha insertado en una fila). Esto es genial si desea reutilizar una fila varias veces en la misma página.
La basura es simplemente eliminar una fila completa y su contenido.

Opciones de columna

Cuando se fila en el editor frontend, también verá opciones de columna amarilla (en backend encontrará las mismas opciones e iconos que se muestran sobre cada columna).

El icono de la primera columna es el mismo que las filas: haga clic en ella para deslizarse y colocar y reorganizar las columnas en su turno.
El lápiz es la configuración general de la columna. Similar a las filas, las opciones de columnas pueden variar según el tema que use. Las siguientes opciones están disponibles con total: visibilidad móvil, animación, impresión, altura mínima, opciones de diseño (borde, borde, revestimiento, fondo) y configuraciones de reacción (compensación personalizada, ancho o opciones ocultas dependiendo del dispositivo).
Para las columnas, el icono Plus agregará un elemento a la parte superior de la columna, por encima de cualquier otro ya insertado.
Nuevamente, el ícono del contenedor de basura es eliminar toda la columna más su contenido. Después de eliminar una columna, las columnas restantes conservan su tamaño (si elimina 1 de 3 columnas, las 2 columnas restantes continuarán siendo 1/3 columnas), así que no olvide cambiar los ancho de la columna vertebral.
A su vez o columnas, usará el icono más para insertar un elemento de página. En la captura de pantalla de arriba, agregué un cuadro de mensaje. Al ingresar un elemento, la configuración se abrirá automáticamente. Para editar un elemento que ya ha agregado, simplemente coloque el cursor en el elemento en el editor frontal o posterior para revelar las siguientes opciones:
El icono del lápiz abrirá la configuración (que se describe a continuación).
El icono duplicado clonará el elemento de su página tal como lo tiene (Configuración y todo).
Finalmente, la basura solo eliminará el elemento de su generador de página. Desde la fila o la columna donde la ha insertado, dejando todos los demás elementos en el tacto.

Opciones generales del elemento de la página
Al insertar un nuevo elemento o hacer clic en el icono del lápiz para obtener un elemento, abrirá la configuración de elementos de generación de la página. Estos se dividen (en su mayor parte) en varias pestañas para facilitar la vista de todas las opciones de personalización disponibles. Además de la pestaña Configuración, hay un icono de la rueda en la esquina superior derecha que puede usar para guardar la configuración seleccionada como un preajuste para ser reutilizado más adelante o como predeterminado que se utilizará automáticamente cada vez que ingrese este elemento específico. La pestaña General incluye opciones generales para el elemento de página. Estos variarán según el elemento que inserte (pero, en cada caso, la edición es tan simple como el uso de un menú de caída, selector de color, marca o cuadro de texto). Por ejemplo, la captura de pantalla de la captura de pantalla anterior incluye opciones para un estilo, forma, color, icono, texto y animación. Pero si ingresa un botón en su lugar, encontrará opciones de texto, URL, estilo, forma, color, tamaño, alineación, icono y animación. Diseño de elementos de página
La pestaña Opciones de diseño es la segunda pestaña estándar que verá en casi todos los elementos de generación de páginas. Desde aquí, puede agregar un fondo personalizado (color o imagen), borde, llenado y borde a su elemento. Las opciones para simplificar los comandos reducen las opciones del cuadro CSS, por lo que puede ingresar un valor universal para cada opción (margen, borde y relleno). Una nota para recordar: al aplicar un fondo, está contenido dentro del borde. Por lo tanto, aumentar su llenado aumentará el fondo visible agregado alrededor de su elemento, pero si aumenta su margen, aumentará el espacio vacío alrededor de su página (revelando el giro / página detrás de él), por supuesto, dependiendo de cómo ingrese su elemento de página puede tener más pestañas. Por ejemplo, la cuadrícula post del constructor agregó opciones para configuración de datos y diseño de elementos. Y si utiliza elementos de página personalizados a través de una extensión como el GID total del personal, puede haber más opciones incorporadas (como opciones de consulta, corte de imagen personalizado, meta, enlaces sociales, extractos, etc.) dependiendo de la extensión del autor incluida .Nota: puede consultar una lista completa de elementos en nuestra guía del módulo Total Builder. Sin embargo, la mejor manera de averiguar qué hace cada módulo es jugar con el constructor. Cree una página de prueba y practique insertar y editar elementos. ¡Te pondrás al día rápidamente y construirás páginas como profesional!
Complementos compatibles populares Además de las extensiones de constructor de páginas WPBakery, muchos complementos populares son compatibles con el fabricante y agregan su propio elemento de páginas automáticamente. Estos son algunos de los muchos complementos que disfrutará trabajando perfectamente con el complemento WPBakery Page Builder para crear páginas aún mejores. Este complemento no solo es gratuito y está lleno de funciones maravillosas, sino que es totalmente compatible con WPbakery Page Builder. Una vez instalado y activado, WooCommerce no solo agregará su propia configuración y opciones, sino que también agregará 17 páginas nuevas para jugar.
Slider Revolution: Slider es una excelente manera de agregar una sección que atrae la atención y contiene contenido en cualquier página, y Slider Revolution es un complemento perfecto para hacerlo exactamente. Con este complemento, también puede dibujar los medidores, como texto, botones, imágenes e incluso videos, todos con animaciones y efectos agregados para crear diapositivas impresionantes. ¡Vea muchas de nuestras manifestaciones totales en acción!
Capaslider: otra excelente opción para diapositivas es el complemento de capas. Es tan maravilloso como una revolución deslizante, pero con una interfaz y opciones ligeramente diferentes. Incluso incluye un constructor de transiciones personalizado, por lo que puede crear animaciones únicas. También es una de las dos diapositivas premium incluidas en nuestro tema total de WordPress, por lo que sabe que es bastante bueno.

Formulario de contacto 7: Los formularios de contacto son una parte importante de cualquier sitio web, ya sea que sea un blogger con un formulario de investigaciones comerciales o un dentista con un formulario de programación. El Formulario de contacto 7 es completamente gratuito, flexible y con WPBakery Page Builder insertando sus formularios de contacto es fácil con el formulario personalizado Element.wpml: Si necesita crear un sitio web multilingüe, WPML es una de las principales opciones para traducir publicaciones y traducción. Sus páginas, además, WPML es totalmente compatible con WPBakery Page Builder, por lo que puede traducir cada página personalizada que cree.
Polylang: si no desea invertir en WPML, PolyLang es una excelente opción gratuita, que es totalmente compatible con WPBakery Pge Builder (es uno de los complementos gratuitos que recomendamos hacer su WordPress multilingv).
Yoast SEO: Yoast facilita para cualquier usuario la mejora de SEO en el acto. Hay muchas funciones de SEO importantes, que incluyen sitios sitios, meta descripciones, migas de pan y más. Lo mejor de todo: Yoast SEO juega hermosa con casi todos los constructor, por lo que puede preocuparse por crear mejores páginas en lugar de investigar SEO.
TEMPLATERA: Este complemento no solo es compatible, fue creado por Wpbakery para expandir la funcionalidad del constructor de páginas. Templatera hace posible guardar y reutilizar plantillas, por lo que crea páginas repetidas es fácil. Una vez que se instala el complemento, agrega su propia opción a la configuración de WPBakery Page Builder desde el tablero de WordPress, por lo que es fácil de importar, exportar y reutilizar plantillas (lo que pensé que es una característica tan maravillosa que incluí este complemento con total). ¡Y estamos seguros de que hay muchos otros complementos compatibles geniales! Si tiene dudas sobre la compatibilidad de un nuevo complemento con WPBakery Page Builder, comuníquese con el nuevo autor del complemento y pregunte. Opciones avanzadas para WPBakery Page Builder Para usuarios más avanzados, hay algunas opciones adicionales en el WPBakery Pege Culder que puede usar para agregar códigos cortos personalizados al generador de páginas y crear cuadrículas de medios personalizadas.