Cree sus propios widgets Elementor. No se requiere código.
Conozca Widget Builder de Master Addons, un poderoso puente entre su código personalizado y el editor Elementor. Convierta diseños únicos, interfaces generadas por IA o fragmentos interactivos de CodePen en widgets Elementor completamente funcionales y reutilizables.
La ventaja del creador de widgets
Cree widgets verdaderamente únicos
Cree widgets según las necesidades exactas de su proyecto, algo que las bibliotecas prefabricadas no pueden ofrecer.
Da vida a los diseños de IA y CodePen
Integre directamente UI personalizadas de herramientas de inteligencia artificial o prototipos en vivo de CodePen en su sitio como widgets editables de Elementor.
Control creativo total
Eres dueño de toda la pila: estructura (HTML), estilo (CSS) e interactividad (JS), además de la capacidad de agregar bibliotecas externas.
Reutilice y ahorre tiempo
Cree un widget una vez, guárdelo en su biblioteca y reutilícelo en cualquier proyecto con configuraciones consistentes y editables.
Creado para usuarios avanzados
Si conoce Elementor, puede utilizar Widget Builder. La familiar interfaz basada en pestañas hace que la creación de widgets sea visual e intuitiva.
Widgets personalizados en cualquier sitio
Cree un widget una vez y exportarlo/importarlo fácilmente para usarlo en sitios web de WordPress completamente diferentes, ahorrando un tiempo inmenso
Cree y nombre su widget
Comience estableciendo la identidad de su nuevo componente. Dale un título claro y organízalo dentro de una categoría para un acceso perfecto cada vez que uses Elementor.
- Asigne un título único y descriptivo a su widget.
- Categorízalo para facilitar el acceso futuro en el panel del editor.
- Configure la base básica para su elemento reutilizable.
Diseñar la experiencia del editor
Construya la interfaz con la que interactuarán sus usuarios. Al agregar controles como alternancias y selectores de color, construye visualmente el panel de configuración del widget sin escribir ningún código.
- Agregue controles (texto, color, selección) desde el panel izquierdo.
- Cada control se convierte en una opción editable en Elementor.
- Diseñe visualmente todo el panel de configuración orientado al usuario.
Asigne controles a su código
Aquí es donde su widget se vuelve dinámico. El creador genera códigos cortos inteligentes para cada control, que coloca en sus plantillas para crear enlaces en vivo entre la configuración y la salida.
- Utilice códigos cortos generados automáticamente como {{color}}.
- Péguelos en su código HTML, CSS o JS.
- Cree un enlace directo entre las entradas del editor y la pantalla frontal.
Guardar y utilizar en cualquier lugar
Una vez guardado, su widget personalizado estará listo para la acción. Aparece en el editor Elementor, listo para ser arrastrado a cualquier página y personalizado con la configuración en vivo que creó.
- Ahorre para agregarlo instantáneamente a su panel Elementor.
- Arrastre y suelte el widget en cualquier página.
- Ajuste la configuración en vivo y vea el diseño renderizado al instante.
Widgets listos para usar
Doce diseños Pro y ocho gratuitos. Importe el JSON, edite en Elementor.
¿qué se puede construir realmente?
De la IA al sitio web
Genere una tarjeta de precios compleja o un control deslizante testimonial con una herramienta de diseño de IA, copie el código y conéctelo a Widget Builder. Ahora es un widget Elementor manejable con texto y colores editables.
CodePen a la producción
¿encontraste un impresionante botón animado o una galería única en CodePen? No lo incrustes simplemente, transformalo en un widget nativo donde puedas controlar todos los parámetros.
Construya su propio kit de interfaz de usuario
Cree un conjunto de botones, encabezados o tarjetas de información personalizados con los patrones de interacción únicos de su marca y reutilícelos en todos los sitios de los clientes.
Opciones disponibles
Texto
Agregue entrada de texto básica.
Ingrese solo valores numéricos.
Para entradas de texto más largas.
Rico editor de texto visual.
Ingrese fragmentos de código directamente.
Almacene datos de fondo ocultos.
Activa o desactiva una opción.
Abra la ventana emergente de configuración avanzada.
Elija entre las opciones desplegables.
Elige cualquier color visualmente.
Seleccione una familia de fuentes.
Controla todo el estilo del texto.
Elija una fecha/hora.
Enlaces de entrada o selección.
Cargue o seleccione medios.
Seleccione varias imágenes juntas.
Elija entre la biblioteca de iconos.
Ajuste los valores con el control deslizante.
Establecer acolchado, margen, etc.
Aplique efectos de sombra visualmente.
Establezca las propiedades de fondo del elemento.
Seleccione entre opciones de imagen.
Cree grupos de contenido repetidos.
Organice el contenido en pestañas.
Agregue opciones de color en su widget.